noNameWEB/livewire-material
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix a chained assertScript() and add adaptive hide-when-collapsed coverage

Browse Source 
navigationExtrasProbe's pinned-snackbar test chained ->assertScript() off
$page->script(), which returns the script's value (null here), not the
page. Also adds the reviewer's requested browser coverage for an adaptive
rail with hide-when-collapsed across 839/840/1199/1200px: collapsed (not
away) at medium, away at expanded with data-rail-auto, standing again by
default from large (plan step 36).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
2026-09-15 01:20:53 +02:00
co-authored by Claude Sonnet 5
parent 26c338be25
commit c214745132
1 changed files with 42 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/Browser/NavigationTest.php
+42 -2
View File
@@ -306,6 +306,13 @@ function navigationExtrasProbe(): mixed
<button type="button" id="open-hiding-rail" x-data x-on:click="$store.rail.show()">Open navigation</button>
</div>
<div id="adaptive-hiding-rail" style="display: flex">
<x-navigation-rail mode="adaptive" hide-when-collapsed>
<x-navigation-rail-item label="Canvas" icon="brush" link="#a" no-wire-navigate active />
<x-navigation-rail-item label="Layers" icon="layers" link="#b" no-wire-navigate />
</x-navigation-rail>
</div>
<div style="height: 250vh"></div>
<x-toast />
@@ -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();
});