feat(vela): support end-to-end mocked turn cancelation

This commit is contained in:
2026-04-08 19:49:31 +02:00
parent ff78fc4c8f
commit 0d5b53be00
7 changed files with 197 additions and 9 deletions

View File

@@ -46,3 +46,34 @@ test('voice session shell covers the mocked transcript/response slice', async ({
await expect(page.getByTestId('user-transcript')).toHaveText(MOCKED_USER_TRANSCRIPT);
await expect(page.getByTestId('assistant-response')).toHaveText(MOCKED_ASSISTANT_RESPONSE);
});
test('voice session shell can cancel an active mocked turn and start another one', async ({ page }) => {
await page.goto('/');
await expect(page.getByTestId('hydration-status')).toHaveText('ready');
await expect(page.getByTestId('cancel-turn-button')).toBeDisabled();
await page.getByTestId('connect-button').click();
await expect(page.getByTestId('connection-state')).toHaveText('connected');
await expect(page.getByTestId('mocked-turn-button')).toBeEnabled();
await page.getByTestId('mocked-turn-button').click();
await expect(page.getByTestId('mocked-turn-status')).toHaveText('running');
await expect(page.getByTestId('cancel-turn-button')).toBeEnabled();
await expect(page.getByTestId('user-transcript')).toHaveText(MOCKED_USER_TRANSCRIPT);
await expect(page.getByTestId('assistant-response')).toContainText('[mocked assistant]');
await page.getByTestId('cancel-turn-button').click();
await expect(page.getByTestId('gateway-session-state')).toHaveText('idle');
await expect(page.getByTestId('mocked-turn-status')).toHaveText('idle');
await expect(page.getByTestId('cancel-turn-button')).toBeDisabled();
await expect(page.getByTestId('mocked-turn-button')).toBeEnabled();
await expect(page.getByTestId('user-transcript')).toHaveText(MOCKED_USER_TRANSCRIPT);
await expect(page.getByTestId('assistant-response')).toContainText('[mocked assistant]');
await page.getByTestId('mocked-turn-button').click();
await expect(page.getByTestId('mocked-turn-status')).toHaveText('running');
await expect(page.getByTestId('assistant-response')).toHaveText(MOCKED_ASSISTANT_RESPONSE);
await expect(page.getByTestId('mocked-turn-status')).toHaveText('idle');
});

View File

@@ -62,6 +62,13 @@
sessionReadyReceived &&
!mockedTurnInFlight;
$: canCancelMockedTurn =
typeof WebSocket !== 'undefined' &&
connectionState === 'connected' &&
socket?.readyState === WebSocket.OPEN &&
sessionReadyReceived &&
mockedTurnInFlight;
function clearSocketHandlers(targetSocket) {
targetSocket.onopen = null;
targetSocket.onmessage = null;
@@ -105,6 +112,23 @@
socket.send(JSON.stringify(createMessageEnvelope('mocked.turn.trigger', {})));
}
function cancelActiveResponse() {
if (!socket || socket.readyState !== WebSocket.OPEN || connectionState !== 'connected') {
connectionDetail = 'Connect to the gateway before cancelling a mocked turn.';
lastError = 'response.cancel requires an active WebSocket connection';
return;
}
if (!sessionReadyReceived) {
connectionDetail = 'Wait for the gateway session to be ready before cancelling a mocked turn.';
lastError = 'response.cancel requires session.ready';
return;
}
lastError = 'none';
socket.send(JSON.stringify(createMessageEnvelope('response.cancel', {})));
}
function connect() {
if (typeof window === 'undefined') {
return;
@@ -301,6 +325,9 @@
<button data-testid="mocked-turn-button" on:click={triggerMockedTurn} disabled={!canTriggerMockedTurn}>
Run mocked turn
</button>
<button data-testid="cancel-turn-button" on:click={cancelActiveResponse} disabled={!canCancelMockedTurn}>
Cancel active turn
</button>
</div>
<div class="conversation">

View File

@@ -154,4 +154,48 @@ describe('voice session shell', () => {
expect(socket.sent).toHaveLength(1);
expect(JSON.parse(socket.sent[0]).type).toBe('mocked.turn.trigger');
});
it('shows cancel control during an active mocked turn and preserves rendered text after cancel', async () => {
render(VoiceSessionShell);
await fireEvent.click(getByTestId('connect-button'));
const socket = MockWebSocket.latest();
socket.open();
socket.message(createMessageEnvelope('session.ready', { sessionId: 'session-cancel' }));
socket.message(createMessageEnvelope('session.state', { value: 'idle' }));
await waitFor(() => {
expect(getByTestId('cancel-turn-button').hasAttribute('disabled')).toBe(true);
});
await fireEvent.click(getByTestId('mocked-turn-button'));
expect(JSON.parse(socket.sent[0]).type).toBe('mocked.turn.trigger');
socket.message(createMessageEnvelope('session.state', { value: 'listening' }));
socket.message(createMessageEnvelope('transcript.final', { text: 'Keep this transcript.' }));
socket.message(createMessageEnvelope('session.state', { value: 'thinking' }));
socket.message(createMessageEnvelope('session.state', { value: 'speaking' }));
socket.message(createMessageEnvelope('response.text.delta', { text: 'Partial response' }));
await waitFor(() => {
expect(getByTestId('cancel-turn-button').hasAttribute('disabled')).toBe(false);
expect(getByTestId('assistant-response').textContent).toBe('Partial response');
});
await fireEvent.click(getByTestId('cancel-turn-button'));
expect(JSON.parse(socket.sent[1]).type).toBe('response.cancel');
socket.message(createMessageEnvelope('session.state', { value: 'idle' }));
await waitFor(() => {
expect(getByTestId('mocked-turn-status').textContent).toBe('idle');
expect(getByTestId('gateway-session-state').textContent).toBe('idle');
expect(getByTestId('cancel-turn-button').hasAttribute('disabled')).toBe(true);
expect(getByTestId('mocked-turn-button').hasAttribute('disabled')).toBe(false);
expect(getByTestId('user-transcript').textContent).toBe('Keep this transcript.');
expect(getByTestId('assistant-response').textContent).toBe('Partial response');
});
});
});