test(transcription): make @mention onKeyDown tests consistent

Wrap all four onKeyDown unit tests (ArrowDown/ArrowUp/Enter/Escape) in
flushSync uniformly so the next reader doesn't have to figure out why
some are wrapped and others aren't. Felix #1 on PR #629 round 3.

Also add a comment above the describe block calling out that these unit
tests do NOT exercise the Tiptap forwarding chain — that is covered by
the 'ArrowDown moves the highlight' integration test. Sara #3 on PR #629
round 3.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-20 00:05:17 +02:00
committed by marcel
parent 8a77e64421
commit d4cfd4c8fd

View File

@@ -258,8 +258,19 @@ describe('MentionDropdown — search input', () => {
// same export so a regression in highlightedIndex/selection logic is caught // same export so a regression in highlightedIndex/selection logic is caught
// at the unit level. The full E2E focus-chain test is deferred to a separate // at the unit level. The full E2E focus-chain test is deferred to a separate
// issue (Playwright). // issue (Playwright).
//
// These unit tests directly invoke the exported `onKeyDown` to pin its
// behaviour in isolation. They do NOT exercise the Tiptap forwarding
// chain (PersonMentionEditor.suggestion.render() returning { onKeyDown })
// — that integration is covered by the 'ArrowDown moves the highlight'
// test in PersonMentionEditor.svelte.spec.ts. Sara on PR #629 round 3.
describe('MentionDropdown — onKeyDown forwarding', () => { describe('MentionDropdown — onKeyDown forwarding', () => {
// flushSync ensures Svelte reactivity propagation completes before
// asserting (uniform across all four key tests so the next reader
// doesn't have to figure out why some are wrapped and others aren't).
// Felix #1 suggestion on PR #629 round 3.
it('ArrowDown advances aria-selected to the next option in the listbox', async () => { it('ArrowDown advances aria-selected to the next option in the listbox', async () => {
const container = document.createElement('div'); const container = document.createElement('div');
document.body.appendChild(container); document.body.appendChild(container);
@@ -338,7 +349,10 @@ describe('MentionDropdown — onKeyDown forwarding', () => {
try { try {
const exports = instance as unknown as { onKeyDown: (e: KeyboardEvent) => boolean }; const exports = instance as unknown as { onKeyDown: (e: KeyboardEvent) => boolean };
const consumed = exports.onKeyDown(new KeyboardEvent('keydown', { key: 'Enter' })); let consumed = false;
flushSync(() => {
consumed = exports.onKeyDown(new KeyboardEvent('keydown', { key: 'Enter' }));
});
expect(consumed).toBe(true); expect(consumed).toBe(true);
expect(command).toHaveBeenCalledTimes(1); expect(command).toHaveBeenCalledTimes(1);
expect(command.mock.calls[0][0].id).toBe('p1'); expect(command.mock.calls[0][0].id).toBe('p1');
@@ -359,7 +373,10 @@ describe('MentionDropdown — onKeyDown forwarding', () => {
}); });
try { try {
const exports = instance as unknown as { onKeyDown: (e: KeyboardEvent) => boolean }; const exports = instance as unknown as { onKeyDown: (e: KeyboardEvent) => boolean };
const consumed = exports.onKeyDown(new KeyboardEvent('keydown', { key: 'Escape' })); let consumed = true;
flushSync(() => {
consumed = exports.onKeyDown(new KeyboardEvent('keydown', { key: 'Escape' }));
});
expect(consumed).toBe(false); expect(consumed).toBe(false);
} finally { } finally {
unmount(instance); unmount(instance);