fix: chat submission and session handling + 37 Playwright tests

- Fix chip auto-submit: use htmx.trigger() instead of native submit
  to bypass browser validation on required field
- Remove required from input (server validates already)
- Fix session_id duplication: use hx-swap-oob to replace single input
- Fix agent context: use background context with 30s timeout instead
  of HTTP request context (prevents premature cancellation)
- Remove redundant close button from header (toggle button handles it)
- Add 83-chat-mascot.test.mjs: 37 tests covering button, panel,
  help card, chips, typed questions, session, Spanish, positioning
This commit is contained in:
juanatsap
2026-04-08 11:31:09 +01:00
parent b0e8e1ced7
commit 93e33f6496
3 changed files with 405 additions and 32 deletions
+22 -28
View File
@@ -27,11 +27,6 @@
_="on click toggle .visible on #chat-help-card">
<iconify-icon icon="mdi:help-circle-outline"></iconify-icon>
</button>
<button class="chat-close-btn"
_="on click remove .chat-open from #chat-panel
then remove .mascot-active from #chat-toggle-btn">
<iconify-icon icon="mdi:close"></iconify-icon>
</button>
</div>
<!-- Help / Onboarding Card -->
@@ -64,37 +59,37 @@
<!-- Suggested Questions -->
<div class="chat-suggestions">
{{if eq .Lang "es"}}
<button class="chat-chip"
<button type="button" class="chat-chip"
_="on click set #chat-input.value to '¿Qué proyectos en Go ha hecho?'
then send submit to #chat-form">¿Proyectos en Go?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">¿Proyectos en Go?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to '¿Cuántos años de experiencia tiene?'
then send submit to #chat-form">¿Años de experiencia?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">¿Años de experiencia?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to '¿En qué empresas ha trabajado?'
then send submit to #chat-form">¿Empresas?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">¿Empresas?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to '¿Conoce React?'
then send submit to #chat-form">¿Conoce React?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">¿Conoce React?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to '¿Qué certificaciones tiene?'
then send submit to #chat-form">¿Certificaciones?</button>
then call htmx.trigger(#chat-form, 'submit')">¿Certificaciones?</button>
{{else}}
<button class="chat-chip"
<button type="button" class="chat-chip"
_="on click set #chat-input.value to 'What Go projects has he built?'
then send submit to #chat-form">Go projects?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">Go projects?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to 'How many years of experience?'
then send submit to #chat-form">Years of experience?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">Years of experience?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to 'What companies has he worked at?'
then send submit to #chat-form">Companies?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">Companies?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to 'Does he know React?'
then send submit to #chat-form">Knows React?</button>
<button class="chat-chip"
then call htmx.trigger(#chat-form, 'submit')">Knows React?</button>
<button type="button" class="chat-chip"
_="on click set #chat-input.value to 'What certifications?'
then send submit to #chat-form">Certifications?</button>
then call htmx.trigger(#chat-form, 'submit')">Certifications?</button>
{{end}}
</div>
@@ -104,7 +99,7 @@
hx-swap="beforeend scroll:#chat-messages:bottom"
hx-indicator="#chat-typing"
_="on htmx:afterRequest set #chat-input.value to ''">
<input type="hidden" name="session_id" value="">
<input type="hidden" id="chat-session-id" name="session_id" value="">
<input type="hidden" name="lang" value="{{.Lang}}">
<input
type="text"
@@ -112,8 +107,7 @@
name="message"
class="chat-input"
placeholder="{{if eq .Lang "es"}}Pregunta algo sobre el CV...{{else}}Ask something about the CV...{{end}}"
autocomplete="off"
required>
autocomplete="off">
<button type="submit" class="chat-send-btn" aria-label="Send">
<iconify-icon icon="mdi:send"></iconify-icon>
</button>