feat(transcription): decouple @mention display text from person search (#380) #629
@@ -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}
|
||||||
|
|||||||
@@ -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');
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user