marcel/familienarchiv
1
0
Fork 0
Code Issues 105 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(transcription): add data-test-search-input hook for E2E selectors

Browse Source 
For issue #380. Adds an explicit Playwright selector attribute on the
mention search input so E2E tests target a stable hook instead of a
fragile CSS class string.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Marcel
2026-05-19 20:56:15 +02:00
committed by marcel
parent fa7fe42363
commit 38b87f6a9f
2 changed files with 13 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/lib/shared/discussion/MentionDropdown.svelte
View File

@@ -149,6 +149,7 @@ function selectItem(item: Person) {
<input <input
id="mention-search" id="mention-search"
type="search" type="search"
data-test-search-input
class="min-h-[44px] w-full bg-transparent font-sans text-sm text-ink placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-inset" class="min-h-[44px] w-full bg-transparent font-sans text-sm text-ink placeholder:text-ink-3 focus:outline-none focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-inset"
placeholder={m.person_mention_search_prompt()} placeholder={m.person_mention_search_prompt()}
bind:value={searchQuery} bind:value={searchQuery}

12
frontend/src/lib/shared/discussion/MentionDropdown.svelte.spec.ts
View File

@@ -41,4 +41,16 @@ describe('MentionDropdown — search input', () => {
await expect.element(page.getByRole('searchbox')).toHaveValue('WdG'); await expect.element(page.getByRole('searchbox')).toHaveValue('WdG');
}); });
it('exposes a data-test-search-input attribute for E2E selectors', async () => {
render(MentionDropdown, {
model: makeModel(),
initialQuery: '',
onSearch: () => {}
});
const input = document.querySelector('[data-test-search-input]');
expect(input).not.toBeNull();
expect((input as HTMLInputElement).type).toBe('search');
});
}); });