CodeSignal · BrianGenisio · Aug 7, 2026 · Aug 7, 2026
diff --git a/i18n/en.json b/i18n/en.json
@@ -42,6 +42,7 @@
     "Response stopped": "Response stopped",
     "Cosmo is responding": "Cosmo is responding",
     "Response complete": "Response complete",
+    "Wait for Cosmo to finish responding before typing.": "Wait for Cosmo to finish responding before typing.",
     "Your message": "Your message",
     "Cosmo's reply": "Cosmo's reply",
     "Regenerate response": "Regenerate response",

diff --git a/i18n/es.json b/i18n/es.json
@@ -42,6 +42,7 @@
     "Response stopped": "Respuesta detenida",
     "Cosmo is responding": "Cosmo está respondiendo",
     "Response complete": "Respuesta completa",
+    "Wait for Cosmo to finish responding before typing.": "Espera a que Cosmo termine de responder antes de escribir.",
     "Your message": "Tu mensaje",
     "Cosmo's reply": "Respuesta de Cosmo",
     "Regenerate response": "Regenerar respuesta",

diff --git a/public/app.js b/public/app.js
@@ -1146,11 +1146,40 @@ function renderMessages(liveMessages, status) {
     });
   }
 
-  const streaming = status === 'streaming';
-  promptInput.disabled = streaming;
+  syncComposerAvailability(status === 'streaming');
   updateSendBtn();
 }
 
+/**
+ * Keep the composer focusable while a reply streams (A3).
+ * Prefer readOnly over disabled so focus is not dropped to <body>, and
+ * explain the wait via aria-describedby. Restore focus on completion if
+ * it fell to the document body.
+ */
+function syncComposerAvailability(streaming) {
+  // Never leave the field disabled — that removes it from the tab order.
+  promptInput.disabled = false;
+  promptInput.readOnly = streaming;
+
+  const hint = document.getElementById('promptInputBusyHint');
+  if (hint) {
+    if (streaming) {
+      hint.textContent = t('Wait for Cosmo to finish responding before typing.');
+      promptInput.setAttribute('aria-describedby', hint.id);
+    } else {
+      hint.textContent = '';
+      promptInput.removeAttribute('aria-describedby');
+    }
+  }
+
+  if (!streaming) {
+    const activeEl = document.activeElement;
+    if (activeEl === document.body || activeEl === document.documentElement) {
+      promptInput.focus({ preventScroll: true });
+    }
+  }
+}
+
 /**
  * Split fingerprints so streaming token ticks can patch prose without
  * recreating the article/heading chrome (keeps VoiceOver's place).

diff --git a/public/index.html b/public/index.html
@@ -106,6 +106,8 @@ <h1 class="heading-small empty-state__heading">What's on your mind?</h1>
               rows="1"
               aria-label="Prompt input"
             ></textarea>
+            <!-- Explains transient readOnly while streaming (A3); wired via aria-describedby. -->
+            <p id="promptInputBusyHint" class="visually-hidden"></p>
           </div>
 
           <div class="composer__toolbar composer_toolarea" role="toolbar" aria-label="Composer actions">

diff --git a/tests/dom/render.test.js b/tests/dom/render.test.js
@@ -365,3 +365,80 @@ describe('accessibility characteristics of re-rendering', () => {
     expect(q('.message__stopped')?.textContent).toBe('Response stopped');
   });
 });
+
+/**
+ * Accessibility acceptance — A3 (composer stays focusable mid-stream).
+ */
+describe('composer availability during streaming (A3)', () => {
+  it('uses readOnly instead of disabled while a response streams', async () => {
+    await bootApp({ messages: [] });
+    const input = q('#promptInput');
+    expect(input.disabled).toBe(false);
+    expect(input.readOnly).toBe(false);
+
+    fakeChats[0].setMessages(
+      [liveAssistant([{ type: 'text', text: 'partial' }], 'streaming')],
+      'streaming',
+    );
+    await settle();
+
+    expect(input.disabled).toBe(false);
+    expect(input.readOnly).toBe(true);
+    expect(input.getAttribute('aria-describedby')).toBe('promptInputBusyHint');
+    expect(q('#promptInputBusyHint').textContent).toBe(
+      'Wait for Cosmo to finish responding before typing.',
+    );
+  });
+
+  it('keeps focus on the composer across a stream tick', async () => {
+    await bootApp({ messages: [] });
+    const input = q('#promptInput');
+    input.focus();
+    expect(document.activeElement).toBe(input);
+
+    fakeChats[0].setMessages(
+      [liveAssistant([{ type: 'text', text: 'Hel' }], 'streaming')],
+      'streaming',
+    );
+    await settle();
+    expect(document.activeElement).toBe(input);
+    expect(input.readOnly).toBe(true);
+
+    fakeChats[0].setMessages(
+      [liveAssistant([{ type: 'text', text: 'Hello' }], 'streaming')],
+      'streaming',
+    );
+    await settle();
+    expect(document.activeElement).toBe(input);
+  });
+
+  it('clears readOnly and restores focus from body when the response completes', async () => {
+    await bootApp({ messages: [] });
+    const input = q('#promptInput');
+
+    fakeChats[0].setMessages(
+      [liveAssistant([{ type: 'text', text: 'partial' }], 'streaming')],
+      'streaming',
+    );
+    await settle();
+    expect(input.readOnly).toBe(true);
+
+    // Simulate the pre-fix failure mode: focus already fallen to <body>.
+    document.body.focus();
+    if (document.activeElement !== document.body) {
+      document.activeElement?.blur?.();
+    }
+    expect(['BODY', 'HTML']).toContain(document.activeElement?.tagName);
+
+    fakeChats[0].setMessages(
+      [liveAssistant([{ type: 'text', text: 'done' }], 'done')],
+      'idle',
+    );
+    await settle();
+
+    expect(input.readOnly).toBe(false);
+    expect(input.disabled).toBe(false);
+    expect(input.hasAttribute('aria-describedby')).toBe(false);
+    expect(document.activeElement).toBe(input);
+  });
+});