diff --git a/tests/Browser/NavigationTest.php b/tests/Browser/NavigationTest.php index 0684af4e..5b03570d 100644 --- a/tests/Browser/NavigationTest.php +++ b/tests/Browser/NavigationTest.php @@ -306,6 +306,13 @@ function navigationExtrasProbe(): mixed +
+ + + + +
+
@@ -337,8 +344,8 @@ it('hides the bar on a scroll down and never while a pinned snackbar is on scree $page->script('window.scrollTo(0, 0)'); $page->assertScript("{$hidden} === false"); - $page->script("materialToast('Pinned', { sticky: true })") - ->assertScript("document.querySelector('[data-md-toast-snackbar]')?.textContent.includes('Pinned')"); + $page->script("materialToast('Pinned', { sticky: true })"); + $page->assertScript("document.querySelector('[data-md-toast-snackbar]')?.textContent.includes('Pinned')"); $page->script('window.scrollTo(0, 400)'); $page->assertScript("{$hidden} === false") @@ -369,3 +376,36 @@ it('takes a rail out of the layout entirely when it hides collapsed, and back ov ->assertScript("getComputedStyle(document.querySelector('#hiding-rail [data-md-navigation-rail-panel]')).display === 'flex'") ->assertNoJavaScriptErrors(); }); + +it('takes an adaptive rail out of the layout across the expanded class when it hides collapsed, standing again from large', function () { + $page = navigationExtrasProbe(); + $rail = "document.querySelector('#adaptive-hiding-rail [data-md-navigation-rail]')"; + $railWidth = "Math.round({$rail}.getBoundingClientRect().width)"; + + // `medium` (600-839): the window collapses the rail, not the visitor, so M3's "collapsed rail + // may never hide" holds even with hide-when-collapsed set — it stays at its collapsed width. + $page->resize(839, 900) + ->assertScript("{$railWidth} === 96") + ->assertScript("! {$rail}.hasAttribute('data-md-open')") + ->assertScript("document.documentElement.hasAttribute('data-rail-auto')") + ->assertNoJavaScriptErrors(); + + // `expanded` (840-1199): nothing chosen yet, so the rail is away rather than shown collapsed. + $page->resize(840, 900) + ->assertScript("{$railWidth} === 0") + ->assertScript("! {$rail}.hasAttribute('data-md-open')") + ->assertScript("document.documentElement.hasAttribute('data-rail-auto')") + ->assertNoJavaScriptErrors(); + + $page->resize(1199, 900) + ->assertScript("{$railWidth} === 0") + ->assertScript("document.documentElement.hasAttribute('data-rail-auto')"); + + // `large` (1200+): M3 starts an adaptive rail expanded by default, so it stands in the layout + // again rather than staying away. + $page->resize(1200, 900) + ->assertScript("{$railWidth} === 256") + ->assertScript("! {$rail}.hasAttribute('data-md-open')") + ->assertScript("document.documentElement.hasAttribute('data-rail-auto')") + ->assertNoJavaScriptErrors(); +});