fix(brain): give the Add Memory form a submit button and reliable Enter handling

The Brain > Add tab rendered only a text input and category select with no
submit control, and Enter submission relied on a deprecated keypress
listener that is not guaranteed to fire, so the form could not be
submitted at all (#5828).

Add a labelled submit button styled like the neighbouring Skill Import
button (theme-io-btn, inline SVG icon), switch the Enter handler to
keydown with preventDefault, ignore IME composition, and pin both submit
paths with a source-level regression test.

Fixes #5828

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
wbaxterh 2026-07-30 09:33:02 -07:00
parent 25c9e735ef
commit 45e9de7594
3 changed files with 65 additions and 2 deletions

View file

@ -1689,12 +1689,20 @@ function initializeEventListeners() {
const newMemoryInput = el('new-memory-input');
if (newMemoryInput) {
newMemoryInput.addEventListener('keypress', (e) => {
if (e.key === 'Enter') {
// keydown, not the deprecated keypress: keypress is not guaranteed to
// fire for Enter everywhere, which left the Add Memory form with no
// working submit path (#5828).
newMemoryInput.addEventListener('keydown', (e) => {
if (e.key === 'Enter' && !e.isComposing) {
e.preventDefault();
memoryModule.addNewMemory();
}
});
}
const newMemoryAddBtn = el('new-memory-add-btn');
if (newMemoryAddBtn) {
newMemoryAddBtn.addEventListener('click', () => memoryModule.addNewMemory());
}
// Voice recording is handled by the dual-purpose send/mic button (see below)

View file

@ -365,6 +365,7 @@
<span class="skill-rich-ph"><span class="k">Add a memory</span> &mdash; e.g. 'I prefer concise replies' <svg class="k" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-2px;margin-left:4px;" aria-hidden="true"><polyline points="9 10 4 15 9 20"/><path d="M20 4v7a4 4 0 0 1-4 4H4"/></svg></span>
</div>
<select id="new-memory-category" class="memory-edit-cat-select" aria-label="Memory category"></select>
<button type="button" id="new-memory-add-btn" class="theme-io-btn" title="Save this memory" style="flex:none;height:28px;font-size:12px;"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="vertical-align:-2px;margin-right:4px;" aria-hidden="true"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Add</button>
</div>
</div>
<div class="admin-card">

View file

@ -0,0 +1,54 @@
"""The Brain > Add Memory form must be submittable (#5828).
The form previously had no submit button and relied on a deprecated
``keypress`` listener for Enter, which is not guaranteed to fire on all
platforms leaving the form with no working submit path. Pins:
- a visible, keyboard-accessible submit button next to the category select;
- the button wired to ``memoryModule.addNewMemory()``;
- Enter handled via ``keydown`` with ``preventDefault()`` (and no lingering
``keypress`` handler on the input).
"""
from pathlib import Path
APP_JS = Path("static/app.js")
INDEX_HTML = Path("static/index.html")
def _add_memory_row(html):
start = html.index('id="new-memory-input"')
end = html.index("</div>", html.index('id="new-memory-add-btn"', start))
return html[start:end]
def test_add_memory_form_renders_a_submit_button():
html = INDEX_HTML.read_text()
row = _add_memory_row(html)
assert 'id="new-memory-category"' in row, "button must sit in the same row as the form fields"
btn_start = row.index('id="new-memory-add-btn"')
btn_tag = row[row.rindex("<button", 0, btn_start):row.index(">", btn_start)]
assert 'type="button"' in btn_tag, "must not rely on implicit submit semantics"
def _new_memory_wiring_block(source):
start = source.index("const newMemoryInput = el('new-memory-input');")
end = source.index("// Voice recording", start)
return source[start:end]
def test_submit_button_is_wired_to_add_new_memory():
block = _new_memory_wiring_block(APP_JS.read_text())
assert "el('new-memory-add-btn')" in block
assert "addEventListener('click', () => memoryModule.addNewMemory())" in block
def test_enter_uses_keydown_with_prevent_default():
block = _new_memory_wiring_block(APP_JS.read_text())
assert "addEventListener('keydown'" in block
assert "addEventListener('keypress'" not in block, "keypress is deprecated and unreliable for Enter"
assert "e.preventDefault();" in block
assert "!e.isComposing" in block, "IME composition must not submit the form"
assert "memoryModule.addNewMemory();" in block