chrome-devtools-frontend 1.0.1611390 → 1.0.1611825

package/front_end/core/host/AidaClientTypes.ts

@@ -384,10 +384,15 @@ export interface FactualityMetadata {
   facts: FactualityFact[];
 }
 
+export interface InferenceOptionMetadata {
+  modelId: string;
+}
+
 export interface ResponseMetadata {
   rpcGlobalId?: RpcGlobalId;
   attributionMetadata?: AttributionMetadata;
   factualityMetadata?: FactualityMetadata;
+  inferenceOptionMetadata?: InferenceOptionMetadata;
 }
 
 export interface DoConversationResponse {

package/front_end/core/host/AidaGcaTranslation.ts

@@ -454,6 +454,7 @@ export function gcaChunkResponseToAidaChunkResponse(response: GCA.GenerateConten
     const parts = candidate?.content?.parts || [];
     const metadata: AIDA.ResponseMetadata = {
       rpcGlobalId: response.responseId,
+      inferenceOptionMetadata: {modelId: response.modelVersion}
     };
 
     if (candidate?.citationMetadata?.citations) {

package/front_end/core/sdk/ResourceTreeModel.ts

@@ -858,7 +858,8 @@ export class ResourceTreeFrame {
    * https://chromium.googlesource.com/chromium/src/+/HEAD/docs/frame_trees.md
    */
   isPrimaryFrame(): boolean {
-    return !this.#sameTargetParentFrame && this.#model.target() === TargetManager.instance().primaryPageTarget();
+    return !this.#sameTargetParentFrame &&
+        this.#model.target() === this.#model.target().targetManager().primaryPageTarget();
   }
 
   removeChildFrame(frame: ResourceTreeFrame, isSwap: boolean): void {

package/front_end/core/sdk/Target.ts

@@ -70,9 +70,7 @@ export class Target extends ProtocolClient.InspectorBackend.TargetBase {
         this.#capabilitiesMask = Capability.JS | Capability.LOG | Capability.NETWORK | Capability.TARGET |
             Capability.INSPECTOR | Capability.IO | Capability.EVENT_BREAKPOINTS;
         if (parentTarget?.type() !== Type.FRAME) {
-          // TODO(crbug.com/406991275): This should also grant the `STORAGE` capability, but first the
-          // crashers in https://crbug.com/466134219 have to be resolved.
-          this.#capabilitiesMask |= Capability.BROWSER;
+          this.#capabilitiesMask |= Capability.BROWSER | Capability.STORAGE;
         }
         break;
       case Type.SHARED_WORKER:

package/front_end/generated/InspectorBackendCommands.ts

@@ -895,7 +895,7 @@ inspectorBackend.registerCommand("Network.enableReportingApi", [{"name": "enable
 inspectorBackend.registerCommand("Network.enableDeviceBoundSessions", [{"name": "enable", "type": "boolean", "optional": false, "description": "Whether to enable or disable events.", "typeRef": null}], [], "Sets up tracking device bound sessions and fetching of initial set of sessions.");
 inspectorBackend.registerCommand("Network.fetchSchemefulSite", [{"name": "origin", "type": "string", "optional": false, "description": "The URL origin.", "typeRef": null}], ["schemefulSite"], "Fetches the schemeful site for a specific origin.");
 inspectorBackend.registerCommand("Network.loadNetworkResource", [{"name": "frameId", "type": "string", "optional": true, "description": "Frame id to get the resource for. Mandatory for frame targets, and should be omitted for worker targets.", "typeRef": "Page.FrameId"}, {"name": "url", "type": "string", "optional": false, "description": "URL of the resource to get content for.", "typeRef": null}, {"name": "options", "type": "object", "optional": false, "description": "Options for the request.", "typeRef": "Network.LoadNetworkResourceOptions"}], ["resource"], "Fetches the resource and returns the content.");
-inspectorBackend.registerCommand("Network.setCookieControls", [{"name": "enableThirdPartyCookieRestriction", "type": "boolean", "optional": false, "description": "Whether 3pc restriction is enabled.", "typeRef": null}, {"name": "disableThirdPartyCookieMetadata", "type": "boolean", "optional": false, "description": "Whether 3pc grace period exception should be enabled; false by default.", "typeRef": null}, {"name": "disableThirdPartyCookieHeuristics", "type": "boolean", "optional": false, "description": "Whether 3pc heuristics exceptions should be enabled; false by default.", "typeRef": null}], [], "Sets Controls for third-party cookie access Page reload is required before the new cookie behavior will be observed");
+inspectorBackend.registerCommand("Network.setCookieControls", [{"name": "enableThirdPartyCookieRestriction", "type": "boolean", "optional": false, "description": "Whether 3pc restriction is enabled.", "typeRef": null}], [], "Sets Controls for third-party cookie access Page reload is required before the new cookie behavior will be observed");
 inspectorBackend.registerType("Network.ResourceTiming", [{"name": "requestTime", "type": "number", "optional": false, "description": "Timing's requestTime is a baseline in seconds, while the other numbers are ticks in milliseconds relatively to this requestTime.", "typeRef": null}, {"name": "proxyStart", "type": "number", "optional": false, "description": "Started resolving proxy.", "typeRef": null}, {"name": "proxyEnd", "type": "number", "optional": false, "description": "Finished resolving proxy.", "typeRef": null}, {"name": "dnsStart", "type": "number", "optional": false, "description": "Started DNS address resolve.", "typeRef": null}, {"name": "dnsEnd", "type": "number", "optional": false, "description": "Finished DNS address resolve.", "typeRef": null}, {"name": "connectStart", "type": "number", "optional": false, "description": "Started connecting to the remote host.", "typeRef": null}, {"name": "connectEnd", "type": "number", "optional": false, "description": "Connected to the remote host.", "typeRef": null}, {"name": "sslStart", "type": "number", "optional": false, "description": "Started SSL handshake.", "typeRef": null}, {"name": "sslEnd", "type": "number", "optional": false, "description": "Finished SSL handshake.", "typeRef": null}, {"name": "workerStart", "type": "number", "optional": false, "description": "Started running ServiceWorker.", "typeRef": null}, {"name": "workerReady", "type": "number", "optional": false, "description": "Finished Starting ServiceWorker.", "typeRef": null}, {"name": "workerFetchStart", "type": "number", "optional": false, "description": "Started fetch event.", "typeRef": null}, {"name": "workerRespondWithSettled", "type": "number", "optional": false, "description": "Settled fetch event respondWith promise.", "typeRef": null}, {"name": "workerRouterEvaluationStart", "type": "number", "optional": true, "description": "Started ServiceWorker static routing source evaluation.", "typeRef": null}, {"name": "workerCacheLookupStart", "type": "number", "optional": true, "description": "Started cache lookup when the source was evaluated to `cache`.", "typeRef": null}, {"name": "sendStart", "type": "number", "optional": false, "description": "Started sending request.", "typeRef": null}, {"name": "sendEnd", "type": "number", "optional": false, "description": "Finished sending request.", "typeRef": null}, {"name": "pushStart", "type": "number", "optional": false, "description": "Time the server started pushing request.", "typeRef": null}, {"name": "pushEnd", "type": "number", "optional": false, "description": "Time the server finished pushing request.", "typeRef": null}, {"name": "receiveHeadersStart", "type": "number", "optional": false, "description": "Started receiving response headers.", "typeRef": null}, {"name": "receiveHeadersEnd", "type": "number", "optional": false, "description": "Finished receiving response headers.", "typeRef": null}]);
 inspectorBackend.registerType("Network.PostDataEntry", [{"name": "bytes", "type": "string", "optional": true, "description": "", "typeRef": null}]);
 inspectorBackend.registerType("Network.Request", [{"name": "url", "type": "string", "optional": false, "description": "Request URL (without fragment).", "typeRef": null}, {"name": "urlFragment", "type": "string", "optional": true, "description": "Fragment of the requested URL starting with hash, if present.", "typeRef": null}, {"name": "method", "type": "string", "optional": false, "description": "HTTP request method.", "typeRef": null}, {"name": "headers", "type": "object", "optional": false, "description": "HTTP request headers.", "typeRef": "Network.Headers"}, {"name": "postData", "type": "string", "optional": true, "description": "HTTP POST request data. Use postDataEntries instead.", "typeRef": null}, {"name": "hasPostData", "type": "boolean", "optional": true, "description": "True when the request has POST data. Note that postData might still be omitted when this flag is true when the data is too long.", "typeRef": null}, {"name": "postDataEntries", "type": "array", "optional": true, "description": "Request body elements (post data broken into individual entries).", "typeRef": "Network.PostDataEntry"}, {"name": "mixedContentType", "type": "string", "optional": true, "description": "The mixed content type of the request.", "typeRef": "Security.MixedContentType"}, {"name": "initialPriority", "type": "string", "optional": false, "description": "Priority of the resource request at the time request is sent.", "typeRef": "Network.ResourcePriority"}, {"name": "referrerPolicy", "type": "string", "optional": false, "description": "The referrer policy of the request, as defined in https://www.w3.org/TR/referrer-policy/", "typeRef": null}, {"name": "isLinkPreload", "type": "boolean", "optional": true, "description": "Whether is loaded via link preload.", "typeRef": null}, {"name": "trustTokenParams", "type": "object", "optional": true, "description": "Set for requests when the TrustToken API is used. Contains the parameters passed by the developer (e.g. via \\\"fetch\\\") as understood by the backend.", "typeRef": "Network.TrustTokenParams"}, {"name": "isSameSite", "type": "boolean", "optional": true, "description": "True if this resource request is considered to be the 'same site' as the request corresponding to the main frame.", "typeRef": null}, {"name": "isAdRelated", "type": "boolean", "optional": true, "description": "True when the resource request is ad-related.", "typeRef": null}]);

package/front_end/generated/SupportedCSSProperties.js

@@ -3493,6 +3493,7 @@ export const generatedProperties = [
  {
   "keywords": [
    "auto",
+   "chain",
    "contain",
    "none"
   ],
@@ -3501,6 +3502,7 @@ export const generatedProperties = [
  {
   "keywords": [
    "auto",
+   "chain",
    "contain",
    "none"
   ],
@@ -6635,6 +6637,7 @@ export const generatedPropertyValues = {
  "overscroll-behavior-x": {
   "values": [
    "auto",
+   "chain",
    "contain",
    "none"
   ]
@@ -6642,6 +6645,7 @@ export const generatedPropertyValues = {
  "overscroll-behavior-y": {
   "values": [
    "auto",
+   "chain",
    "contain",
    "none"
   ]

package/front_end/generated/protocol.ts

@@ -12584,14 +12584,6 @@ export namespace Network {
      * Whether 3pc restriction is enabled.
      */
     enableThirdPartyCookieRestriction: boolean;
-    /**
-     * Whether 3pc grace period exception should be enabled; false by default.
-     */
-    disableThirdPartyCookieMetadata: boolean;
-    /**
-     * Whether 3pc heuristics exceptions should be enabled; false by default.
-     */
-    disableThirdPartyCookieHeuristics: boolean;
   }
 
   /**

package/front_end/models/web_mcp/WebMCPModel.ts

@@ -7,7 +7,7 @@ import * as SDK from '../../core/sdk/sdk.js';
 import type * as ProtocolProxyApi from '../../generated/protocol-proxy-api.js';
 import type * as Protocol from '../../generated/protocol.js';
 import * as Bindings from '../bindings/bindings.js';
-import type * as StackTrace from '../stack_trace/stack_trace.js';
+import * as StackTrace from '../stack_trace/stack_trace.js';
 
 export const enum Events {
   TOOLS_ADDED = 'ToolsAdded',
@@ -16,16 +16,78 @@ export const enum Events {
   TOOL_RESPONDED = 'ToolResponded',
 }
 
+export interface ExceptionDetails {
+  readonly error: SDK.RemoteObject.RemoteObject;
+  readonly description: string;
+  readonly frames: StackTrace.ErrorStackParser.ParsedErrorFrame[];
+  readonly cause?: ExceptionDetails;
+}
+
+export class Result {
+  readonly status: Protocol.WebMCP.InvocationStatus;
+  readonly output?: unknown;
+  readonly errorText?: string;
+  // TODO(crbug.com/494516094) Clean this up if the target disappears?
+  readonly #exception?: SDK.RemoteObject.RemoteObject;
+  #exceptionDetails?: Promise<ExceptionDetails|undefined>;
+
+  constructor(
+      status: Protocol.WebMCP.InvocationStatus, output: unknown|undefined, errorText: string|undefined,
+      exception: SDK.RemoteObject.RemoteObject|undefined) {
+    this.status = status;
+    this.errorText = errorText;
+    this.#exception = exception;
+    this.output = output;
+  }
+
+  get exceptionDetails(): Promise<ExceptionDetails|undefined>|undefined {
+    if (!this.#exceptionDetails) {
+      this.#exceptionDetails = this.#resolveExceptionDetails(this.#exception);
+    }
+    return this.#exceptionDetails;
+  }
+
+  async #resolveExceptionDetails(errorObj: SDK.RemoteObject.RemoteObject|undefined):
+      Promise<ExceptionDetails|undefined> {
+    if (!errorObj) {
+      return undefined;
+    }
+    const error = SDK.RemoteObject.RemoteError.objectAsError(errorObj);
+    const [details, cause] = await Promise.all([error.exceptionDetails(), error.cause()]);
+    const description = error.errorStack;
+
+    const frames =
+        StackTrace.ErrorStackParser.parseSourcePositionsFromErrorStack(errorObj.runtimeModel(), error.errorStack) || [];
+    if (details?.stackTrace) {
+      StackTrace.ErrorStackParser.augmentErrorStackWithScriptIds(frames, details.stackTrace);
+    }
+
+    if (cause?.subtype === 'error') {
+      return {error: errorObj, description, frames, cause: await this.#resolveExceptionDetails(cause)};
+    }
+
+    if (cause?.type === 'string') {
+      return {
+        error: errorObj,
+        description,
+        frames,
+        cause: {
+          error: cause,
+          description: cause.value as string,
+          frames: [],
+        }
+      };
+    }
+
+    return {error: errorObj, description, frames};
+  }
+}
+
 export interface Call {
   invocationId: string;
   tool: Tool;
   input: string;
-  result?: {
-    status: Protocol.WebMCP.InvocationStatus,
-    output?: unknown,
-    errorText?: string,
-    exception?: Protocol.Runtime.RemoteObject,
-  };
+  result?: Result;
 }
 
 export class Tool {
@@ -160,11 +222,7 @@ export class WebMCPModel extends SDK.SDKModel.SDKModel<EventTypes> implements Pr
     if (!tool) {
       return;
     }
-    const call: Call = {
-      invocationId: params.invocationId,
-      input: params.input,
-      tool,
-    };
+    const call: Call = {tool, input: params.input, invocationId: params.invocationId};
     this.#calls.set(params.invocationId, call);
     this.dispatchEventToListeners(Events.TOOL_INVOKED, call);
   }
@@ -174,12 +232,9 @@ export class WebMCPModel extends SDK.SDKModel.SDKModel<EventTypes> implements Pr
     if (!call) {
       return;
     }
-    call.result = {
-      status: params.status,
-      output: params.output,
-      errorText: params.errorText,
-      exception: params.exception,
-    };
+    const exception =
+        params.exception && this.target().model(SDK.RuntimeModel.RuntimeModel)?.createRemoteObject(params.exception);
+    call.result = new Result(params.status, params.output, params.errorText, exception);
     this.dispatchEventToListeners(Events.TOOL_RESPONDED, call);
   }
 }

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -306,9 +306,8 @@ async function getEmptyStateSuggestions(conversation?: AiAssistanceModel.AiConve
       ];
     case AiAssistanceModel.AiHistoryStorage.ConversationType.ACCESSIBILITY:
       return [
-        {title: 'What are the accessibility issues on this page?', jslogContext: 'accessibility-default'},
-        {title: 'How can I fix these accessibility issues?', jslogContext: 'accessibility-default'},
-        {title: 'What does this Lighthouse report say about accessibility?', jslogContext: 'accessibility-default'},
+        {title: 'How can I fix accessibility issues on my page?', jslogContext: 'accessibility-default'},
+        {title: 'What accessibility issues exist on my page?', jslogContext: 'accessibility-default'},
       ];
     case AiAssistanceModel.AiHistoryStorage.ConversationType.NETWORK:
 

package/front_end/panels/ai_assistance/components/ChatMessage.ts

@@ -157,9 +157,13 @@ const UIStringsNotTranslate = {
    */
   completed: 'Completed',
   /**
-   * @description Aria label for the cancel icon to be read by screen reader
+   * @description Aria label for the spinner to be read by screen reader when a step is in progress.
    */
-  canceled: 'Canceled',
+  inProgress: 'In progress',
+  /**
+   * @description Aria label for the aborted icon to be read by screen reader
+   */
+  aborted: 'Aborted',
   /**
    * @description Alt text for the image input (displayed in the chat messages) that has been sent to the model.
    */
@@ -208,6 +212,10 @@ const UIStringsNotTranslate = {
    * @description Accessilility label for the button that shows the walkthrough when there are no widgets in the walkthrough.
    */
   showThinking: 'Show thinking',
+  /**
+   * @description Accessilility label for the button that hides the walkthrough when there are no widgets in the walkthrough.
+   */
+  hideThinking: 'Hide thinking',
 } as const;
 
 export interface Step {
@@ -467,7 +475,7 @@ function renderTitle(step: Step): Lit.LitTemplate {
       html`<span class="paused">${lockedString(UIStringsNotTranslate.paused)}: </span>` :
       Lit.nothing;
 
-  return html`<span class="title">${paused}${titleForStep(step)}</span>`;
+  return html`<span class="title" aria-label=${titleForStep(step)}>${paused}${titleForStep(step)}</span>`;
 }
 
 function renderStepCode(step: Step): Lit.LitTemplate {
@@ -577,10 +585,10 @@ function renderWalkthroughSidebarButton(
   });
 
   let accessibleLabel = title;
-  if (!isExpanded) {
-    if (input.isLoading || lastStep.requestApproval) {
-      accessibleLabel = `${titleForStep(lastStep)} ${i18n.i18n.lockedString(UIStringsNotTranslate.showThinking)}`;
-    }
+  // If the agent is still thinking we want the accessibility label to include the current step title followed by Show/Hide thinking.
+  if (input.isLoading) {
+    const suffix = isExpanded ? UIStringsNotTranslate.hideThinking : UIStringsNotTranslate.showThinking;
+    accessibleLabel = `${titleForStep(lastStep)} ${i18n.i18n.lockedString(suffix)}`;
   }
 
   // clang-format off
@@ -683,7 +691,7 @@ function renderStepBadge({step, isLoading, isLast}: {
   isLast: boolean,
 }): Lit.LitTemplate {
   if (isLoading && isLast && !step.requestApproval) {
-    return html`<devtools-spinner></devtools-spinner>`;
+    return html`<devtools-spinner aria-label=${lockedString(UIStringsNotTranslate.inProgress)}></devtools-spinner>`;
   }
 
   let iconName = 'checkmark';
@@ -691,10 +699,10 @@ function renderStepBadge({step, isLoading, isLast}: {
   let role: 'button'|undefined = 'button';
   if (isLast && step.requestApproval) {
     role = undefined;
-    ariaLabel = undefined;
+    ariaLabel = lockedString(UIStringsNotTranslate.paused);
     iconName = 'pause-circle';
   } else if (step.canceled) {
-    ariaLabel = lockedString(UIStringsNotTranslate.canceled);
+    ariaLabel = lockedString(UIStringsNotTranslate.aborted);
     iconName = 'cross';
   }
 
@@ -938,6 +946,7 @@ function renderWidgetResponse(response: WidgetMakerResponse|null): Lit.LitTempla
   const revealButton = html`
     <devtools-button class="widget-reveal-button"
       .variant=${Buttons.Button.Variant.TEXT}
+      .accessibleLabel=${lockedString(UIStringsNotTranslate.reveal)}
       @click=${onReveal}
     >
       ${response.customRevealTitle ?? lockedString(UIStringsNotTranslate.reveal)}
@@ -950,7 +959,7 @@ function renderWidgetResponse(response: WidgetMakerResponse|null): Lit.LitTempla
     <div class=${classes}>
       ${response.title ? html`
         <div class="widget-header">
-          <div class="widget-name">${response.title}</div>
+          <h3 class="widget-name">${response.title}</h3>
           <div class="widget-reveal-container">
             ${revealButton}
           </div>
@@ -1255,6 +1264,7 @@ function renderActions(input: ChatMessageViewInput, output: ViewOutput): Lit.Lit
             .jslogContext=${'ai-export-for-agents'}
             .variant=${Buttons.Button.Variant.OUTLINED}
             .iconName=${'copy'}
+            aria-label=${lockedString(UIStringsNotTranslate.exportForAgents)}
             @click=${input.onExportClick}
           >${lockedString(UIStringsNotTranslate.exportForAgents)}</devtools-button>
           ${input.suggestions ? html`<div class="vertical-separator"></div>` : Lit.nothing}

package/front_end/panels/ai_assistance/components/ExportForAgentsDialog.ts

@@ -87,17 +87,18 @@ export const DEFAULT_VIEW: View = (input, _output, target): void => {
     <style>${styles}</style>
     <div class="export-for-agents-dialog">
       <header>
-        <h2 tabindex="-1">
+        <h1 id="export-for-agents-dialog-title" tabindex="-1">
           ${i18nString(UIStrings.exportForAgents)}
-        </h2>
+        </h1>
       </header>
-      <div class="state-selection">
+      <div class="state-selection" role="radiogroup" aria-labelledby="export-for-agents-dialog-title">
         <label>
           <input
             type="radio"
             value="prompt"
             name="export-state"
             .checked=${isPrompt}
+            aria-label=${i18nString(UIStrings.asPrompt)}
             @change=${() => input.onStateChange(StateType.PROMPT)}
           >
           ${i18nString(UIStrings.asPrompt)}
@@ -108,6 +109,7 @@ export const DEFAULT_VIEW: View = (input, _output, target): void => {
             value="conversation"
             name="export-state"
             .checked=${!isPrompt}
+            aria-label=${i18nString(UIStrings.asMarkdown)}
             @change=${() => input.onStateChange(StateType.CONVERSATION)}
           >
           ${i18nString(UIStrings.asMarkdown)}
@@ -130,6 +132,7 @@ export const DEFAULT_VIEW: View = (input, _output, target): void => {
             .jslogContext=${input.jslogContext}
             .variant=${Buttons.Button.Variant.PRIMARY}
             .disabled=${isPrompt && input.state.isPromptLoading}
+            .accessibleLabel=${buttonText}
           >
             ${buttonText}
           </devtools-button>
@@ -191,9 +194,10 @@ export class ExportForAgentsDialog extends UI.Widget.VBox {
         onButtonClick = (event: Event): void => {
           event.preventDefault();
           Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.#state.promptText);
-          Snackbars.Snackbar.Snackbar.show({
+          const snackbar = Snackbars.Snackbar.Snackbar.show({
             message: i18nString(UIStrings.copiedToClipboard),
           });
+          snackbar.setAttribute('aria-label', i18nString(UIStrings.copiedToClipboard));
           this.#dialog.hide();
         };
         break;

package/front_end/panels/ai_assistance/components/WalkthroughView.ts

@@ -45,6 +45,10 @@ const UIStrings = {
    * @description Title for the button that hides the walkthrough when there are widgets in the walkthrough.
    */
   hideAgentWalkthrough: 'Hide agent walkthrough',
+  /**
+   * @description Aria label for the spinner to be read by screen reader when a step is in progress.
+   */
+  inProgress: 'In progress',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/ai_assistance/components/WalkthroughView.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -118,7 +122,7 @@ function renderInlineWalkthrough(input: ViewInput, stepsOutput: Lit.LitTemplate,
     <div class="inline-wrapper" ?data-open=${input.isExpanded}>
       <span class="inline-icon">
         ${input.isLoading ?
-            html`<devtools-spinner></devtools-spinner>` :
+            html`<devtools-spinner aria-label=${lockedString(UIStrings.inProgress)}></devtools-spinner>` :
             html`<devtools-icon name=${icon}></devtools-icon>`
         }
       </span>
@@ -149,7 +153,7 @@ function renderSidebarWalkthrough(input: ViewInput, stepsOutput: Lit.LitTemplate
   return html`
     <div class="walkthrough-view">
       <div class="walkthrough-header">
-         <div class="walkthrough-title">${i18nString(UIStrings.title)}</div>
+         <h2 class="walkthrough-title">${i18nString(UIStrings.title)}</h2>
          <devtools-button
           .data=${{
             variant: Buttons.Button.Variant.TOOLBAR,

package/front_end/panels/ai_assistance/components/exportForAgentsDialog.css

@@ -21,7 +21,7 @@
   .export-for-agents-dialog header {
     margin-bottom: var(--sys-size-6);
 
-    h2 {
+    h1 {
       font: var(--sys-typescale-headline5);
       margin: 0;
       color: var(--sys-color-on-surface);

package/front_end/panels/ai_assistance/components/walkthroughView.css

@@ -118,21 +118,9 @@
     &[open] {
       border-radius: var(--sys-size-5);
       width: auto;
-      background-color: var(--sys-color-surface1);
+      background-color: var(--sys-color-surface2);
       margin-left: calc(var(--sys-size-6) / 2);
       flex-grow: 1;
-
-      > summary {
-        border-radius: var(--sys-shape-corner-medium-small);
-        border-bottom-right-radius: 0;
-        border-bottom-left-radius: 0;
-        background: var(--sys-color-surface5);
-        color: var(--sys-color-on-surface);
-
-        &[data-has-widgets] {
-          margin-left: 0;
-        }
-      }
     }
   }
 
@@ -177,6 +165,23 @@
     }
   }
 
+  .walkthrough-inline[open] > summary {
+    border-radius: var(--sys-shape-corner-medium-small);
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+    background: var(--sys-color-surface5);
+    color: var(--sys-color-on-surface);
+
+    &[data-has-widgets] {
+      margin-left: 0;
+    }
+
+    > devtools-icon[name='chevron-right'] {
+      transform: rotate(270deg);
+    }
+
+  }
+
   .walkthrough-inline > summary::-webkit-details-marker {
     display: none;
   }
@@ -201,8 +206,4 @@
   .walkthrough-inline .step {
     background-color: var(--sys-color-surface5);
   }
-
-  .walkthrough-inline[open] > summary > devtools-icon[name='chevron-right'] {
-    transform: rotate(270deg);
-  }
 }

package/front_end/panels/application/WebMCPView.ts

@@ -433,19 +433,23 @@ export const DEFAULT_VIEW: View = (input, output, target) => {
                   @click=${() => input.onCallSelect(null)}
                 ></devtools-button>
                 <devtools-widget
-                  id="details"
+                  id="webmcp.tool-details"
                   title=${i18nString(UIStrings.toolDetails)}
                   ${widget(ToolDetailsWidget, {tool: input.selectedCall?.tool})}>
                 </devtools-widget>
                 <devtools-widget
-                  id="inputs"
+                  id="webmcp.call-inputs"
                   title=${i18nString(UIStrings.input)}
                   ${widget(PayloadWidget, parsePayload(input.selectedCall?.input))}>
                 </devtools-widget>
                 <devtools-widget
-                  id="outputs"
+                  id="webmcp.call-outputs"
                   title=${i18nString(UIStrings.output)}
-                  ${widget(PayloadWidget, parsePayload(input.selectedCall?.result?.output))}>
+                  ${widget(PayloadWidget, {
+                          valueObject: input.selectedCall?.result?.output,
+                          errorText: input.selectedCall?.result?.errorText,
+                          exceptionDetails: input.selectedCall?.result?.exceptionDetails,
+                  })}>
                 </devtools-widget>
               </devtools-tabbed-pane>
             </div>
@@ -685,10 +689,12 @@ export class WebMCPView extends UI.Widget.VBox {
 export interface PayloadViewInput {
   valueObject?: unknown;
   valueString?: string;
+  errorText?: string;
+  exceptionDetails?: WebMCP.WebMCPModel.ExceptionDetails;
 }
 
 export const PAYLOAD_DEFAULT_VIEW = (input: PayloadViewInput, output: object, target: HTMLElement): void => {
-  if (input.valueObject === undefined && input.valueString === undefined) {
+  if (!input.valueObject && !input.valueString && !input.errorText && !input.exceptionDetails) {
     render(nothing, target);
     return;
   }
@@ -715,6 +721,52 @@ export const PAYLOAD_DEFAULT_VIEW = (input: PayloadViewInput, output: object, ta
   };
 
   const createSourceText = (text: string): TemplateResult => html`<div class="payload-value source-code">${text}</div>`;
+  const createErrorText = (text: string): TemplateResult =>
+      html`<div class="payload-value source-code error-text">${text}</div>`;
+
+  const createException = (
+      details: WebMCP.WebMCPModel.ExceptionDetails,
+      linkifier: Components.Linkifier.Linkifier = new Components.Linkifier.Linkifier(),
+      ): TemplateResult => {
+    const renderFrame = (
+        frame: StackTrace.ErrorStackParser.ParsedErrorFrame,
+        index: number,
+        array: StackTrace.ErrorStackParser.ParsedErrorFrame[],
+        ): TemplateResult => {
+      const newline = index < array.length - 1 ? '\n' : '';
+      const {line, link, isCallFrame} = frame;
+
+      if (!isCallFrame) {
+        return html`<span>${line}${newline}</span>`;
+      }
+
+      if (!link) {
+        return html`<span class="formatted-builtin-stack-frame">${line}${newline}</span>`;
+      }
+
+      const scriptLocationLink = linkifier.linkifyScriptLocation(
+          details.error.runtimeModel().target(),
+          link.scriptId || null,
+          link.url,
+          link.lineNumber,
+          {
+            columnNumber: link.columnNumber,
+            inlineFrameIndex: 0,
+            showColumnNumber: true,
+          },
+      );
+      scriptLocationLink.tabIndex = -1;
+
+      return html`<span class="formatted-stack-frame">${link.prefix}${scriptLocationLink}${link.suffix}${
+          newline}</span>`;
+    };
+
+    return html`
+      <div class="payload-value source-code error-text">
+        ${details.frames.length === 0 && details.description ? html`<span>${details.description}\n</span>` : nothing}
+        <div>${details.frames.map(renderFrame)}</div>
+        ${details.cause ? html`\nCaused by:\n${createException(details.cause, linkifier)}` : nothing}</div>`;
+  };
 
   render(
       html`
@@ -723,7 +775,10 @@ export const PAYLOAD_DEFAULT_VIEW = (input: PayloadViewInput, output: object, ta
       <div class="call-payload-content">
             ${
           isParsable ? createPayload(input.valueObject) :
-                       (input.valueString !== undefined ? createSourceText(input.valueString) : nothing)}
+                       (input.valueString !== undefined ?
+                            createSourceText(input.valueString) :
+                            (input.exceptionDetails ? createException(input.exceptionDetails) :
+                                                      (input.errorText ? createErrorText(input.errorText) : nothing)))}
       </div>
     </div>
   `,
@@ -733,6 +788,9 @@ export const PAYLOAD_DEFAULT_VIEW = (input: PayloadViewInput, output: object, ta
 export class PayloadWidget extends UI.Widget.Widget {
   #valueObject?: unknown;
   #valueString?: string;
+  #errorText?: string;
+  #exceptionDetailsPromise?: Promise<WebMCP.WebMCPModel.ExceptionDetails|undefined>;
+  #exceptionDetails?: WebMCP.WebMCPModel.ExceptionDetails;
   #view: typeof PAYLOAD_DEFAULT_VIEW;
 
   constructor(element?: HTMLElement, view = PAYLOAD_DEFAULT_VIEW) {
@@ -758,6 +816,37 @@ export class PayloadWidget extends UI.Widget.Widget {
     return this.#valueString;
   }
 
+  set errorText(errorText: string|undefined) {
+    this.#errorText = errorText;
+    this.requestUpdate();
+  }
+
+  get errorText(): string|undefined {
+    return this.#errorText;
+  }
+
+  async #updateExceptionDetails(
+      exceptionDetailsPromise: Promise<WebMCP.WebMCPModel.ExceptionDetails|undefined>|undefined): Promise<void> {
+    if (this.#exceptionDetailsPromise === exceptionDetailsPromise) {
+      return;
+    }
+    this.#exceptionDetailsPromise = exceptionDetailsPromise;
+    this.#exceptionDetails = undefined;
+    this.requestUpdate();
+    const exceptionDetails = await exceptionDetailsPromise;
+    if (this.#exceptionDetailsPromise === exceptionDetailsPromise) {
+      this.#exceptionDetails = exceptionDetails;
+      this.requestUpdate();
+    }
+  }
+
+  set exceptionDetails(exceptionDetailsPromise: Promise<WebMCP.WebMCPModel.ExceptionDetails|undefined>|undefined) {
+    void this.#updateExceptionDetails(exceptionDetailsPromise);
+  }
+
+  get exceptionDetails(): Promise<WebMCP.WebMCPModel.ExceptionDetails|undefined>|undefined {
+    return this.#exceptionDetailsPromise;
+  }
   override wasShown(): void {
     super.wasShown();
     this.requestUpdate();
@@ -767,6 +856,8 @@ export class PayloadWidget extends UI.Widget.Widget {
     const input: PayloadViewInput = {
       valueObject: this.#valueObject,
       valueString: this.#valueString,
+      errorText: this.#errorText,
+      exceptionDetails: this.#exceptionDetails,
     };
     this.#view(input, {}, this.contentElement);
   }

package/front_end/panels/application/webMCPView.css

@@ -48,7 +48,8 @@
         background-color: var(--sys-color-tonal-container);
       }
 
-      tr.selected.status-error {
+      tbody tr.selected.status-error,
+      tbody tr.selected.status-error.revealed {
         background-color: var(--sys-color-error-container);
         color: var(--sys-color-error);
       }
@@ -210,4 +211,9 @@
         flex: auto;
         overflow: auto;
     }
+
+    .payload-value.error-text {
+      color: var(--sys-color-error);
+      white-space: pre-wrap;
+    }
 }

package/front_end/panels/sources/BreakpointEditDialog.ts

@@ -208,6 +208,12 @@ export class BreakpointEditDialog extends UI.Widget.Widget {
     this.requestUpdate();
   }
 
+  override focus(): void {
+    void this.updateComplete.then(() => {
+      this.#editor?.focus();
+    });
+  }
+
   override performUpdate(): void {
     const input: ViewInput = {
       state: this.#getEditorState(),

package/front_end/third_party/chromium/README.chromium

@@ -1,7 +1,7 @@
 Name: Dependencies sourced from the upstream `chromium` repository
 URL: Internal
 Version: N/A
-Revision: 295046833fe5ffe7765e09abf4e9c15980d09e76
+Revision: ba9b7fcecd6da792b29305cac5a406adc76fc1e5
 Update Mechanism: Manual (https://crbug.com/428069060)
 License: BSD-3-Clause
 License File: LICENSE

package/front_end/ui/components/markdown_view/CodeBlock.ts

@@ -26,6 +26,11 @@ const UIStrings = {
    * @description The title of the button to copy the codeblock from a Markdown view.
    */
   copy: 'Copy code',
+  /**
+   * @description Accessible label for the button to copy the code block, referencing the specific content.
+   * @example {Data used} PH1
+   */
+  copyCodeSnippet: 'Copy {PH1} code snippet',
   /**
    * @description The title of the button after it was pressed and the text was copied to clipboard.
    */
@@ -242,6 +247,7 @@ export class CodeBlock extends HTMLElement {
               title: i18nString(UIStrings.copy),
             } as Buttons.Button.ButtonData
           }
+          .accessibleLabel=${this.#header ? i18nString(UIStrings.copyCodeSnippet, { PH1: this.#header }) : i18nString(UIStrings.copy)}
           @click=${this.#onCopy}
         ></devtools-button>
         ${this.#copied ? html`<span>${i18nString(UIStrings.copied)}</span>` : Lit.nothing}

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -4334,11 +4334,15 @@ export const knownContextValues = new Set([
   'webauthn.remove-credential',
   'webgl-error-fired',
   'webgl-warning-fired',
+  'webmcp.call-inputs',
+  'webmcp.call-outputs',
   'webmcp.declarative',
   'webmcp.error',
   'webmcp.imperative',
   'webmcp.pending',
+  'webmcp.status-types',
   'webmcp.success',
+  'webmcp.tool-details',
   'webp-format-disabled',
   'webp-format-disabled-true',
   'websocket',

package/mcp/mcp.ts

@@ -28,7 +28,7 @@ export {Target} from '../front_end/core/sdk/Target.js';
 export {TargetManager} from '../front_end/core/sdk/TargetManager.js';
 export * as Foundation from '../front_end/foundation/foundation.js';
 export * as Protocol from '../front_end/generated/protocol.js';
-export {NetworkRequestFormatter} from '../front_end/models/ai_assistance/data_formatters/NetworkRequestFormatter.js';
+export * as NetworkRequestFormatter from '../front_end/models/ai_assistance/data_formatters/NetworkRequestFormatter.js';
 export {
   PerformanceInsightFormatter
 } from '../front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.js';

package/package.json

@@ -104,5 +104,5 @@
       "flat-cache": "6.1.12"
     }
   },
-  "version": "1.0.1611390"
+  "version": "1.0.1611825"
 }