@runtypelabs/persona 4.28.2 → 4.29.1

package/src/session.ts

@@ -4,6 +4,7 @@ import {
   type SSEEventCallback,
 } from "./client";
 import { isWebMcpToolName } from "./webmcp-bridge";
+import { isBrowserLocalApproval, restoreBrowserToolState } from "./utils/restored-browser-state";
 import type { SessionActionsHost, SessionActionsInternals } from "./session-actions";
 import {
   getSessionActionsSync,
@@ -42,12 +43,14 @@ import {
   generateAssistantMessageId
 } from "./utils/message-id";
 import { IMAGE_ONLY_MESSAGE_FALLBACK_TEXT, createTextPart, hasImages } from "./utils/content";
+import { voicePriorToolRows } from "./utils/voice-prior-tool-results";
 import {
   buildArtifactRefRawContent,
   resolveArtifactDisplayMode
 } from "./utils/artifact-display";
 import type {
   VoiceProvider,
+  VoicePriorToolResult,
   VoiceStatus,
   VoiceConfig,
   ReadAloudState,
@@ -437,7 +440,7 @@ export class AgentWidgetSession {
   ) {
     this.historyInternals = this.#composeHistoryInternals(historyInternals);
     this.messages = [...(config.initialMessages ?? [])].map((message) => ({
-      ...message,
+      ...restoreBrowserToolState(message),
       sequence: message.sequence ?? this.#nextSequence()
     }));
     this.messages = this.#sortMessages(this.messages);
@@ -1343,7 +1346,8 @@ export class AgentWidgetSession {
     if (this.#activeConversationId && this.#activeConversationId !== id) {
       return { messages: [], nextMessageCursor: page.nextCursor };
     }
-    const merged = mergeWireMessagesById(this.messages, page.messages);
+    const restored = this.#restoreHistoryPage(page.messages);
+    const merged = mergeWireMessagesById(this.messages, restored);
     this.messages = this.#sortMessages(
       merged.map((message) => this.#ensureSequence(message))
     );
@@ -1354,7 +1358,30 @@ export class AgentWidgetSession {
     this.historyInternals.setStoredMessageCursor?.(page.nextCursor);
     this.callbacks.onMessagesChanged([...this.messages]);
     this.#emitHistoryState();
-    return { messages: page.messages, nextMessageCursor: page.nextCursor };
+    return { messages: restored, nextMessageCursor: page.nextCursor };
+  }
+
+  /** Normalize incoming history without retiring callbacks owned by this chat. */
+  #restoreHistoryPage(messages: AgentWidgetMessage[]): AgentWidgetMessage[] {
+    const current = new Map(this.messages.map(message => [message.id, message]));
+    return messages.map(message => {
+      const live = current.get(message.id);
+      if (live) {
+        if (this.webMcpApprovalResolvers.has(live.id)) return live;
+        // A decision made while the history fetch was in flight must not be
+        // replaced by the page's stale pending copy of the same browser card.
+        if (live.approval && isBrowserLocalApproval(live.approval) &&
+          live.approval.id === message.approval?.id &&
+          live.approval.status !== "pending" && message.approval?.status === "pending") return live;
+        const executionId = live.agentMetadata?.executionId;
+        const tools = [...(live.toolCall ? [live.toolCall] : []), ...(live.tools ?? [])];
+        if (executionId && tools.some(tool =>
+          this.webMcpInflightKeys.has(`${executionId}:${tool.id}`) ||
+          this.webMcpResolvedKeys.has(`${executionId}:${tool.id}`)
+        )) return live;
+      }
+      return restoreBrowserToolState(message);
+    });
   }
 
   /**
@@ -1800,6 +1827,7 @@ export class AgentWidgetSession {
     }
 
     const page = await provider.getPage(conversationId, { context });
+    const restored = this.#restoreHistoryPage(page.messages);
     const serverIds = new Set(page.messages.map((message) => message.id));
     const overlaps = this.messages.some((message) => serverIds.has(message.id));
     const pageOldest = page.messages[0]?.createdAt;
@@ -1807,7 +1835,7 @@ export class AgentWidgetSession {
     let reconciled: AgentWidgetMessage[];
     if (!overlaps) {
       // No shared id: the local transcript is not this record's newest window.
-      reconciled = page.messages.map((message) => this.#ensureSequence(message));
+      reconciled = restored.map((message) => this.#ensureSequence(message));
     } else {
       const durableId = this.#resumable ? this.#activeAssistantMessageId : null;
       const survivors = this.messages.filter((message) => {
@@ -1816,7 +1844,7 @@ export class AgentWidgetSession {
         // Older than the server window is legitimately absent from this page.
         return pageOldest !== undefined && message.createdAt < pageOldest;
       });
-      reconciled = mergeWireMessagesById(survivors, page.messages).map(
+      reconciled = mergeWireMessagesById(survivors, restored).map(
         (message) => this.#ensureSequence(message)
       );
     }
@@ -2042,7 +2070,12 @@ export class AgentWidgetSession {
     controller: AbortController,
     assistantMessageId: string,
     userMessageId: string,
-    turnOptions?: { composerOptions?: ComposerOptionsPayload; interrupt?: boolean; voiceSpoken?: boolean }
+    turnOptions?: {
+      composerOptions?: ComposerOptionsPayload;
+      interrupt?: boolean;
+      voiceSpoken?: boolean;
+      voicePriorToolResults?: VoicePriorToolResult[];
+    }
   ): Promise<void> {
     this.#recordDispatchedProjections(snapshot);
     try {
@@ -2053,7 +2086,8 @@ export class AgentWidgetSession {
           assistantMessageId,
           composerOptions: turnOptions?.composerOptions,
           interrupt: turnOptions?.interrupt,
-          voiceSpoken: turnOptions?.voiceSpoken
+          voiceSpoken: turnOptions?.voiceSpoken,
+          voicePriorToolResults: turnOptions?.voicePriorToolResults
         },
         this.handleEvent
       );
@@ -2072,6 +2106,7 @@ export class AgentWidgetSession {
           assistantMessageId,
           composerOptions: turnOptions?.composerOptions,
           voiceSpoken: turnOptions?.voiceSpoken,
+          voicePriorToolResults: turnOptions?.voicePriorToolResults,
         },
         this.handleEvent
       );
@@ -2535,9 +2570,11 @@ export class AgentWidgetSession {
        * Internal (voice client delegation): this is the delegated voice turn.
        * `userMessageId` names an existing transcript bubble to submit as the
        * turn's user message instead of appending a new one, so the spoken
-       * request appears (and is sent) exactly once.
+       * request appears (and is sent) exactly once. `priorToolResults`: page
+       * tools the voice server already ran for this turn, recorded once as
+       * completed tool rows after the request (see voicePriorToolRows).
        */
-      voiceTurn?: { userMessageId?: string };
+      voiceTurn?: { userMessageId?: string | null; priorToolResults?: unknown };
     }
   ) {
     const input = rawInput.trim();
@@ -2692,12 +2729,25 @@ export class AgentWidgetSession {
 
     // A submitted voice bubble may sit above captions or a turn that finished
     // while it waited: the request still ends on it.
+    const sentAt = new Date().toISOString();
     const snapshot = voiceBubble
-      ? [
-          ...this.messages.filter((m) => m !== voiceBubble),
-          { ...voiceBubble, createdAt: new Date().toISOString() }
-        ]
+      ? [...this.messages.filter((m) => m !== voiceBubble), { ...voiceBubble, createdAt: sentAt }]
       : [...this.messages];
+    // Tools the voice server already ran answer this request and are never run
+    // again. Stored at the request's own time, so every later replay keeps them
+    // right after it; this request (moved to `sentAt`) sends them at `sentAt`.
+    const requestAt = (voiceBubble ?? this.messages.find((m) => m.id === userMessageId))?.createdAt ?? sentAt;
+    const priorRows = voicePriorToolRows(options?.voiceTurn?.priorToolResults, requestAt);
+    for (const row of priorRows) {
+      if (this.messages.some((m) => m.id === row.id)) continue;
+      this.#appendMessage(row);
+      snapshot.push({ ...row, createdAt: sentAt });
+    }
+    // Client-token chat replays from the server's transcript: it gets them as a field.
+    const voicePriorToolResults = priorRows.map(({ agentMetadata }) => {
+      const { toolCallId, toolName, args, result } = agentMetadata!.clientToolAnswer!;
+      return { toolCallId, name: toolName, arguments: args as Record<string, unknown>, result };
+    });
 
     try {
       await this.#dispatchWithDeletedRecovery(
@@ -2709,7 +2759,8 @@ export class AgentWidgetSession {
           composerOptions: options?.composerOptions,
           interrupt: options?.interrupt,
           // The delegated voice turn's reply is read aloud (spoken-reply hint).
-          voiceSpoken: !!options?.voiceTurn
+          voiceSpoken: !!options?.voiceTurn,
+          ...(voicePriorToolResults.length > 0 && { voicePriorToolResults })
         }
       );
     } catch (error) {
@@ -2740,6 +2791,7 @@ export class AgentWidgetSession {
             role: "assistant",
             createdAt: new Date().toISOString(),
             content,
+            localOnly: true,
             sequence: this.#nextSequence()
           };
 
@@ -2928,6 +2980,7 @@ export class AgentWidgetSession {
             role: "assistant",
             createdAt: new Date().toISOString(),
             content,
+            localOnly: true,
             sequence: this.#nextSequence()
           };
 
@@ -3076,9 +3129,16 @@ export class AgentWidgetSession {
     } catch {
       // fall through to explicit approval
     }
-
+    if (info.signal?.aborted) return Promise.resolve(false);
+
+    let approvalId: string;
+    do {
+      approvalId = `webmcp-${++this.#webMcpApprovalSeq}`;
+    } while (this.messages.some(message =>
+      message.id === `approval-${approvalId}` || message.approval?.id === approvalId
+    ));
     const approval: AgentWidgetApproval = {
-      id: `webmcp-${++this.#webMcpApprovalSeq}`,
+      id: approvalId,
       status: "pending",
       agentId: "",
       executionId: "",
@@ -3102,6 +3162,12 @@ export class AgentWidgetSession {
 
     return new Promise<boolean>((resolve) => {
       this.webMcpApprovalResolvers.set(approvalMessageId, resolve);
+      // The call gave up (deadline or cancel): close the card so a late click cannot look like it ran the tool.
+      info.signal?.addEventListener(
+        "abort",
+        () => this.resolveWebMcpApproval(approvalMessageId, "timeout"),
+        { once: true }
+      );
     });
   }
 
@@ -3113,7 +3179,7 @@ export class AgentWidgetSession {
    */
   public resolveWebMcpApproval(
     approvalMessageId: string,
-    decision: "approved" | "denied"
+    decision: "approved" | "denied" | "timeout"
   ): void {
     const resolve = this.webMcpApprovalResolvers.get(approvalMessageId);
     if (!resolve) return;
@@ -3659,7 +3725,7 @@ export class AgentWidgetSession {
     this.webMcpResolvedKeys.clear();
     this.messages = this.#sortMessages(
       messages.map((message) => ({
-        ...message,
+        ...restoreBrowserToolState(message),
         streaming: false,
         sequence: message.sequence ?? this.#nextSequence()
       }))
@@ -3766,7 +3832,9 @@ export class AgentWidgetSession {
             resolveFollowUpsFeature(this.config).enabled));
       if (
         event.message.agentMetadata?.awaitingLocalTool === true &&
-        autoResolvable
+        autoResolvable &&
+        this.messages.find(message => message.id === event.message.id)
+          ?.agentMetadata?.awaitingLocalTool === true
       ) {
         // Collect the await into its executionId's batch instead of resolving
         // it on the spot. Parallel same-tool calls (core#3878) arrive as
@@ -4022,6 +4090,7 @@ export class AgentWidgetSession {
           seedContent,
         }),
       appendMessage: (message) => session.#appendMessage(message),
+      settleParked: (executionId) => session.#settleParkedReconnect(executionId),
       nextSequence: () => session.#nextSequence(),
       emitReconnect: (event) => session.callbacks.onReconnect?.(event),
       buildErrorContent: (message) =>
@@ -4053,7 +4122,28 @@ export class AgentWidgetSession {
     if (typeof this.config.reconnectStream !== "function") return;
     if (this.#reconnecting) return;
 
-    let assistantId = this.#reopenTrailingAssistant();
+    // A run parked on an await the restored transcript can still answer (an
+    // ask_user_question card, a server approval) has no stream to replay, and
+    // reconnecting would spin into a "Connection lost" bubble. Keep the cursor
+    // so the answer's `/resume` attaches after the await frame, as in-session.
+    if (this.#isAwaitPending()) {
+      this.#adoptBootExecution(resume.executionId);
+      this.#resumable = {
+        executionId: resume.executionId,
+        lastEventId: resume.after,
+        assistantMessageId: this.#activeAssistantMessageId ?? "",
+        status: "running",
+      };
+      return;
+    }
+
+    // Parked on a WebMCP call the reload interrupted: still reconnect once, so
+    // a replayed `await` re-dispatches the call on this page, but don't reopen
+    // the pre-tool text bubble or paint an empty one. The reconnect loop ends
+    // the turn quietly when nothing replays (`#settleParkedReconnect`).
+    let assistantId = this.#hasInterruptedBrowserTool(resume.executionId)
+      ? generateAssistantMessageId()
+      : this.#reopenTrailingAssistant();
     if (!assistantId) {
       assistantId = generateAssistantMessageId();
       this.#appendMessage({
@@ -4066,16 +4156,7 @@ export class AgentWidgetSession {
       });
     }
     this.#activeAssistantMessageId = assistantId;
-    if (!this.agentExecution) {
-      this.agentExecution = {
-        executionId: resume.executionId,
-        agentId: "",
-        agentName: "",
-        status: "running",
-        currentIteration: 0,
-        maxTurns: 0,
-      };
-    }
+    this.#adoptBootExecution(resume.executionId);
     this.#resumable = {
       executionId: resume.executionId,
       lastEventId: resume.after,
@@ -4085,6 +4166,63 @@ export class AgentWidgetSession {
     this.#beginReconnect();
   }
 
+  /**
+   * A reconnect attempt left the run parked rather than dropped: the turn is
+   * waiting on the visitor or a page tool (keep the cursor, as an in-session
+   * await pause does), or on a WebMCP call the reload interrupted (nothing can
+   * answer it, so drop the handle). Either way stop reconnecting without a
+   * failure bubble. Returns false for an ordinary drop, which keeps retrying.
+   */
+  #settleParkedReconnect(executionId: string): boolean {
+    const pageToolBusy =
+      this.webMcpResolveControllers.size > 0 || this.webMcpAwaitBatches.size > 0;
+    if (!pageToolBusy && !this.#isAwaitPending()) {
+      if (!this.#hasInterruptedBrowserTool(executionId)) return false;
+      this.#clearResumable();
+    }
+    this.#reconnecting = false;
+    if (!pageToolBusy) {
+      let changed = false;
+      for (const msg of this.messages) {
+        if (msg.streaming) {
+          msg.streaming = false;
+          changed = true;
+        }
+      }
+      if (changed) this.callbacks.onMessagesChanged([...this.messages]);
+      this.#setStreaming(false);
+      this.abortController = null;
+    }
+    this.#setStatus("idle");
+    return true;
+  }
+
+  /** Restore the running execution a boot resume refers to, if none is live. */
+  #adoptBootExecution(executionId: string): void {
+    if (this.agentExecution) return;
+    this.agentExecution = {
+      executionId,
+      agentId: "",
+      agentName: "",
+      status: "running",
+      currentIteration: 0,
+      maxTurns: 0,
+    };
+  }
+
+  /**
+   * True when restore settled one of this execution's WebMCP calls as
+   * interrupted (see `restoreBrowserToolState`): the run is parked on a
+   * browser callback that no longer exists.
+   */
+  #hasInterruptedBrowserTool(executionId: string): boolean {
+    return this.messages.some(
+      (m) =>
+        m.agentMetadata?.executionId === executionId &&
+        [m.toolCall, ...(m.tools ?? [])].some((tool) => tool?.interrupted === true)
+    );
+  }
+
   /**
    * Reopen the trailing assistant bubble (the persisted partial) so replayed
    * deltas append to it. Returns its id, or null if the last turn doesn't end
@@ -4328,6 +4466,21 @@ export class AgentWidgetSession {
 
     this.messages = this.messages.map((existing, idx) => {
       if (idx !== index) return existing;
+      // An unnamed skeleton precedes tool_start/await on a fresh parser. Keep
+      // history until the populated event identifies the continuation. Also
+      // retain actual terminal browser outcomes across replayed starts/deltas:
+      // those events must never turn a completed mutation back into an await.
+      if (
+        existing.toolCall?.name && isWebMcpToolName(existing.toolCall.name) &&
+        existing.toolCall.status === "complete" &&
+        withSequence.toolCall?.id === existing.toolCall.id &&
+        withSequence.toolCall.status !== "complete" &&
+        ((withSequence.toolCall.status === "pending" && !withSequence.toolCall.name) ||
+          (!existing.toolCall.interrupted &&
+            (existing.toolCall.result !== undefined || existing.toolCall.success !== undefined) &&
+            (!withSequence.agentMetadata?.executionId ||
+              withSequence.agentMetadata.executionId === existing.agentMetadata?.executionId)))
+      ) return existing;
       const merged = { ...existing, ...withSequence };
       // Preserve `ask_user_question` answered state across re-emissions.
       // Top-level merge would otherwise replace `agentMetadata` wholesale:      // post-resume events (e.g. `tool_complete` re-emitted from a stale
@@ -4434,7 +4587,8 @@ export class AgentWidgetSession {
           existing.toolCall?.id === reTcId &&
           existingToolName !== undefined &&
           isAutoResolvedLocalToolName(existingToolName) &&
-          existing.toolCall?.status === "complete";
+          existing.toolCall?.status === "complete" &&
+          !existing.toolCall.interrupted;
         if (isInflight || isResolved || hasCompletedTool) {
           merged.agentMetadata = {
             ...(merged.agentMetadata ?? {}),

package/src/session.voice.test.ts

@@ -623,6 +623,218 @@ describe('AgentWidgetSession - voice client delegation bridge', () => {
     ]);
   });
 
+  it('offers no client tools when WebMCP is off', () => {
+    expect(h.state.bridge!.clientTools!()).toBeNull();
+  });
+
+  it('records a server-answered (direct) turn: the caption becomes the user turn, the readout an answer', async () => {
+    const caption = (role: 'user' | 'assistant', text: string, turnId: string) =>
+      h.state.transcriptCb!(role, text, true, { turnId, caption: true });
+    caption('user', 'Next slide', 'u1');
+    h.state.bridge!.recordDirectTurn!({
+      delegationId: 'd1',
+      userText: 'Next slide',
+      userUtteranceIds: ['u1'],
+      assistantText: 'Slide 2: Agenda.',
+    });
+    expect(view()).toEqual([
+      ['assistant', 'Welcome! How can I help?'],
+      ['user', 'Next slide'],
+      ['assistant', 'Slide 2: Agenda.'],
+    ]);
+    expect(messages.find((m) => m.content === 'Next slide')!.voiceCaption).toBeUndefined();
+    expect(spoken('voice-direct-d1')).toBe(true);
+    expect(dispatch).not.toHaveBeenCalled();
+
+    // The next typed turn carries both as conversation.
+    dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'Sure.', 'assistant-r2'));
+    await session.sendMessage('and the one after?');
+    const sent = dispatch.mock.calls[0][0].messages.filter((m) => !m.voiceCaption);
+    expect(sent.map((m) => m.content)).toEqual([
+      'Welcome! How can I help?',
+      'Next slide',
+      'Slide 2: Agenda.',
+      'and the one after?',
+    ]);
+  });
+
+  it('records a direct turn with no caption and no readout as just the request', () => {
+    h.state.bridge!.recordDirectTurn!({ delegationId: 'd2', userText: 'Next slide', userUtteranceIds: [], assistantText: '' });
+    expect(view()).toEqual([
+      ['assistant', 'Welcome! How can I help?'],
+      ['user', 'Next slide'],
+    ]);
+  });
+
+  describe('prior tool results on a hand-back', () => {
+    const jump = {
+      toolCallId: 'vtc_1',
+      name: 'webmcp:jump_to_slide',
+      arguments: { position: 5 },
+      result: { slidePosition: 5, slideTitle: 'Pricing' },
+    };
+    const toolRows = () => messages.filter((m) => m.variant === 'tool');
+
+    it('records the executed call once, under the request and before the reply, as a completed call', async () => {
+      h.state.transcriptCb!('user', 'Jump to the pricing slide', true, { turnId: 'u1', caption: true });
+      dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'You are on Pricing.'));
+      await h.state.bridge!.runDelegatedTurn(
+        req({ delegationId: 'd1', userText: 'Jump to the pricing slide', userUtteranceIds: ['u1'], priorToolResults: [jump] }),
+      );
+
+      expect(messages.map((m) => [m.role, m.variant ?? '', m.content])).toEqual([
+        ['assistant', '', 'Welcome! How can I help?'],
+        ['user', '', 'Jump to the pricing slide'],
+        ['assistant', 'tool', ''],
+        ['assistant', '', 'You are on Pricing.'],
+      ]);
+      const [row] = toolRows();
+      expect(row.toolCall).toEqual({
+        id: 'vtc_1',
+        name: 'webmcp:jump_to_slide',
+        status: 'complete',
+        args: { position: 5 },
+        result: { slidePosition: 5, slideTitle: 'Pricing' },
+      });
+      expect(row.agentMetadata).toEqual({
+        clientToolAnswer: {
+          toolCallId: 'vtc_1',
+          toolName: 'webmcp:jump_to_slide',
+          args: { position: 5 },
+          result: { slidePosition: 5, slideTitle: 'Pricing' },
+        },
+      });
+      // Nothing marks it awaiting, so the WebMCP resolve path never runs it.
+      expect(row.agentMetadata?.awaitingLocalTool).toBeUndefined();
+
+      // The request ends on the user turn followed by the executed call.
+      const sent = dispatch.mock.calls[0][0].messages.filter((m) => !m.voiceCaption);
+      expect(sent.slice(-2).map((m) => [m.role, m.variant ?? '', m.content])).toEqual([
+        ['user', '', 'Jump to the pricing slide'],
+        ['assistant', 'tool', ''],
+      ]);
+    });
+
+    it('records nothing when the field is absent or holds no well-formed entry', async () => {
+      dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'Done.'));
+      await h.state.bridge!.runDelegatedTurn(req({ delegationId: 'd1', userText: 'next slide' }));
+      await h.state.bridge!.runDelegatedTurn(
+        req({
+          delegationId: 'd2',
+          userText: 'next slide',
+          priorToolResults: [{ name: 'webmcp:next_slide' }, { toolCallId: 'vtc_2' }, 'junk', null],
+        }),
+      );
+      await h.state.bridge!.runDelegatedTurn(req({ delegationId: 'd3', userText: 'next slide', priorToolResults: 'nope' }));
+      expect(toolRows()).toEqual([]);
+      expect(dispatch).toHaveBeenCalledTimes(3);
+    });
+
+    it('defaults missing arguments and result, and never duplicates a call already recorded', async () => {
+      dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'Done.'));
+      const bare = { toolCallId: 'vtc_3', name: 'webmcp:next_slide', arguments: 'bad' };
+      await h.state.bridge!.runDelegatedTurn(req({ delegationId: 'd1', userText: 'next slide', priorToolResults: [bare] }));
+      await h.state.bridge!.runDelegatedTurn(req({ delegationId: 'd1', userText: 'next slide', priorToolResults: [bare] }));
+      await session.sendMessage('thanks');
+      expect(toolRows()).toHaveLength(1);
+      expect(toolRows()[0].toolCall).toMatchObject({ args: {}, result: null });
+    });
+
+    it('hands the client-token request the executed calls only when the hand-back carried some', async () => {
+      dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'Done.'));
+      await h.state.bridge!.runDelegatedTurn(
+        req({ delegationId: 'd1', userText: 'jump', priorToolResults: [jump, 'junk', { ...jump, result: 'repeat' }] }),
+      );
+      await h.state.bridge!.runDelegatedTurn(req({ delegationId: 'd2', userText: 'next slide' }));
+      await session.sendMessage('typed');
+      const options = dispatch.mock.calls.map(([o]) => o as { voicePriorToolResults?: unknown });
+      expect(options[0].voicePriorToolResults).toEqual([jump]);
+      expect(toolRows()).toHaveLength(1);
+      expect(options[1].voicePriorToolResults).toBeUndefined();
+      expect(options[2].voicePriorToolResults).toBeUndefined();
+    });
+
+    it('keeps the executed call right after its request on later replays, even past a reply that finished first', async () => {
+      const bodies: Array<{ messages: Array<Record<string, unknown>> }> = [];
+      vi.stubGlobal(
+        'fetch',
+        vi.fn(async (_url: string, init?: RequestInit) => {
+          bodies.push(JSON.parse(String(init?.body)));
+          return new Response('', { status: 200, headers: { 'Content-Type': 'text/event-stream' } });
+        }),
+      );
+      vi.useFakeTimers({ toFake: ['Date'] });
+      try {
+        delete (session as unknown as { client: { dispatch?: Dispatch } }).client.dispatch;
+        vi.setSystemTime(new Date('2026-10-10T10:00:00.000Z'));
+        h.state.transcriptCb!('user', 'Jump to the pricing slide', true, { turnId: 'u1', caption: true });
+        vi.setSystemTime(new Date('2026-10-10T10:00:01.000Z'));
+        session.injectMessage({ role: 'assistant', content: 'An earlier answer.' });
+        vi.setSystemTime(new Date('2026-10-10T10:00:02.000Z'));
+        await h.state.bridge!.runDelegatedTurn(
+          req({ delegationId: 'd1', userText: 'Jump to the pricing slide', userUtteranceIds: ['u1'], priorToolResults: [jump] }),
+        );
+        vi.setSystemTime(new Date('2026-10-10T10:00:03.000Z'));
+        await session.sendMessage('and the next one?');
+      } finally {
+        vi.useRealTimers();
+        vi.unstubAllGlobals();
+      }
+      const roles = (body: { messages: Array<Record<string, unknown>> }) =>
+        body.messages.map((m) => (m.toolCalls ? 'calls' : m.toolResults ? 'results' : m.content));
+      expect(roles(bodies[0])).toEqual([
+        'Welcome! How can I help?',
+        'An earlier answer.',
+        'Jump to the pricing slide',
+        'calls',
+        'results',
+      ]);
+      expect(roles(bodies[1])).toEqual([
+        'Welcome! How can I help?',
+        'Jump to the pricing slide',
+        'calls',
+        'results',
+        'An earlier answer.',
+        'and the next one?',
+      ]);
+    });
+
+    it('replays the executed call to the model as a toolCalls/toolResults pair after the request (proxy mode)', async () => {
+      const bodies: Array<{ messages: Array<Record<string, unknown>> }> = [];
+      const fetchMock = vi.fn(async (_url: string, init?: RequestInit) => {
+        bodies.push(JSON.parse(String(init?.body)));
+        return new Response('', { status: 200, headers: { 'Content-Type': 'text/event-stream' } });
+      });
+      vi.stubGlobal('fetch', fetchMock);
+      try {
+        delete (session as unknown as { client: { dispatch?: Dispatch } }).client.dispatch;
+        h.state.transcriptCb!('user', 'Jump to the pricing slide', true, { turnId: 'u1', caption: true });
+        await h.state.bridge!.runDelegatedTurn(
+          req({ delegationId: 'd1', userText: 'Jump to the pricing slide', userUtteranceIds: ['u1'], priorToolResults: [jump] }),
+        );
+      } finally {
+        vi.unstubAllGlobals();
+      }
+      expect(bodies).toHaveLength(1);
+      expect(bodies[0].messages.map(({ createdAt: _at, ...m }) => m)).toEqual([
+        { role: 'assistant', content: 'Welcome! How can I help?' },
+        { role: 'user', content: 'Jump to the pricing slide' },
+        {
+          role: 'assistant',
+          content: '',
+          toolCalls: [{ toolCallId: 'vtc_1', toolName: 'webmcp_jump_to_slide', args: { position: 5 } }],
+        },
+        {
+          role: 'tool',
+          content: '',
+          toolResults: [
+            { toolCallId: 'vtc_1', toolName: 'webmcp_jump_to_slide', result: { slidePosition: 5, slideTitle: 'Pricing' } },
+          ],
+        },
+      ]);
+    });
+  });
+
   it('trims GPT-Live\'s leading space from bubbles and the submitted request', async () => {
     h.state.transcriptCb!('user', ' What are your opening hours', true, { turnId: 'u1', caption: true });
     dispatch.mockImplementation(async (_options, onEvent) => reply(onEvent, 'Nine to five.'));

package/src/styles/widget.css

@@ -4750,14 +4750,16 @@
 
 .persona-approval-resolved {
   display: flex;
-  align-items: center;
+  align-items: flex-start;
   gap: 0.45rem;
   margin: 0.5rem 0;
   padding: 0.3rem 0.15rem;
   font-size: 0.8rem;
+  line-height: 1.4;
   color: var(--persona-muted, #6b7280);
 }
-.persona-approval-resolved svg { width: 0.95rem; height: 0.95rem; display: block; flex-shrink: 0; }
+.persona-approval-resolved svg { width: 0.95rem; height: 0.95rem; display: block; flex-shrink: 0; margin-top: 0.085rem; }
+.persona-approval-resolved-text { min-width: 0; overflow-wrap: anywhere; }
 .persona-approval-resolved-name { font-weight: 600; }
 
 .persona-approval-actions {