chrome-devtools-frontend 1.0.1684555 → 1.0.1689415

package/front_end/generated/SupportedCSSProperties.ts

@@ -2,8 +2,25 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-/* eslint-disable @stylistic/quotes, @stylistic/quote-props, @stylistic/comma-dangle */
-export const generatedProperties = [
+/* eslint-disable @stylistic/quotes, @stylistic/quote-props, @stylistic/comma-dangle, @typescript-eslint/naming-convention */
+export interface CSSProperty {
+  name: string;
+  longhands?: string[];
+  inherited?: boolean;
+  svg?: boolean;
+  keywords?: string[];
+  devtools_keywords?: string[];
+  is_property?: boolean;
+  is_descriptor?: boolean;
+  runtime_flag?: string;
+  runtime_flag_status?: string | null;
+}
+
+export interface CSSPropertyValue {
+  values: string[];
+}
+
+export const generatedProperties: CSSProperty[] = [
  {
   "longhands": [
    "max-lines",
@@ -2002,9 +2019,7 @@ export const generatedProperties = [
    "normal",
    "intersection"
   ],
-  "name": "column-rule-break",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-break"
  },
  {
   "keywords": [
@@ -2019,81 +2034,63 @@ export const generatedProperties = [
    "column-rule-inset-junction-start",
    "column-rule-inset-junction-end"
   ],
-  "name": "column-rule-inset",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset"
  },
  {
   "longhands": [
    "column-rule-inset-cap-start",
    "column-rule-inset-cap-end"
   ],
-  "name": "column-rule-inset-cap",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-cap"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "column-rule-inset-cap-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-cap-end"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "column-rule-inset-cap-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-cap-start"
  },
  {
   "longhands": [
    "column-rule-inset-cap-end",
    "column-rule-inset-junction-end"
   ],
-  "name": "column-rule-inset-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-end"
  },
  {
   "longhands": [
    "column-rule-inset-junction-start",
    "column-rule-inset-junction-end"
   ],
-  "name": "column-rule-inset-junction",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-junction"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "column-rule-inset-junction-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-junction-end"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "column-rule-inset-junction-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-junction-start"
  },
  {
   "longhands": [
    "column-rule-inset-cap-start",
    "column-rule-inset-junction-start"
   ],
-  "name": "column-rule-inset-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-inset-start"
  },
  {
   "keywords": [
@@ -2118,9 +2115,7 @@ export const generatedProperties = [
    "around",
    "between"
   ],
-  "name": "column-rule-visibility-items",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "column-rule-visibility-items"
  },
  {
   "keywords": [
@@ -3235,7 +3230,7 @@ export const generatedProperties = [
   ],
   "name": "frame-sizing",
   "runtime_flag": "ResponsiveIframes",
-  "runtime_flag_status": "experimental"
+  "runtime_flag_status": "stable"
  },
  {
   "longhands": [
@@ -4695,9 +4690,7 @@ export const generatedProperties = [
    "row-rule-style",
    "row-rule-color"
   ],
-  "name": "row-rule",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule"
  },
  {
   "inherited": false,
@@ -4706,17 +4699,13 @@ export const generatedProperties = [
    "normal",
    "intersection"
   ],
-  "name": "row-rule-break",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-break"
  },
  {
   "keywords": [
    "currentcolor"
   ],
-  "name": "row-rule-color",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-color"
  },
  {
   "longhands": [
@@ -4725,81 +4714,63 @@ export const generatedProperties = [
    "row-rule-inset-junction-start",
    "row-rule-inset-junction-end"
   ],
-  "name": "row-rule-inset",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset"
  },
  {
   "longhands": [
    "row-rule-inset-cap-start",
    "row-rule-inset-cap-end"
   ],
-  "name": "row-rule-inset-cap",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-cap"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "row-rule-inset-cap-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-cap-end"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "row-rule-inset-cap-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-cap-start"
  },
  {
   "longhands": [
    "row-rule-inset-cap-end",
    "row-rule-inset-junction-end"
   ],
-  "name": "row-rule-inset-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-end"
  },
  {
   "longhands": [
    "row-rule-inset-junction-start",
    "row-rule-inset-junction-end"
   ],
-  "name": "row-rule-inset-junction",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-junction"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "row-rule-inset-junction-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-junction-end"
  },
  {
   "inherited": false,
   "keywords": [
    "overlap-join"
   ],
-  "name": "row-rule-inset-junction-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-junction-start"
  },
  {
   "longhands": [
    "row-rule-inset-cap-start",
    "row-rule-inset-junction-start"
   ],
-  "name": "row-rule-inset-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-inset-start"
  },
  {
   "keywords": [
@@ -4814,9 +4785,7 @@ export const generatedProperties = [
    "solid",
    "double"
   ],
-  "name": "row-rule-style",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-style"
  },
  {
   "inherited": false,
@@ -4826,9 +4795,7 @@ export const generatedProperties = [
    "around",
    "between"
   ],
-  "name": "row-rule-visibility-items",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-visibility-items"
  },
  {
   "keywords": [
@@ -4836,9 +4803,7 @@ export const generatedProperties = [
    "medium",
    "thick"
   ],
-  "name": "row-rule-width",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "row-rule-width"
  },
  {
   "inherited": true,
@@ -4878,27 +4843,21 @@ export const generatedProperties = [
    "row-rule-style",
    "row-rule-color"
   ],
-  "name": "rule",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule"
  },
  {
   "longhands": [
    "row-rule-break",
    "column-rule-break"
   ],
-  "name": "rule-break",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-break"
  },
  {
   "longhands": [
    "column-rule-color",
    "row-rule-color"
   ],
-  "name": "rule-color",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-color"
  },
  {
   "longhands": [
@@ -4911,9 +4870,7 @@ export const generatedProperties = [
    "column-rule-inset-junction-start",
    "column-rule-inset-junction-end"
   ],
-  "name": "rule-inset",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-inset"
  },
  {
   "longhands": [
@@ -4922,9 +4879,7 @@ export const generatedProperties = [
    "column-rule-inset-cap-start",
    "column-rule-inset-cap-end"
   ],
-  "name": "rule-inset-cap",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-inset-cap"
  },
  {
   "longhands": [
@@ -4933,9 +4888,7 @@ export const generatedProperties = [
    "row-rule-inset-cap-end",
    "row-rule-inset-junction-end"
   ],
-  "name": "rule-inset-end",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-inset-end"
  },
  {
   "longhands": [
@@ -4944,9 +4897,7 @@ export const generatedProperties = [
    "column-rule-inset-junction-start",
    "column-rule-inset-junction-end"
   ],
-  "name": "rule-inset-junction",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-inset-junction"
  },
  {
   "longhands": [
@@ -4955,9 +4906,7 @@ export const generatedProperties = [
    "row-rule-inset-cap-start",
    "row-rule-inset-junction-start"
   ],
-  "name": "rule-inset-start",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-inset-start"
  },
  {
   "inherited": false,
@@ -4965,36 +4914,28 @@ export const generatedProperties = [
    "row-over-column",
    "column-over-row"
   ],
-  "name": "rule-overlap",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-overlap"
  },
  {
   "longhands": [
    "column-rule-style",
    "row-rule-style"
   ],
-  "name": "rule-style",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-style"
  },
  {
   "longhands": [
    "column-rule-visibility-items",
    "row-rule-visibility-items"
   ],
-  "name": "rule-visibility-items",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-visibility-items"
  },
  {
   "longhands": [
    "column-rule-width",
    "row-rule-width"
   ],
-  "name": "rule-width",
-  "runtime_flag": "CSSGapDecoration",
-  "runtime_flag_status": "stable"
+  "name": "rule-width"
  },
  {
   "keywords": [
@@ -6167,7 +6108,7 @@ export const generatedProperties = [
   "name": "zoom"
  }
 ];
-export const generatedPropertyValues = {
+export const generatedPropertyValues: Record<string, CSSPropertyValue> = {
  "-alternative-webkit-line-clamp-longhand": {
   "values": [
    "none"
@@ -9310,7 +9251,7 @@ export const generatedPropertyValues = {
   ]
  }
 };
-export const generatedAliasesFor = new Map([
+export const generatedAliasesFor: Map<string, string> = new Map([
  [
   "-epub-caption-side",
   "caption-side"

package/front_end/generated/protocol-mapping.d.ts

@@ -1422,6 +1422,15 @@ export namespace ProtocolMapping {
       paramsType: [];
       returnType: Protocol.Browser.GetBrowserCommandLineResponse;
     };
+    /**
+     * Adds or updates a mock camera in the shared video capture device list for
+     * test automation. The mock camera is not scoped to a particular page or
+     * frame and is removed when the DevTools session that created it disconnects.
+     */
+    'Browser.addMockCamera': {
+      paramsType: [Protocol.Browser.AddMockCameraRequest];
+      returnType: void;
+    };
     /**
      * Get Chrome histograms.
      */

package/front_end/generated/protocol-proxy-api.d.ts

@@ -674,6 +674,13 @@ declare namespace ProtocolProxyApi {
      */
     invoke_getBrowserCommandLine(): Promise<Protocol.Browser.GetBrowserCommandLineResponse>;
 
+    /**
+     * Adds or updates a mock camera in the shared video capture device list for
+     * test automation. The mock camera is not scoped to a particular page or
+     * frame and is removed when the DevTools session that created it disconnects.
+     */
+    invoke_addMockCamera(params: Protocol.Browser.AddMockCameraRequest): Promise<Protocol.ProtocolResponseWithError>;
+
     /**
      * Get Chrome histograms.
      */

package/front_end/generated/protocol.ts

@@ -2650,6 +2650,15 @@ export namespace Browser {
     arguments: string[];
   }
 
+  export interface AddMockCameraRequest {
+    /**
+     * Required non-empty identifier for the mock camera. This is mapped to an
+     * internal virtual-device identifier and is not the MediaDeviceInfo.deviceId
+     * exposed to the page.
+     */
+    deviceId: string;
+  }
+
   export interface GetHistogramsRequest {
     /**
      * Requested substring in name. Only histograms which have query as a
@@ -14634,6 +14643,7 @@ export namespace Page {
     Gamepad = 'gamepad',
     Geolocation = 'geolocation',
     Gyroscope = 'gyroscope',
+    Haptics = 'haptics',
     Hid = 'hid',
     IdentityCredentialsGet = 'identity-credentials-get',
     IdleDetection = 'idle-detection',
@@ -20006,7 +20016,7 @@ export namespace WebAuthn {
      * every assertion operation will report a value of 0.
      * See https://w3c.github.io/webauthn/#signature-counter
      */
-    signCount: integer;
+    signCount: number;
     /**
      * The large blob associated with the credential.
      * See https://w3c.github.io/webauthn/#sctn-large-blob-extension
@@ -20145,7 +20155,7 @@ export namespace WebAuthn {
      * assertion operation will report a value of 0.
      * See https://w3c.github.io/webauthn/#signature-counter
      */
-    signCount?: integer;
+    signCount?: number;
   }
 
   /**

package/front_end/models/ai_assistance/AiAgent2.ts

@@ -20,6 +20,7 @@ import {type ExecuteJsAgentOptions, executeJsCode} from './agents/ExecuteJavascr
 import {ChangeManager} from './ChangeManager.js';
 import {AccessibilityContext} from './contexts/AccessibilityContext.js';
 import {DOMNodeContext} from './contexts/DOMNodeContext.js';
+import {PerformanceTraceContext} from './contexts/PerformanceTraceContext.js';
 import {debugLog} from './debug.js';
 import {ExtensionScope} from './ExtensionScope.js';
 import type {Skill, SkillName} from './skills/Skill.js';
@@ -48,7 +49,7 @@ Your role is to help web developers debug, analyze, and optimize web application
 # Workflow
 1. **Analyze**: Understand the user's intent, the context provided, and what they are trying to achieve.
 2. **Investigate**: Proactively use your learned skills and tools to gather live data. Do not make assumptions or guess without sufficient evidence.
-3. **Analyze**: Explore multiple potential explanations and solutions. Distinguish between the primary root cause and contributing factors.
+3. **Diagnose**: Explore multiple potential explanations and solutions. Distinguish between the primary root cause and contributing factors.
 4. **Respond**: Provide a structured, clear, and actionable response.
 
 # Response Structure
@@ -58,9 +59,14 @@ If the user asks a question that requires an investigation or debugging, use thi
 * **Suggestion(s)**: List actionable solution suggestion(s) in order of impact.
   - Example: "**Suggestion**: [Suggestion]" or "**Suggestions**:" followed by a bulleted list.
 
+# Follow-up Suggestions
+* Output a list of suggested follow-up queries or actions for the user at the very end of your response.
+* The format MUST be SUGGESTIONS: ["suggestion 1", "suggestion 2"] on its own single line.
+* Ensure suggestions are relevant, concise, and helpful next steps for the user.
+
 # Constraints
 * **CRITICAL**: You are a web development assistant. NEVER provide answers to questions of unrelated topics (such as legal advice, financial advice, personal opinions, medical advice, religion, race, politics, sexuality, gender, or any other non-web-development topics). If asked about these, respond with: "Sorry, I can't answer that. I'm best at questions about web development and debugging."
-* **CRITICAL**: Do not write full Python programs or other scripts to interact with the environment. Only invoke the allowed tools.
+* **CRITICAL**: Do not write standalone scripts (such as Python or bash) or arbitrary code to interact with the environment. The only way to execute code in the inspected page is via the 'executeJavaScript' tool.
 * **CRITICAL**: Do not expose raw, internal system identifiers (such as database IDs, internal node paths, or event keys) directly to the user. Use descriptive names instead.`;
 
 export interface AiAgent2Options extends ExecuteJsAgentOptions {
@@ -70,9 +76,9 @@ export interface AiAgent2Options extends ExecuteJsAgentOptions {
 
 export class AiAgent2 extends AiAgent<unknown> {
   // TODO: The static preamble is a placeholder and will eventually live server-side.
-  readonly preamble = preamble;
-  readonly clientFeature = Host.AidaClient.ClientFeature.CHROME_DEVTOOLS_V2_AGENT;
-  readonly userTier = 'TESTERS';
+  readonly preamble: string = preamble;
+  readonly clientFeature: Host.AidaClient.ClientFeature = Host.AidaClient.ClientFeature.CHROME_DEVTOOLS_V2_AGENT;
+  readonly userTier: string = 'TESTERS';
 
   #changes: ChangeManager;
   #execJs: typeof executeJsCode;
@@ -128,7 +134,7 @@ export class AiAgent2 extends AiAgent<unknown> {
     this.#declaredTools.add('learnSkills');
     this.declareFunction<{skills: SkillName[]}>('learnSkills', {
       description: () => {
-        const unloadedSkills = Object.keys(SKILLS).filter(name => !this.#activeSkills.has(name as SkillName));
+        const unloadedSkills = Object.keys(this.getSkills()).filter(name => !this.#activeSkills.has(name as SkillName));
         return `Loads the specified skills to gain access to their specialized tools. Call this ONLY for skills listed under Available skills that are not yet loaded. Do not call this for skills that are already loaded. Available skills that are not yet loaded: ${
             unloadedSkills.join(', ')}.`;
       },
@@ -273,7 +279,6 @@ User query: ${enhancedQuery}`;
       displayInfoFromArgs: tool.displayInfoFromArgs,
       handler: (args, options) => {
         const context: AllToolsCapabilities = {
-          conversationContext: this.context ?? null,
           changeManager: this.#changes,
           createExtensionScope: this.#createExtensionScope.bind(this),
           execJs: this.#execJs,
@@ -283,6 +288,7 @@ User query: ${enhancedQuery}`;
           getEstablishedOrigin: () => this.#getConversationOrigin(),
           getLighthouseReport: () => (this.context instanceof AccessibilityContext ? this.context.getItem() : null),
           runLighthouse: async overrides => await (this.#lighthouseRecording?.(overrides) ?? null),
+          getPerformanceTraceContext: () => (this.context instanceof PerformanceTraceContext ? this.context : null),
           performanceRecordAndReload: this.#performanceRecordAndReload,
           disableLogging: () => {
             this.disableServerSideLogging();

package/front_end/models/ai_assistance/AiConversation.ts

@@ -31,6 +31,7 @@ import {StorageAgent} from './agents/StorageAgent.js';
 import {StylingAgent} from './agents/StylingAgent.js';
 import {AiAgent2} from './AiAgent2.js';
 import {AiHistoryStorage, ConversationType, type SerializedConversation} from './AiHistoryStorage.js';
+import {isContextSelectionEnabled} from './AiUtils.js';
 import type {ChangeManager} from './ChangeManager.js';
 import {AccessibilityContext} from './contexts/AccessibilityContext.js';
 import {DOMNodeContext} from './contexts/DOMNodeContext.js';
@@ -106,7 +107,7 @@ export class AiConversation {
 
   #aidaClient: Host.AidaClient.AidaClient;
   #changeManager: ChangeManager|undefined;
-  #origin?: string;
+  #origin?: string|SDK.SecurityOrigin.SecurityOrigin;
   #navigationOccurredDuringRun = false;
 
   #contexts: Array<ConversationContext<unknown>> = [];
@@ -180,7 +181,7 @@ export class AiConversation {
     return this.history.length === 0;
   }
 
-  #setOriginIfEmpty(newOrigin: string|undefined): void {
+  #setOriginIfEmpty(newOrigin: string|SDK.SecurityOrigin.SecurityOrigin|undefined): void {
     if (!this.#origin) {
       this.#origin = newOrigin;
     }
@@ -189,7 +190,7 @@ export class AiConversation {
   setContext(updateContext: ConversationContext<unknown>|null): void {
     if (!updateContext) {
       this.#contexts = [];
-      if (isAiAssistanceContextSelectionEnabled()) {
+      if (isContextSelectionEnabled()) {
         this.#updateAgent(ConversationType.NONE);
       }
 
@@ -198,7 +199,7 @@ export class AiConversation {
 
     this.#contexts = [updateContext];
 
-    if (isAiAssistanceContextSelectionEnabled()) {
+    if (isContextSelectionEnabled()) {
       if (updateContext instanceof FileContext) {
         this.#updateAgent(ConversationType.FILE);
       } else if (updateContext instanceof DOMNodeContext) {
@@ -543,7 +544,7 @@ export class AiConversation {
   }
 
   get origin(): string|undefined {
-    return this.#origin;
+    return this.#origin instanceof SDK.SecurityOrigin.SecurityOrigin ? this.#origin.siteId() : this.#origin;
   }
 
   get type(): ConversationType {
@@ -555,11 +556,11 @@ export class AiConversation {
       return {blocked: true};
     }
     if (this.#origin) {
-      return {origin: this.#origin};
+      return {origin: this.origin};
     }
     this.#origin = getPrimaryPageOrigin(this.#targetManager);
 
-    return {origin: this.#origin};
+    return {origin: this.origin};
   };
 }
 
@@ -573,16 +574,6 @@ function isAiAssistanceServerSideLoggingAllowed(): boolean {
   return !Root.Runtime.hostConfig.aidaAvailability?.disallowLogging;
 }
 
-/**
- * Returns true if context changes should dynamically update the conversation's
- * agent/type state. Enabled for both the legacy V1 selection agent and the
- * unified V2 architecture.
- */
-function isAiAssistanceContextSelectionEnabled(): boolean {
-  return Boolean(Root.Runtime.hostConfig.devToolsAiAssistanceContextSelectionAgent?.enabled) ||
-      Boolean(Root.Runtime.hostConfig.devToolsAiV2Architecture?.enabled);
-}
-
 function getPrimaryPageOrigin(
     targetManager: SDK.TargetManager.TargetManager,
     ): Platform.DevToolsPath.UrlString|undefined {