fix(modal): Enter accepts the fandom instead of reopening the dropdown
CI / lint (push) Successful in 2s
CI / frontend-build (push) Successful in 21s
CI / backend-lint-and-test (push) Successful in 26s
CI / integration (push) Successful in 3m3s

The Enter handler listened in the bubbling phase, so Vuetify's own input handler
(which opens the menu on Enter) fired first and my accept logic saw the menu
already opening and bailed — Enter popped the dropdown instead of submitting.
Bind it in the capture phase so it runs first, and stop the event when a fandom
is already selected so Vuetify never reopens the menu (operator-flagged
2026-06-07).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-07 12:38:33 -04:00
parent a92817677d
commit 677317244e
+14 -6
View File
@@ -19,7 +19,7 @@
:item-title="(f) => f.name"
:item-value="(f) => f.id"
label="Fandom" clearable density="compact"
@keydown.enter="onSearchEnter"
@keydown.enter.capture="onSearchEnter"
@keydown.tab="onSearchTab"
/>
<v-divider class="my-3" />
@@ -92,12 +92,20 @@ function onConfirm () {
if (f) emit('confirm', f)
}
// Enter on the search field. When the menu is open Vuetify is picking the
// highlighted item (it sets selectedId + closes the menu) — don't also accept
// on that keystroke. With the menu closed and a value chosen, Enter accepts.
function onSearchEnter () {
// Enter on the search field — bound in the CAPTURE phase so this runs BEFORE
// Vuetify's own input keydown handler (which opens the menu on Enter). When the
// menu is open, let Vuetify pick the highlighted item (it sets selectedId +
// closes the menu). When it's closed and a fandom is already chosen, accept it
// and stop the event so Vuetify never (re)opens the menu — that re-open was the
// bug: Enter popped the dropdown instead of submitting (operator-flagged
// 2026-06-07).
function onSearchEnter (e) {
if (menuOpen.value) return
if (selectedId.value != null) onConfirm()
if (selectedId.value != null) {
e.preventDefault()
e.stopPropagation()
onConfirm()
}
}
// Tab from the search field goes to the "new fandom" text field (operator-