From c5a3870b7f1b6529b644083dc0d0d75584dba86e Mon Sep 17 00:00:00 2001 From: Andreas Reinhold / reini Date: Thu, 17 Sep 2026 06:22:02 +0200 Subject: [PATCH] Wait for a standard side sheet to settle before timing its exit in the browser test The test closed the showcase's standard sheet straight after resizing the window and sampled its exit, but the sheet has no transitions until the view settles, two animation frames after Alpine starts, and WebKit had often not run those frames yet: the sheet closed at once, as it is meant to while settling, and the test read that as a missing exit. It failed in Safari when run on its own on 2.1.0's code as well. The sampling script now waits for `data-md-drawer-settled` first. Co-Authored-By: Claude Opus 5 (1M context) --- tests/Browser/ContainmentTest.php | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/tests/Browser/ContainmentTest.php b/tests/Browser/ContainmentTest.php index afaec5cd..903bd08d 100644 --- a/tests/Browser/ContainmentTest.php +++ b/tests/Browser/ContainmentTest.php @@ -522,11 +522,18 @@ it('gives a closing standard side sheet\'s room back to the content beside it as // Closed and sampled in one round trip: the sheet's root caught part-way between its width // and none, still in the layout, while the column beside it has grown part of the way — not - // the whole sheet and its gap handed back in one jump at the end. + // the whole sheet and its gap handed back in one jump at the end. Only once the view has + // settled, two frames after Alpine starts, which WebKit can still be waiting for here: until + // then the sheet has no transitions, on purpose, and closes at once. $midExit = $page->script(<< { const root = {$root} const column = {$column} + + for (let i = 0; i < 100 && ! root.hasAttribute('data-md-drawer-settled'); i++) { + await new Promise((resolve) => setTimeout(resolve, 10)) + } + const open = { root: root.getBoundingClientRect().width, column: column.getBoundingClientRect().width, row: root.parentElement.getBoundingClientRect().width } {$toggle}.click()