test(frontend): de-flake DetailNavigationSheet typing test via fireEvent.change

Baseline 8/10 fail (80% flake) → 20/20 pass. Root cause was `user.type`
racing the Radix Sheet focus trap, not the `useDebounce` macrotask
theory from the prior investigation: with `defaultOpen=true` Radix sets
`body { pointer-events: none }`, swallowing user-event's internal click,
so keystrokes route to whatever element currently holds focus (the
SheetContent close button) instead of the input. `inputValue` stays
empty and the listbox never narrows.

`fireEvent.change` mirrors the sidestep already used in the
URL-filter AND test in the same file.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Sergey Kozyrenko
2026-05-23 13:36:26 +07:00
co-authored by Claude Opus 4.7
parent 4396aa774f
commit c3bd1d30f2
@@ -279,11 +279,12 @@ describe('DetailNavigationSheet — search input', () => {
});
it('typing narrows the listbox immediately when searchDebounceMs=0', async () => {
const user = userEvent.setup();
renderSheet({ currentId: 'a' });
const input = await screen.findByRole('textbox');
await user.type(input, 'cha');
// `fireEvent.change` — `user.type` races with the Radix focus trap (see
// the URL-filter AND test below for the same sidestep).
fireEvent.change(input, { target: { value: 'cha' } });
const listbox = await screen.findByRole('listbox');