chrome-devtools-frontend 1.0.1643099 → 1.0.1645245

package/front_end/models/source_map_scopes/FunctionCodeResolver.ts

@@ -203,7 +203,14 @@ function createFunctionCode(
 }
 
 /**
- * The input location may be a source mapped location or a raw location.
+ * Resolves the function code and its surrounding context for a given location.
+ *
+ * The input location (line, column) may be either an authored (source-mapped)
+ * location or a raw location. The function will attempt to resolve it to a
+ * raw location regardless. This is necessary because callers (such as AI
+ * assistance) may work with either format.
+ *
+ * We filter projects by `target` to prevent cross-origin leaks.
  */
 export async function getFunctionCodeFromLocation(
     target: SDK.Target.Target, url: Platform.DevToolsPath.UrlString, line: number, column: number,
@@ -213,10 +220,13 @@ export async function getFunctionCodeFromLocation(
     throw new Error('missing debugger model');
   }
 
-  let uiSourceCode;
+  let uiSourceCode: Workspace.UISourceCode.UISourceCode|null = null;
   const debuggerWorkspaceBinding = Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance();
   const projects = debuggerWorkspaceBinding.workspace.projectsForType(Workspace.Workspace.projectTypes.Network);
   for (const project of projects) {
+    if (Bindings.NetworkProject.NetworkProject.getTargetForProject(project) !== target) {
+      continue;
+    }
     uiSourceCode = project.uiSourceCodeForURL(url);
     if (uiSourceCode) {
       break;

package/front_end/models/stack_trace/DetailedErrorStackParser.ts

@@ -10,13 +10,15 @@ import type {RawFrame} from './Trie.js';
 
 const CALL_FRAME_REGEX = /^\s*at\s+/;
 
+export type ResolveURLCallback = (url: Platform.DevToolsPath.UrlString) => Platform.DevToolsPath.UrlString|null;
+
 /**
  * Takes a V8 Error#stack string and extracts structured information.
  *
  * @returns Null if the provided string has an unexpected format. A
  *          populated `RawFrame[]` otherwise.
  */
-export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
+export function parseRawFramesFromErrorStack(stack: string, resolveURL?: ResolveURLCallback): RawFrame[]|null {
   const lines = stack.split('\n');
   const firstAtLineIndex = findFramesStartLine(lines);
   const rawFrames: RawFrame[] = [];
@@ -62,60 +64,70 @@ export function parseRawFramesFromErrorStack(stack: string): RawFrame[]|null {
     let evalOrigin: RawFrame|undefined;
 
     const openParenIndex = lineContent.indexOf(' (');
+    let location = '';
     if (lineContent.endsWith(')') && openParenIndex !== -1) {
       functionName = lineContent.substring(0, openParenIndex).trim();
-      let location = lineContent.substring(openParenIndex + 2, lineContent.length - 1);
-
-      if (location.startsWith('eval at ')) {
-        isEval = true;
-        const commaIndex = location.lastIndexOf(', ');
-        let evalOriginStr = location;
-        if (commaIndex !== -1) {
-          evalOriginStr = location.substring(0, commaIndex);
-          location = location.substring(commaIndex + 2);
-        } else {
-          location = '';
-        }
+      location = lineContent.substring(openParenIndex + 2, lineContent.length - 1);
+    } else if (lineContent.startsWith('(') && lineContent.endsWith(')')) {
+      location = lineContent.substring(1, lineContent.length - 1);
+    } else {
+      location = lineContent;
+    }
 
-        if (evalOriginStr.startsWith('eval at ')) {
-          evalOriginStr = evalOriginStr.substring(8);
-        }
-        const innerOpenParen = evalOriginStr.indexOf(' (');
-        let evalFunctionName = evalOriginStr;
-        let evalLocation = '';
-        if (innerOpenParen !== -1) {
-          evalFunctionName = evalOriginStr.substring(0, innerOpenParen).trim();
-          evalLocation = evalOriginStr.substring(innerOpenParen + 2, evalOriginStr.length - 1);
-          evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName} (${evalLocation})`)?.[0];
-        } else {
-          evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName}`)?.[0];
-        }
+    if (location.startsWith('eval at ')) {
+      isEval = true;
+      const commaIndex = location.lastIndexOf(', ');
+      let evalOriginStr = location;
+      if (commaIndex !== -1) {
+        evalOriginStr = location.substring(0, commaIndex);
+        location = location.substring(commaIndex + 2);
+      } else {
+        location = '';
       }
 
-      if (location.startsWith('index ')) {
-        promiseIndex = parseInt(location.substring(6), 10);
-        url = '';
-      } else if (location === '<anonymous>' || location === 'native') {
-        url = '';
-      } else if (location.includes(':wasm-function[')) {
-        isWasm = true;
-        const wasmMatch = /^(.*):wasm-function\[(\d+)\]:(0x[0-9a-fA-F]+)$/.exec(location);
-        if (wasmMatch) {
-          url = wasmMatch[1];
-          wasmFunctionIndex = parseInt(wasmMatch[2], 10);
-          columnNumber = parseInt(wasmMatch[3], 16);
-        }
+      if (evalOriginStr.startsWith('eval at ')) {
+        evalOriginStr = evalOriginStr.substring(8);
+      }
+      const innerOpenParen = evalOriginStr.indexOf(' (');
+      let evalFunctionName = evalOriginStr;
+      let evalLocation = '';
+      if (innerOpenParen !== -1) {
+        evalFunctionName = evalOriginStr.substring(0, innerOpenParen).trim();
+        evalLocation = evalOriginStr.substring(innerOpenParen + 2, evalOriginStr.length - 1);
+        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName} (${evalLocation})`, resolveURL)?.[0];
       } else {
-        const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(location);
-        url = splitResult.url;
-        lineNumber = splitResult.lineNumber ?? -1;
-        columnNumber = splitResult.columnNumber ?? -1;
+        evalOrigin = parseRawFramesFromErrorStack(`    at ${evalFunctionName}`, resolveURL)?.[0];
       }
-    } else {
-      const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(lineContent);
-      url = splitResult.url;
+    }
+
+    if (location.startsWith('index ')) {
+      promiseIndex = parseInt(location.substring(6), 10);
+      url = '';
+    } else if (location === '<anonymous>' || location === 'native') {
+      url = '';
+    } else if (location.includes(':wasm-function[')) {
+      isWasm = true;
+      const wasmMatch = /^(.*):wasm-function\[(\d+)\]:(0x[0-9a-fA-F]+)$/.exec(location);
+      if (wasmMatch) {
+        url = wasmMatch[1];
+        wasmFunctionIndex = parseInt(wasmMatch[2], 10);
+        columnNumber = parseInt(wasmMatch[3], 16);
+        lineNumber = 0;
+      }
+    } else if (location) {
+      const splitResult = Common.ParsedURL.ParsedURL.splitLineAndColumn(location);
       lineNumber = splitResult.lineNumber ?? -1;
       columnNumber = splitResult.columnNumber ?? -1;
+
+      if (resolveURL && splitResult.url !== '<anonymous>' && splitResult.url !== 'native') {
+        const resolved = resolveURL(splitResult.url);
+        if (!resolved) {
+          return null;
+        }
+        url = resolved;
+      } else {
+        url = splitResult.url;
+      }
     }
 
     // Handle "typeName.methodName [as alias]"
@@ -181,13 +193,7 @@ export function parseMessage(stack: string): string {
 export function augmentRawFramesWithScriptIds(
     rawFrames: RawFrame[], protocolStackTrace: Protocol.Runtime.StackTrace): void {
   function augmentFrame(rawFrame: RawFrame): void {
-    const isWasm = rawFrame.isWasm;
     const protocolFrame = protocolStackTrace.callFrames.find(frame => {
-      if (isWasm) {
-        // The parser parses Wasm offsets into the `columnNumber` field. The `lineNumber` is always -1.
-        // In the protocol trace, the `lineNumber` is 0 (for Wasm) and `columnNumber` is the bytecode offset.
-        return rawFrame.url === frame.url && rawFrame.columnNumber === frame.columnNumber;
-      }
       return rawFrame.url === frame.url && rawFrame.lineNumber === frame.lineNumber &&
           rawFrame.columnNumber === frame.columnNumber;
     });

package/front_end/models/stack_trace/StackTrace.ts

@@ -48,6 +48,13 @@ export interface Frame {
    * Whether the corresponding raw frame is JS or WASM.
    */
   readonly isWasm?: boolean;
+  /**
+   * Whether this frame is an inlined frame. Used by SymbolizedErrorWidget
+   * to render the translated name (i.e. `name`) for inlined frames, and
+   * the physical name (i.e. `rawName`) for normal frames to preserve existing
+   * behavior.
+   */
+  readonly isInline?: boolean;
 }
 
 export interface ParsedErrorStackFrame extends Frame {

package/front_end/models/stack_trace/StackTraceImpl.ts

@@ -89,11 +89,12 @@ export class FrameImpl implements StackTrace.StackTrace.Frame {
   readonly missingDebugInfo?: StackTrace.StackTrace.MissingDebugInfo;
   readonly rawName?: string;
   readonly isWasm?: boolean;
+  readonly isInline?: boolean;
 
-  constructor(
-      url: string|undefined, uiSourceCode: Workspace.UISourceCode.UISourceCode|undefined, name: string|undefined,
-      line: number, column: number, missingDebugInfo?: StackTrace.StackTrace.MissingDebugInfo, rawName?: string,
-      isWasm?: boolean) {
+  constructor(url: string|undefined, uiSourceCode: Workspace.UISourceCode.UISourceCode|undefined,
+              name: string|undefined, line: number, column: number,
+              missingDebugInfo?: StackTrace.StackTrace.MissingDebugInfo, rawName?: string, isWasm?: boolean,
+              isInline?: boolean) {
     this.url = url;
     this.uiSourceCode = uiSourceCode;
     this.name = name;
@@ -102,6 +103,7 @@ export class FrameImpl implements StackTrace.StackTrace.Frame {
     this.missingDebugInfo = missingDebugInfo;
     this.rawName = rawName;
     this.isWasm = isWasm;
+    this.isInline = isInline;
   }
 }
 
@@ -197,6 +199,9 @@ export class ParsedErrorStackFrameImpl implements StackTrace.StackTrace.ParsedEr
   get isWasm(): boolean|undefined {
     return this.#frame.isWasm;
   }
+  get isInline(): boolean|undefined {
+    return this.#frame.isInline;
+  }
   get wasmModuleName(): string|undefined {
     return this.#parsedFrameInfo?.wasmModuleName;
   }
@@ -291,6 +296,10 @@ export class DebuggableFrameImpl implements StackTrace.StackTrace.DebuggableFram
     return this.#frame.isWasm;
   }
 
+  get isInline(): boolean|undefined {
+    return this.#frame.isInline;
+  }
+
   get sdkFrame(): SDK.DebuggerModel.CallFrame {
     return this.#sdkFrame;
   }

package/front_end/models/stack_trace/StackTraceModel.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 
@@ -65,7 +66,17 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   async createFromErrorStackLikeString(
       stack: string, rawFramesToUIFrames: TranslateRawFrames,
       exceptionDetails?: Protocol.Runtime.ExceptionDetails): Promise<StackTrace.StackTrace.ParsedErrorStackTrace|null> {
-    const rawFrames = parseRawFramesFromErrorStack(stack);
+    const debuggerModel = this.target().model(SDK.DebuggerModel.DebuggerModel) as SDK.DebuggerModel.DebuggerModel;
+    const baseURL = this.target().inspectedURL();
+    const resolveURL = (url: Platform.DevToolsPath.UrlString): Platform.DevToolsPath.UrlString|null => {
+      let urlWithScheme = parseOrScriptMatch(debuggerModel, url);
+      if (!urlWithScheme && Common.ParsedURL.ParsedURL.isRelativeURL(url)) {
+        urlWithScheme = parseOrScriptMatch(debuggerModel, Common.ParsedURL.ParsedURL.completeURL(baseURL, url));
+      }
+      return urlWithScheme;
+    };
+
+    const rawFrames = parseRawFramesFromErrorStack(stack, resolveURL);
     if (!rawFrames) {
       return null;
     }
@@ -211,10 +222,11 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
     let i = 0;
     let evalI = 0;
     for (const node of fragment.node.getCallStack()) {
-      node.frames = uiFrames[i++].map(
-          frame => new FrameImpl(
-              frame.url, frame.uiSourceCode, frame.name, frame.line, frame.column, frame.missingDebugInfo,
-              node.rawFrame.functionName, node.rawFrame.isWasm));
+      const group = uiFrames[i++];
+      node.frames =
+          group.map((frame, index) => new FrameImpl(frame.url, frame.uiSourceCode, frame.name, frame.line, frame.column,
+                                                    frame.missingDebugInfo, node.rawFrame.functionName,
+                                                    node.rawFrame.isWasm, index < group.length - 1));
 
       if (node.parsedFrameInfo?.evalOrigin) {
         node.evalOrigin = evalOrigins[evalI++];
@@ -253,10 +265,10 @@ async function translateEvalOrigin(
     rawFrame: RawFrame, rawFramesToUIFrames: TranslateRawFrames,
     target: SDK.Target.Target): Promise<EvalOrigin|undefined> {
   const uiFrames = await rawFramesToUIFrames([rawFrame], target);
-  const frames = uiFrames[0].map(
-      frame => new FrameImpl(
-          frame.url, frame.uiSourceCode, frame.name, frame.line, frame.column, frame.missingDebugInfo,
-          rawFrame.functionName, rawFrame.isWasm));
+  const group = uiFrames[0];
+  const frames = group.map((frame, index) => new FrameImpl(frame.url, frame.uiSourceCode, frame.name, frame.line,
+                                                           frame.column, frame.missingDebugInfo, rawFrame.functionName,
+                                                           rawFrame.isWasm, index < group.length - 1));
 
   let parentEvalOrigin: EvalOrigin|undefined;
   if (rawFrame.parsedFrameInfo?.evalOrigin) {
@@ -266,4 +278,26 @@ async function translateEvalOrigin(
   return new EvalOrigin(frames, parentEvalOrigin);
 }
 
+function parseOrScriptMatch(debuggerModel: SDK.DebuggerModel.DebuggerModel,
+                            url: Platform.DevToolsPath.UrlString|null): Platform.DevToolsPath.UrlString|null {
+  if (!url) {
+    return null;
+  }
+  if (Common.ParsedURL.ParsedURL.isValidUrlString(url)) {
+    return url;
+  }
+  if (debuggerModel.scriptsForSourceURL(url).length) {
+    return url;
+  }
+  // nodejs stack traces contain (absolute) file paths, but v8 reports them as file: urls.
+  try {
+    const fileUrl = new URL(url, 'file://');
+    if (debuggerModel.scriptsForSourceURL(fileUrl.href as Platform.DevToolsPath.UrlString).length) {
+      return fileUrl.href as Platform.DevToolsPath.UrlString;
+    }
+  } catch {
+  }
+  return null;
+}
+
 SDK.SDKModel.SDKModel.register(StackTraceModel, {capabilities: SDK.Target.Capability.NONE, autostart: false});

package/front_end/models/trace/Styles.ts

@@ -291,6 +291,10 @@ const UIStrings = {
    * @description Text in Timeline UIUtils of the Performance panel
    */
   frameStartedLoading: 'Frame started loading',
+  /**
+   * @description Text in Timeline UIUtils of the Performance panel
+   */
+  softNavigationStart: 'Soft navigation start',
   /**
    * @description Text in Timeline UIUtils of the Performance panel
    */
@@ -307,6 +311,10 @@ const UIStrings = {
    * @description Text in Timeline UIUtils of the Performance panel
    */
   firstContentfulPaint: 'First Contentful Paint',
+  /**
+   * @description Text in Timeline UIUtils of the Performance panel
+   */
+  softFirstContentfulPaint: 'Soft First Contentful Paint',
   /**
    * @description Text in Timeline UIUtils of the Performance panel
    */
@@ -866,6 +874,12 @@ export function maybeInitSylesMap(): EventStylesMap {
         true,
         ),
 
+    [Types.Events.Name.SOFT_NAVIGATION_START]: new TimelineRecordStyle(
+        i18nString(UIStrings.softNavigationStart),
+        defaultCategoryStyles.loading,
+        true,
+        ),
+
     [Types.Events.Name.MARK_FIRST_PAINT]: new TimelineRecordStyle(
         i18nString(UIStrings.firstPaint),
         defaultCategoryStyles.painting,
@@ -878,6 +892,12 @@ export function maybeInitSylesMap(): EventStylesMap {
         true,
         ),
 
+    [Types.Events.Name.MARK_SOFT_FCP]: new TimelineRecordStyle(
+        i18nString(UIStrings.softFirstContentfulPaint),
+        defaultCategoryStyles.rendering,
+        true,
+        ),
+
     [Types.Events.Name.MARK_LCP_CANDIDATE]: new TimelineRecordStyle(
         i18nString(UIStrings.largestContentfulPaint),
         defaultCategoryStyles.rendering,
@@ -1024,11 +1044,11 @@ export function maybeInitSylesMap(): EventStylesMap {
     [Types.Events.Name.ASYNC_TASK]:
         new TimelineRecordStyle(i18nString(UIStrings.asyncTask), defaultCategoryStyles.async),
 
-    [Types.Events.Name.LAYOUT_SHIFT]: new TimelineRecordStyle(
-        i18nString(UIStrings.layoutShift), defaultCategoryStyles.experience,
-        /* Mark LayoutShifts as hidden; in the timeline we render
-        * SyntheticLayoutShifts so those are the ones visible to the user */
-        true),
+    [Types.Events.Name.LAYOUT_SHIFT]:
+        new TimelineRecordStyle(i18nString(UIStrings.layoutShift), defaultCategoryStyles.experience,
+                                /* Mark LayoutShifts as hidden; in the timeline we render
+                                 * SyntheticLayoutShifts so those are the ones visible to the user */
+                                true),
 
     [Types.Events.Name.SYNTHETIC_LAYOUT_SHIFT]:
         new TimelineRecordStyle(i18nString(UIStrings.layoutShift), defaultCategoryStyles.experience),
@@ -1123,9 +1143,11 @@ export function markerDetailsForEvent(event: Types.Events.Event): {
 } {
   let title = '';
   let color = 'var(--color-text-primary)';
-  if (Types.Events.isFirstContentfulPaint(event)) {
+  if (Types.Events.isAnyFirstContentfulPaint(event)) {
     color = 'var(--sys-color-green-bright)';
-    title = Handlers.ModelHandlers.PageLoadMetrics.MetricName.FCP;
+    title = (Types.Events.isSoftFirstContentfulPaint(event)) ?
+        Handlers.ModelHandlers.PageLoadMetrics.MetricName.SOFT_FCP :
+        Handlers.ModelHandlers.PageLoadMetrics.MetricName.FCP;
   }
   if (Types.Events.isAnyLargestContentfulPaintCandidate(event)) {
     color = 'var(--sys-color-green)';

package/front_end/models/trace/handlers/PageLoadMetricsHandler.ts

@@ -75,6 +75,28 @@ export function handleEvent(event: Types.Events.Event): void {
     return;
   }
   pageLoadEventsArray.push(event);
+
+  // A soft nav entry includes the Soft FCP details but we want to process both
+  // so push a separate Soft FCP event
+  if (Types.Events.isSoftNavigationStart(event) && event.args?.context?.firstContentfulPaint) {
+    const syntheticSoftFcpEvent = Helpers.SyntheticEvents.SyntheticEventsManager
+                                      .registerSyntheticEvent<Types.Events.SyntheticSoftFirstContentfulPaint>({
+                                        name: Types.Events.Name.MARK_SOFT_FCP,
+                                        ph: Types.Events.Phase.MARK,
+                                        rawSourceEvent: event,
+                                        pid: event.pid,
+                                        tid: event.tid,
+                                        ts: Types.Timing.Micro(event.args.context.firstContentfulPaint),
+                                        cat: event.cat,
+                                        args: {
+                                          frame: event.args.frame,
+                                          context: {
+                                            ...event.args.context,
+                                          },
+                                        },
+                                      });
+    pageLoadEventsArray.push(syntheticSoftFcpEvent);
+  }
 }
 
 function storePageLoadMetricAgainstNavigationId(
@@ -101,7 +123,7 @@ function storePageLoadMetricAgainstNavigationId(
     return;
   }
 
-  if (Types.Events.isFirstContentfulPaint(event)) {
+  if (Types.Events.isAnyFirstContentfulPaint(event)) {
     const fcpTime = Types.Timing.Micro(event.ts - navigation.ts);
     const classification = scoreClassificationForFirstContentfulPaint(fcpTime);
     const metricScore = {event, metricName: MetricName.FCP, classification, navigation, timing: fcpTime};
@@ -226,7 +248,7 @@ function storeMetricScore(frameId: string, navigation: AnyNavigationStart, metri
 }
 
 export function getFrameIdForPageLoadEvent(event: Types.Events.PageLoadEvent): string {
-  if (Types.Events.isFirstContentfulPaint(event) || Types.Events.isInteractiveTime(event) ||
+  if (Types.Events.isAnyFirstContentfulPaint(event) || Types.Events.isInteractiveTime(event) ||
       Types.Events.isAnyLargestContentfulPaintCandidate(event) || Types.Events.isNavigationStart(event) ||
       Types.Events.isSoftNavigationStart(event) || Types.Events.isLayoutShift(event) ||
       Types.Events.isFirstPaint(event)) {
@@ -243,7 +265,7 @@ export function getFrameIdForPageLoadEvent(event: Types.Events.PageLoadEvent): s
 }
 
 function getNavigationForPageLoadEvent(event: Types.Events.PageLoadEvent): AnyNavigationStart|null {
-  if (Types.Events.isFirstContentfulPaint(event) || Types.Events.isAnyLargestContentfulPaintCandidate(event) ||
+  if (Types.Events.isAnyFirstContentfulPaint(event) || Types.Events.isAnyLargestContentfulPaintCandidate(event) ||
       Types.Events.isFirstPaint(event)) {
     const {navigationsByNavigationId, softNavigationsById} = metaHandlerData();
 
@@ -255,6 +277,12 @@ function getNavigationForPageLoadEvent(event: Types.Events.PageLoadEvent): AnyNa
         // The most recent soft navigation must have been before the trace started.
         return null;
       }
+    } else if (Types.Events.isSoftFirstContentfulPaint(event) && event.args.context?.performanceTimelineNavigationId) {
+      navigation = softNavigationsById.get(event.args.context.performanceTimelineNavigationId);
+      if (!navigation) {
+        // The most recent soft navigation must have been before the trace started.
+        return null;
+      }
     } else {
       const navigationId = event.args.data?.navigationId;
       if (!navigationId) {
@@ -428,7 +456,7 @@ export async function finalize(): Promise<void> {
   // Filter out LCP candidates to use only definitive LCP values
   const allEventsButLCP =
       pageLoadEventsArray.filter(event => !Types.Events.isAnyLargestContentfulPaintCandidate(event));
-  const markerEvents = [...allFinalLCPEvents, ...allEventsButLCP].filter(Types.Events.isMarkerEvent);
+  const markerEvents = [...allEventsButLCP, ...allFinalLCPEvents].filter(Types.Events.isMarkerEvent);
   // Filter by main frame and sort.
   allMarkerEvents =
       markerEvents.filter(event => getFrameIdForPageLoadEvent(event) === mainFrame).sort((a, b) => a.ts - b.ts);
@@ -495,6 +523,7 @@ export const enum MetricName {
   NAV = 'Nav',
   // Soft Navigation and Soft Metrics
   SOFT_NAV = 'Nav*',
+  SOFT_FCP = 'FCP*',
   SOFT_LCP = 'LCP*',
   // Note: INP is handled in UserInteractionsHandler
 }

package/front_end/models/trace/helpers/Timing.ts

@@ -32,6 +32,16 @@ export function timeStampForEventAdjustedByClosestNavigation(
     if (navigationForEvent) {
       eventTimeStamp = event.ts - navigationForEvent.ts;
     }
+  } else if (Types.Events.isSoftFirstContentfulPaint(event) && event.args?.context?.performanceTimelineNavigationId) {
+    const navigationForEvent = softNavigationsById.get(event.args.context.performanceTimelineNavigationId);
+    if (navigationForEvent) {
+      eventTimeStamp = event.ts - navigationForEvent.ts;
+    }
+  } else if (Types.Events.isSoftNavigationStart(event)) {
+    const navigationForEvent = getNavigationForTraceEvent(event, event.args.frame, navigationsByFrameId);
+    if (navigationForEvent) {
+      eventTimeStamp = event.ts - navigationForEvent.ts;
+    }
   } else if (event.args?.data?.navigationId) {
     const navigationForEvent = navigationsByNavigationId.get(event.args.data.navigationId);
     if (navigationForEvent) {

package/front_end/models/trace/types/TraceEvents.ts

@@ -737,6 +737,16 @@ export interface FirstContentfulPaint extends Mark {
   };
 }
 
+// Soft FCP is basically a copy of SoftNavigationStart but with a different name
+// and a different ts.
+export interface SyntheticSoftFirstContentfulPaint extends Omit<SoftNavigationStart, 'name'|'ph'>,
+                                                           Omit<SyntheticBased, 'name'|'ph'|'args'> {
+  name: Name.MARK_SOFT_FCP;
+  ph: Phase.MARK;
+}
+
+export type AnyFirstContentfulPaint = FirstContentfulPaint|SyntheticSoftFirstContentfulPaint;
+
 export interface FirstPaint extends Mark {
   name: Name.MARK_FIRST_PAINT;
   args: Args&{
@@ -747,14 +757,14 @@ export interface FirstPaint extends Mark {
   };
 }
 
-export type PageLoadEvent = FirstContentfulPaint|MarkDOMContent|InteractiveTime|AnyLargestContentfulPaintCandidate|
+export type PageLoadEvent = AnyFirstContentfulPaint|MarkDOMContent|InteractiveTime|AnyLargestContentfulPaintCandidate|
     LayoutShift|FirstPaint|MarkLoad|NavigationStart|SoftNavigationStart;
 
 const markerTypeGuards = [
   isMarkDOMContent,
   isMarkLoad,
   isFirstPaint,
-  isFirstContentfulPaint,
+  isAnyFirstContentfulPaint,
   isAnyLargestContentfulPaintCandidate,
   isNavigationStart,
   isSoftNavigationStart,
@@ -765,6 +775,7 @@ export const MarkerName = [
   Name.MARK_LOAD,
   Name.MARK_FIRST_PAINT,
   Name.MARK_FCP,
+  Name.MARK_SOFT_FCP,
   Name.MARK_LCP_CANDIDATE,
   Name.MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION,
   Name.NAVIGATION_START,
@@ -2285,6 +2296,14 @@ export function isFirstContentfulPaint(event: Event): event is FirstContentfulPa
   return event.name === Name.MARK_FCP;
 }
 
+export function isSoftFirstContentfulPaint(event: Event): event is SyntheticSoftFirstContentfulPaint {
+  return event.name === Name.MARK_SOFT_FCP;
+}
+
+export function isAnyFirstContentfulPaint(event: Event): event is AnyFirstContentfulPaint {
+  return event.name === Name.MARK_FCP || event.name === Name.MARK_SOFT_FCP;
+}
+
 export function isAnyLargestContentfulPaintCandidate(event: Event): event is AnyLargestContentfulPaintCandidate {
   return event.name === Name.MARK_LCP_CANDIDATE || event.name === Name.MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION;
 }
@@ -3168,6 +3187,7 @@ export const enum Name {
   MARK_DOM_CONTENT = 'MarkDOMContent',
   MARK_FIRST_PAINT = 'firstPaint',
   MARK_FCP = 'firstContentfulPaint',
+  MARK_SOFT_FCP = 'SyntheticSoftFirstContentfulPaint',
   MARK_LCP_CANDIDATE = 'largestContentfulPaint::Candidate',
   MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION = 'largestContentfulPaint::CandidateForSoftNavigation',
   MARK_LCP_INVALIDATE = 'largestContentfulPaint::Invalidate',

package/front_end/panels/accessibility/AccessibilitySidebarView.ts

@@ -33,7 +33,7 @@ export class AccessibilitySidebarView extends UI.Widget.VBox {
   #node: SDK.DOMModel.DOMNode|null;
   #axNode: SDK.AccessibilityModel.AccessibilityNode|null;
   private skipNextPullNode: boolean;
-  private readonly sidebarPaneStack: UI.View.ViewLocation;
+  private readonly sidebarPaneStack: UI.ViewManager.StackLocation;
   private readonly ariaSubPane: ARIAAttributesPane;
   private readonly axNodeSubPane: AXNodeSubPane;
   private readonly sourceOrderSubPane: SourceOrderPane;
@@ -159,6 +159,7 @@ export class AccessibilitySidebarView extends UI.Widget.VBox {
 
   private updateToggle(): void {
     const isToggled = this.toggleAction.toggled();
+    this.sidebarPaneStack.notifyVisibilityChanged(isToggled);
     // eslint-disable-next-line @devtools/no-lit-render-outside-of-view
     render(
         html`

package/front_end/panels/ai_assistance/AiAssistancePanel.ts

@@ -1575,7 +1575,12 @@ export class AiAssistancePanel extends UI.Panel.Panel {
         break;
       }
       case 'ai-assistance.storage-floating-button': {
-        Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiAssistanceOpenedFromStoragePanelFloatingButton);
+        Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiAssistanceOpenedFromApplicationPanelFloatingButton);
+        targetConversationType = AiAssistanceModel.AiHistoryStorage.ConversationType.STORAGE;
+        break;
+      }
+      case 'ai-assistance.application-panel-context': {
+        Host.userMetrics.actionTaken(Host.UserMetrics.Action.AiAssistanceOpenedFromApplicationPanel);
         targetConversationType = AiAssistanceModel.AiHistoryStorage.ConversationType.STORAGE;
         break;
       }
@@ -2115,7 +2120,9 @@ export class ActionDelegate implements UI.ActionRegistration.ActionDelegate {
       case 'drjones.network-panel-context':
       case 'drjones.performance-panel-context':
       case 'drjones.sources-floating-button':
-      case 'drjones.sources-panel-context': {
+      case 'drjones.sources-panel-context':
+      case 'ai-assistance.storage-floating-button':
+      case 'ai-assistance.application-panel-context': {
         void (async () => {
           const view = UI.ViewManager.ViewManager.instance().view(
               AiAssistancePanel.panelName,

package/front_end/panels/ai_assistance/ai_assistance-meta.ts

@@ -313,3 +313,19 @@ UI.ActionRegistration.registerActionExtension({
   condition: config =>
       isStorageAgentFeatureAvailable(config) && !isPolicyRestricted(config) && !isGeoRestricted(config),
 });
+
+UI.ActionRegistration.registerActionExtension({
+  actionId: 'ai-assistance.application-panel-context',
+  contextTypes(): [] {
+    return [];
+  },
+  category: UI.ActionRegistration.ActionCategory.GLOBAL,
+  title: i18nAiBrandedString(UIStrings.debugWithGemini, UIStrings.debugWithAi),
+  configurableBindings: false,
+  async loadActionDelegate() {
+    const AiAssistance = await loadAiAssistanceModule();
+    return new AiAssistance.ActionDelegate();
+  },
+  condition: config =>
+      isStorageAgentFeatureAvailable(config) && !isPolicyRestricted(config) && !isGeoRestricted(config),
+});