Wait for the timepicker dialog to actually open before focusing it

The period-selector arrow-key test called .focus() on the AM/PM radio
right after clicking the field. show() moves focus into the dialog
from Alpine's $nextTick, which Livewire's bundled Alpine defers with a
real setTimeout(0), not a microtask, so the dialog was still closed
when .focus() ran and it silently did nothing, leaving the arrow key
with no effect (step 36 batch: browser tests for the datepicker/
timepicker rewrite).

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-14 19:50:35 +02:00
co-authored by Claude Sonnet 5
parent 4cc5a7363f
commit c72908458b
+7 -1
View File
@@ -346,7 +346,13 @@ it('moves the period selector between AM and PM with arrow keys, as a radio grou
->click('#meeting')
->assertAttribute($am, 'role', 'radio')
->assertAttribute($am, 'aria-checked', 'true')
->assertAttribute($pm, 'aria-checked', 'false');
->assertAttribute($pm, 'aria-checked', 'false')
// show() moves focus to the dial from inside Alpine's $nextTick, which Livewire's bundled
// Alpine defers with a real setTimeout(0) rather than a microtask: wait for the dialog to
// actually open before stealing focus onto the period selector, or .focus() below is a no-op
// on a still-closed <dialog> and the element beneath it keeps focus instead.
->wait(0.15)
->assertScript("document.querySelector('#meeting-dialog').open");
$page->script("document.querySelector('{$am}').focus()");