[Conversation history] Fix serialization of conversations

Currently, `Conversation.serialize()` leaves the `confirm()` function
of responses of type side-effect unchanged. Consequently, in
`AiHistoryStorage.upsertHistoryEntry()` the `confirm()` function is
persisted in a DevTools setting (only in the setting's in-memory copy,
the copy persisted to storage is stringified which removes the
`confirm()` function).
When the setting is later accessed, `structuredClone()` is executed on
it, which throws when encountering a function.

This bug does not surface in the current implementation of the
`AiAssistancePanel` because the setting is only accessed once, in the
panel's constructor. Current refactoring efforts will change this,
and the conversation serialization needs to be fixed first.

Bug: 427407133
Change-Id: Ib620878245530a5086668a414c85bd70b8be31cf
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6827303
Commit-Queue: Alex Rudenko <[email protected]>
Auto-Submit: Wolfgang Beyer <[email protected]>
Reviewed-by: Alex Rudenko <[email protected]>

Author: wolfib

front_end/models/ai_assistance/AiHistoryStorage.test.ts

@@ -510,9 +510,8 @@ describe('AiHistoryStorage', () => {
         assert.lengthOf(imageHistory, 1);
         const historyWithoutImages = storage.getHistory();
         assert.lengthOf(historyWithoutImages, 2);
-        const conversationFromHistory = historyWithoutImages.map(item => {
-          return new AiAssistance.Conversation(item.type, item.history, item.id, true);
-        });
+        const conversationFromHistory =
+            historyWithoutImages.map(item => AiAssistance.Conversation.fromSerializedConversation(item));
         assert.lengthOf(conversationFromHistory, 2);
         assert.deepEqual(conversationFromHistory[0].history, [{
                            type: AiAssistance.ResponseType.USER_QUERY,

front_end/models/ai_assistance/AiHistoryStorage.ts

@@ -5,7 +5,7 @@
 
 import * as Common from '../../core/common/common.js';
 
-import {type ResponseData, ResponseType} from './agents/AiAgent.js';
+import {type ResponseData, ResponseType, type SerializedResponseData} from './agents/AiAgent.js';
 
 const MAX_TITLE_LENGTH = 80;
 
@@ -22,7 +22,7 @@ export const NOT_FOUND_IMAGE_DATA = '';
 export interface SerializedConversation {
   id: string;
   type: ConversationType;
-  history: ResponseData[];
+  history: SerializedResponseData[];
   isExternal: boolean;
 }
 
@@ -117,12 +117,27 @@ export class Conversation {
         if (item.type === ResponseType.USER_QUERY) {
           return {...item, imageInput: undefined};
         }
+        // Remove the `confirm()`-function because `structuredClone()` throws on functions
+        if (item.type === ResponseType.SIDE_EFFECT) {
+          return {...item, confirm: undefined};
+        }
         return item;
       }),
       type: this.type,
       isExternal: this.#isExternal,
     };
   }
+
+  static fromSerializedConversation(serializedConversation: SerializedConversation): Conversation {
+    const history = serializedConversation.history.map(entry => {
+      if (entry.type === ResponseType.SIDE_EFFECT) {
+        return {...entry, confirm: () => {}};
+      }
+      return entry;
+    });
+    return new Conversation(
+        serializedConversation.type, history, serializedConversation.id, true, serializedConversation.isExternal);
+  }
 }
 
 let instance: AiHistoryStorage|null = null;

front_end/models/ai_assistance/agents/AiAgent.ts

@@ -85,6 +85,7 @@ export interface SideEffectResponse {
   code?: string;
   confirm: (confirm: boolean) => void;
 }
+interface SerializedSideEffectResponse extends Omit<SideEffectResponse, 'confirm'> {}
 
 export interface ActionResponse {
   type: ResponseType.ACTION;
@@ -107,6 +108,9 @@ export interface UserQuery {
 export type ResponseData = AnswerResponse|SuggestionsResponse|ErrorResponse|ActionResponse|SideEffectResponse|
     ThoughtResponse|TitleResponse|QueryingResponse|ContextResponse|UserQuery;
 
+export type SerializedResponseData = AnswerResponse|SuggestionsResponse|ErrorResponse|ActionResponse|
+    SerializedSideEffectResponse|ThoughtResponse|TitleResponse|QueryingResponse|ContextResponse|UserQuery;
+
 export type FunctionCallResponseData =
     TitleResponse|ThoughtResponse|ActionResponse|SideEffectResponse|SuggestionsResponse;
 

front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -557,9 +557,8 @@ export class AiAssistancePanel extends UI.Panel.Panel {
       accountFullName: syncInfo.accountFullName,
     };
 
-    this.#historicalConversations = AiAssistanceModel.AiHistoryStorage.instance().getHistory().map(item => {
-      return new AiAssistanceModel.Conversation(item.type, item.history, item.id, true, item.isExternal);
-    });
+    this.#historicalConversations = AiAssistanceModel.AiHistoryStorage.instance().getHistory().map(
+        serializedConversation => AiAssistanceModel.Conversation.fromSerializedConversation(serializedConversation));
 
     if (UI.ActionRegistry.ActionRegistry.instance().hasAction('elements.toggle-element-search')) {
       this.#toggleSearchElementAction =