diff --git a/frontend/src/lib/shared/discussion/MentionDropdown.svelte b/frontend/src/lib/shared/discussion/MentionDropdown.svelte index 43cd254a..4da12b59 100644 --- a/frontend/src/lib/shared/discussion/MentionDropdown.svelte +++ b/frontend/src/lib/shared/discussion/MentionDropdown.svelte @@ -166,6 +166,7 @@ function selectItem(item: Person) { id="mention-search" type="search" data-test-search-input + maxlength="100" 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()} bind:value={searchQuery} diff --git a/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts b/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts index 72de37ca..a6a10dac 100644 --- a/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts +++ b/frontend/src/lib/shared/discussion/MentionDropdown.svelte.test.ts @@ -154,6 +154,14 @@ describe('MentionDropdown — search input', () => { expect(input.className).toContain('min-h-[44px]'); }); + it('caps the search input at maxlength=100 (CWE-400 amplification — Nora on PR #629)', async () => { + render(MentionDropdown, { props: { model: baseModel() } }); + + const input = document.querySelector('[data-test-search-input]') as HTMLInputElement; + expect(input).not.toBeNull(); + expect(input.maxLength).toBe(100); + }); + it('invokes onSearch with the current value whenever the user types', async () => { const onSearch = vi.fn(); render(MentionDropdown, { props: { model: baseModel(), onSearch } });