chrome-devtools-frontend 1.0.1611825 → 1.0.1613465

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

@@ -0,0 +1,179 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as i18n from '../../../core/i18n/i18n.js';
+import * as Root from '../../../core/root/root.js';
+import * as Buttons from '../../../ui/components/buttons/buttons.js';
+import * as UI from '../../../ui/legacy/legacy.js';
+import * as Lit from '../../../ui/lit/lit.js';
+import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
+
+import styles from './optInChangeDialog.css.js';
+
+const {html, render} = Lit;
+
+const UIStrings = {
+  /**
+   * @description Title for the opt-in change dialog.
+   */
+  title: 'AI assistance just got better',
+  /**
+   * @description First point in the opt-in change dialog, describing the new integration.
+   */
+  integrationPoint:
+      'AI assistance is now integrated with Application and Lighthouse panels, and pulls context from data sources simultaneously',
+  /**
+   * @description Second point in the opt-in change dialog, describing the new widgets.
+   */
+  widgetPoint: 'Use widgets to verify results or jump to source data for select debugging cases',
+  /**
+   * @description Third point in the opt-in change dialog (disclaimer) for regular users.
+   */
+  privacyDisclaimer:
+      'Chat messages, data accessible for this site via DevTools panels and Web APIs, and items you select such as network requests, files, and performance traces are sent to Google and may be seen by human reviewers to improve this feature. This is an experimental AI feature and won’t always get it right.',
+  /**
+   * @description Third point in the opt-in change dialog (disclaimer) for enterprise users with logging disabled.
+   */
+  privacyDisclaimerEnterpriseNoLogging:
+      'Chat messages, data accessible for this site via DevTools panels and Web APIs, and items you select such as network requests, files, and performance traces are sent to Google. The content submitted to and generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
+  /**
+   * @description Button text for managing settings.
+   */
+  manageSettings: 'Manage in settings',
+  /**
+   * @description Button text for acknowledging the changes.
+   */
+  gotIt: 'Got it',
+} as const;
+
+const str_ = i18n.i18n.registerUIStrings('panels/ai_assistance/components/OptInChangeDialog.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
+interface ViewInput {
+  onGotIt: () => void;
+  onManageSettings: () => void;
+  loggingEnabled: boolean;
+}
+
+type View = (input: ViewInput, output: undefined, target: HTMLElement) => void;
+
+export const DEFAULT_VIEW: View = (input, _output, target): void => {
+  const disclaimer = input.loggingEnabled ? i18nString(UIStrings.privacyDisclaimer) :
+                                            i18nString(UIStrings.privacyDisclaimerEnterpriseNoLogging);
+  // clang-format off
+  render(html`
+    <style>${styles}</style>
+    <div class="opt-in-change-dialog" jslog=${VisualLogging.dialog('ai-v2-opt-in-change-dialog')}>
+      <header>
+        <div class="header-icon-container">
+          <devtools-icon name="smart-assistant" role="presentation"></devtools-icon>
+        </div>
+        <h1 tabindex="-1">
+          ${i18nString(UIStrings.title)}
+        </h1>
+      </header>
+      <main>
+        <div class="item">
+          <devtools-icon name="lightbulb-spark" role="presentation"></devtools-icon>
+          <div class="text">${i18nString(UIStrings.integrationPoint)}</div>
+        </div>
+        <div class="item">
+          <devtools-icon name="flowsheet" role="presentation"></devtools-icon>
+          <div class="text">${i18nString(UIStrings.widgetPoint)}</div>
+        </div>
+        <div class="item">
+          <devtools-icon name="google" role="presentation"></devtools-icon>
+          <div class="text">${disclaimer}</div>
+        </div>
+      </main>
+      <footer>
+        <div class="right-buttons">
+          <devtools-button
+            @click=${input.onManageSettings}
+            .jslogContext=${'ai-assistance-v2-opt-in.manage-settings'}
+            .variant=${Buttons.Button.Variant.OUTLINED}
+            .accessibleLabel=${i18nString(UIStrings.manageSettings)}
+          >
+            ${i18nString(UIStrings.manageSettings)}
+          </devtools-button>
+          <devtools-button
+            @click=${input.onGotIt}
+            .jslogContext=${'ai-assistance-v2-opt-in.got-it'}
+            .variant=${Buttons.Button.Variant.PRIMARY}
+            .accessibleLabel=${i18nString(UIStrings.gotIt)}
+          >
+            ${i18nString(UIStrings.gotIt)}
+          </devtools-button>
+        </div>
+      </footer>
+    </div>
+  `, target);
+  // clang-format on
+};
+
+export class OptInChangeDialog extends UI.Widget.VBox {
+  readonly #view: View;
+  readonly #onGotIt: () => void;
+  readonly #onManageSettings: () => void;
+
+  constructor(
+      options: {
+        onGotIt: () => void,
+        onManageSettings: () => void,
+      },
+      view: View = DEFAULT_VIEW) {
+    super();
+    this.#onGotIt = options.onGotIt;
+    this.#onManageSettings = options.onManageSettings;
+    this.#view = view;
+
+    this.requestUpdate();
+  }
+
+  override performUpdate(): void {
+    const loggingEnabled = Root.Runtime.hostConfig.aidaAvailability?.enterprisePolicyValue !==
+        Root.Runtime.GenAiEnterprisePolicyValue.ALLOW_WITHOUT_LOGGING;
+
+    const viewInput = {
+      onGotIt: this.#onGotIt,
+      onManageSettings: this.#onManageSettings,
+      loggingEnabled,
+    };
+
+    this.#view(viewInput, undefined, this.contentElement);
+  }
+
+  focusTitle(): void {
+    this.contentElement.querySelector('h1')?.focus();
+  }
+
+  static show(options: {
+    onGotIt: () => void,
+    onManageSettings: () => void,
+  }): void {
+    const dialog = new UI.Dialog.Dialog();
+    dialog.setAriaLabel(i18nString(UIStrings.title));
+    dialog.setOutsideClickCallback(event => event.consume(true));
+    dialog.setCloseOnEscape(false);
+    dialog.setSizeBehavior(UI.GlassPane.SizeBehavior.MEASURE_CONTENT);
+    dialog.setDimmed(true);
+
+    const optInChangeDialog = new OptInChangeDialog({
+      onGotIt: () => {
+        dialog.hide();
+        options.onGotIt();
+      },
+      onManageSettings: () => {
+        dialog.hide();
+        options.onManageSettings();
+      },
+    });
+    optInChangeDialog.show(dialog.contentElement);
+
+    void optInChangeDialog.updateComplete.then(() => {
+      dialog.show();
+      optInChangeDialog.focusTitle();
+    });
+  }
+}

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

@@ -0,0 +1,95 @@
+/*
+ * Copyright 2026 The Chromium Authors
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file.
+ */
+
+@scope to (devtools-widget > *) {
+  :scope {
+    width: 100%;
+    box-shadow: none;
+    padding: var(--sys-size-8);
+    background-color: var(--sys-color-surface);
+    border-radius: var(--sys-shape-corner-medium);
+  }
+
+  .opt-in-change-dialog {
+    width: var(--sys-size-33);
+    max-width: 100%;
+  }
+
+  header {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: var(--sys-size-8);
+    margin-bottom: var(--sys-size-8);
+
+    h2 {
+      margin: 0;
+      color: var(--sys-color-on-surface);
+      font: var(--sys-typescale-headline5);
+    }
+
+    .header-icon-container {
+      background: linear-gradient(
+        135deg,
+        var(--sys-color-gradient-primary),
+        var(--sys-color-gradient-tertiary)
+      );
+      border-radius: var(--sys-size-4);
+      height: var(--sys-size-14);
+      width: var(--sys-size-14);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      devtools-icon {
+        width: var(--sys-size-9);
+        height: var(--sys-size-9);
+        color: var(--sys-color-on-primary);
+      }
+    }
+  }
+
+  main {
+    background-color: var(--sys-color-surface4);
+    border-radius: var(--sys-shape-corner-medium-small);
+    padding: var(--sys-size-8);
+    display: flex;
+    flex-direction: column;
+    gap: var(--sys-size-6);
+    margin-bottom: var(--sys-size-8);
+
+    .item {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      gap: var(--sys-size-8);
+
+      devtools-icon {
+        width: var(--sys-size-8);
+        height: var(--sys-size-8);
+        flex-shrink: 0;
+        color: var(--sys-color-on-surface-subtle);
+      }
+
+      .text {
+        font: var(--sys-typescale-body4);
+        color: var(--sys-color-on-surface);
+      }
+    }
+  }
+
+  footer {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: flex-end;
+
+    .right-buttons {
+      display: flex;
+      gap: var(--sys-size-5);
+    }
+  }
+}

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

@@ -99,7 +99,7 @@
 
   .inline-wrapper {
     display: flex;
-    align-items: center;
+    align-items: flex-start;
     gap: var(--sys-size-2);
     justify-content: flex-start;
 

package/front_end/panels/application/CookieItemsView.ts

@@ -375,9 +375,10 @@ export class CookieItemsView extends UI.Widget.VBox {
   }
 
   deleteSelectedItem(): void {
-    if (this.selectedCookie) {
+    const cookie = this.selectedCookie;
+    if (cookie) {
       this.showPreview(null);
-      void this.model.deleteCookie(this.selectedCookie);
+      void this.model.deleteCookie(cookie);
     }
   }
 

package/front_end/panels/changes/ChangesView.ts

@@ -6,13 +6,11 @@ import '../../ui/legacy/legacy.js';
 
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as Platform from '../../core/platform/platform.js';
-import * as GreenDev from '../../models/greendev/greendev.js';
 import type * as Workspace from '../../models/workspace/workspace.js';
 import * as WorkspaceDiff from '../../models/workspace_diff/workspace_diff.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Lit from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
-import * as PanelsCommon from '../common/common.js';
 
 import {ChangesSidebar, Events} from './ChangesSidebar.js';
 import changesViewStyles from './changesView.css.js';
@@ -48,8 +46,6 @@ export const DEFAULT_VIEW: View = (input, _output, target) => {
         Events.SELECTED_UI_SOURCE_CODE_CHANGED, () => input.onSelect(sidebar.selectedUISourceCode()));
   };
 
-  const hasCopyToPrompt = GreenDev.Prototypes.instance().isEnabled('copyToGemini');
-
   render(
       // clang-format off
       html`
@@ -70,14 +66,6 @@ export const DEFAULT_VIEW: View = (input, _output, target) => {
                 workspaceDiff: input.workspaceDiff
             })}
           </div>
-          ${hasCopyToPrompt ? html`
-            <devtools-widget class="copy-to-prompt"
-              ${widget(PanelsCommon.CopyChangesToPrompt, {
-                workspaceDiff: input.workspaceDiff,
-                patchAgentCSSChange: null,
-              })}
-            ></devtools-widget>
-          ` : Lit.nothing}
         </div>
         <devtools-widget slot="sidebar" ${widget(ChangesSidebar, {workspaceDiff: input.workspaceDiff})}
           ${UI.Widget.widgetRef(ChangesSidebar, onSidebar)}>

package/front_end/panels/common/common.ts

@@ -111,4 +111,3 @@ export * as PersistenceUtils from './PersistenceUtils.js';
 export * as DOMLinkifier from './DOMLinkifier.js';
 export * as ThrottlingUtils from './ThrottlingUtils.js';
 export * as ExtensionIframe from './ExtensionView.js';
-export {CopyChangesToPrompt} from './CopyChangesToPrompt.js';

package/front_end/panels/console/ConsolePrompt.ts

@@ -29,11 +29,11 @@ const UIStrings = {
    */
   consolePrompt: 'Console prompt',
   /**
-   * @description Warning shown to users when pasting text into the DevTools console.
+   * @description Warning shown to users when pasting text into the DevTools console. IMPORTANT: keep double quotes around PH1 and do not use single quotes.
    * @example {allow pasting} PH1
    */
   selfXssWarning:
-      'Warning: Don’t paste code into the DevTools Console that you don’t understand or haven’t reviewed yourself. This could allow attackers to steal your identity or take control of your computer. Please type ‘{PH1}’ below and press Enter to allow pasting.',
+      'Warning: Don’t paste code into the DevTools Console that you don’t understand or haven’t reviewed yourself. This could allow attackers to steal your identity or take control of your computer. Please type “{PH1}” below and press Enter to allow pasting.',
   /**
    * @description Text a user needs to type in order to confirm that they are aware of the danger of pasting code into the DevTools console.
    */

package/front_end/panels/elements/StylePropertyTreeElement.ts

@@ -2782,7 +2782,8 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
       existingElement?.remove();
     }
 
-    if (!this.overriddenByAnimation() || UI.ViewManager.ViewManager.instance().isViewVisible('animations')) {
+    if (!this.overriddenByAnimation() || UI.ViewManager.ViewManager.instance().isViewVisible('animations') ||
+        !Common.Settings.Settings.instance().moduleSetting('css-animations-only-when-animations-tab-open').get()) {
       return;
     }
 

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -1096,10 +1096,12 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     // the matched styles we reenable the button.
     LayersWidget.ButtonProvider.instance().item().setVisible(false);
     const animationsPanelVisible = UI.ViewManager.ViewManager.instance().isViewVisible('animations');
+    const cssAnimationsOnlyWhenAnimationsTabOpen =
+        Common.Settings.Settings.instance().moduleSetting('css-animations-only-when-animations-tab-open').get();
     for (const style of matchedStyles.nodeStyles()) {
       const isTransitionOrAnimationStyle = style.type === SDK.CSSStyleDeclaration.Type.Transition ||
           style.type === SDK.CSSStyleDeclaration.Type.Animation;
-      if (isTransitionOrAnimationStyle && !animationsPanelVisible) {
+      if (isTransitionOrAnimationStyle && cssAnimationsOnlyWhenAnimationsTabOpen && !animationsPanelVisible) {
         continue;
       }
 

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

@@ -163,6 +163,10 @@ const UIStrings = {
    * @description Command for toggling the eye dropper when the color picker is open
    */
   toggleEyeDropper: 'Toggle eye dropper',
+  /**
+   * @description Title of a setting under the Elements category.
+   */
+  cssAnimationsOnlyWhenAnimationsTabOpen: 'Show animation styles only when the Animations tab is open',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/elements/elements-meta.ts', UIStrings);
 const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
@@ -569,6 +573,16 @@ Common.Settings.registerSettingExtension({
   defaultValue: true,
 });
 
+Common.Settings.registerSettingExtension({
+  category: Common.Settings.SettingCategory.ELEMENTS,
+  storageType: Common.Settings.SettingStorageType.SYNCED,
+  order: 6,
+  title: i18nLazyString(UIStrings.cssAnimationsOnlyWhenAnimationsTabOpen),
+  settingName: 'css-animations-only-when-animations-tab-open',
+  settingType: Common.Settings.SettingType.BOOLEAN,
+  defaultValue: true,
+});
+
 Common.Settings.registerSettingExtension({
   settingName: 'show-event-listeners-for-ancestors',
   settingType: Common.Settings.SettingType.BOOLEAN,

package/front_end/panels/network/NetworkLogView.ts

@@ -1880,10 +1880,30 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
       const throttlingMenu =
           contextMenu.debugSection().appendSubMenuItem(i18nString(UIStrings.throttleRequests), /* disabled=*/ true);
 
-      const urlWithoutScheme = request.parsedURL.urlWithoutScheme();
-      const urlPattern = urlWithoutScheme &&
+      const parsed = request.parsedURL;
+      let urlPatternString = '';
+      if (parsed.isValid) {
+        // We cannot escape parsed.urlWithoutScheme() directly. If we escaped the first '?'
+        // URLPattern would treat the entire string as the pathname and fail to match the query string.
+        // Thus, we must escape the components individually and reconstruct the pattern string.
+        urlPatternString = '*://' + Platform.StringUtilities.escapeForURLPattern(parsed.host);
+        if (parsed.port) {
+          urlPatternString += ':' + Platform.StringUtilities.escapeForURLPattern(parsed.port);
+        }
+        urlPatternString += Platform.StringUtilities.escapeForURLPattern(parsed.path);
+        if (parsed.queryParams) {
+          urlPatternString += '?' + Platform.StringUtilities.escapeForURLPattern(parsed.queryParams);
+        }
+        if (parsed.fragment) {
+          urlPatternString += '#' + Platform.StringUtilities.escapeForURLPattern(parsed.fragment);
+        }
+      } else if (parsed.urlWithoutScheme()) {
+        urlPatternString = '*://' + Platform.StringUtilities.escapeForURLPattern(parsed.urlWithoutScheme());
+      }
+
+      const urlPattern = urlPatternString &&
           SDK.NetworkManager.RequestURLPattern.create(
-              `*://${urlWithoutScheme}` as SDK.NetworkManager.URLPatternConstructorString);
+              urlPatternString as SDK.NetworkManager.URLPatternConstructorString);
       if (urlPattern) {
         throttlingMenu.setEnabled(true);
         blockingMenu.setEnabled(true);
@@ -1906,30 +1926,39 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
             {jslogContext: 'throttle-request-url'});
       }
 
-        const domain = request.parsedURL.domain();
-        const domainPattern = domain &&
-            SDK.NetworkManager.RequestURLPattern.create(
-                `*://${domain}` as SDK.NetworkManager.URLPatternConstructorString);
-        if (domainPattern) {
-          throttlingMenu.setEnabled(true);
-          blockingMenu.setEnabled(true);
-          const existingConditions = manager.requestConditions.findCondition(domainPattern.constructorString);
-          const isBlocking = existingConditions?.conditions === SDK.NetworkManager.BlockingConditions;
-          const isThrottling = existingConditions &&
-              existingConditions.conditions !== SDK.NetworkManager.BlockingConditions &&
-              existingConditions.conditions !== SDK.NetworkManager.NoThrottlingConditions;
-          const croppedURL = Platform.StringUtilities.trimMiddle(domainPattern.constructorString, maxBlockedURLLength);
-          blockingMenu.debugSection().appendItem(
-              isBlocking ? i18nString(UIStrings.unblockS, {PH1: croppedURL}) : i18nString(UIStrings.blockRequestDomain),
-              () => isBlocking ? removeRequestCondition(domainPattern) :
-                                 addRequestCondition(domainPattern, SDK.NetworkManager.BlockingConditions),
-              {jslogContext: 'block-request-domain'});
-          throttlingMenu.debugSection().appendItem(
-              isThrottling ? i18nString(UIStrings.unthrottleS, {PH1: croppedURL}) :
-                             i18nString(UIStrings.throttleRequestDomain),
-              () => isThrottling ? removeRequestCondition(domainPattern) :
-                                   addRequestCondition(domainPattern, SDK.NetworkManager.Slow3GConditions),
-              {jslogContext: 'throttle-request-domain'});
+      let domainPatternString = '';
+      if (parsed.isValid) {
+        domainPatternString = '*://' + Platform.StringUtilities.escapeForURLPattern(parsed.host);
+        if (parsed.port) {
+          domainPatternString += ':' + Platform.StringUtilities.escapeForURLPattern(parsed.port);
+        }
+      } else if (parsed.domain()) {
+        domainPatternString = '*://' + Platform.StringUtilities.escapeForURLPattern(parsed.domain());
+      }
+
+      const domainPattern = domainPatternString &&
+          SDK.NetworkManager.RequestURLPattern.create(
+              domainPatternString as SDK.NetworkManager.URLPatternConstructorString);
+      if (domainPattern) {
+        throttlingMenu.setEnabled(true);
+        blockingMenu.setEnabled(true);
+        const existingConditions = manager.requestConditions.findCondition(domainPattern.constructorString);
+        const isBlocking = existingConditions?.conditions === SDK.NetworkManager.BlockingConditions;
+        const isThrottling = existingConditions &&
+            existingConditions.conditions !== SDK.NetworkManager.BlockingConditions &&
+            existingConditions.conditions !== SDK.NetworkManager.NoThrottlingConditions;
+        const croppedURL = Platform.StringUtilities.trimMiddle(domainPattern.constructorString, maxBlockedURLLength);
+        blockingMenu.debugSection().appendItem(
+            isBlocking ? i18nString(UIStrings.unblockS, {PH1: croppedURL}) : i18nString(UIStrings.blockRequestDomain),
+            () => isBlocking ? removeRequestCondition(domainPattern) :
+                               addRequestCondition(domainPattern, SDK.NetworkManager.BlockingConditions),
+            {jslogContext: 'block-request-domain'});
+        throttlingMenu.debugSection().appendItem(
+            isThrottling ? i18nString(UIStrings.unthrottleS, {PH1: croppedURL}) :
+                           i18nString(UIStrings.throttleRequestDomain),
+            () => isThrottling ? removeRequestCondition(domainPattern) :
+                                 addRequestCondition(domainPattern, SDK.NetworkManager.Slow3GConditions),
+            {jslogContext: 'throttle-request-domain'});
       }
 
       if (SDK.NetworkManager.NetworkManager.canReplayRequest(request)) {
@@ -1944,7 +1973,8 @@ export class NetworkLogView extends Common.ObjectWrapper.eventMixin<EventTypes,
     const requests = Logs.NetworkLog.NetworkLog.instance().requests().filter(request => this.applyFilter(request));
     return requests.filter(NetworkLogView.getHTTPRequestsFilter).filter(request => {
       return request.finished ||
-          (request.resourceType() === Common.ResourceType.resourceTypes.WebSocket && request.responseReceivedTime);
+          (request.resourceType() === Common.ResourceType.resourceTypes.WebSocket && request.responseReceivedTime) ||
+          Boolean(request.eventSourceMessages()?.length);
     });
   }
 

package/front_end/panels/recorder/RecorderController.ts

@@ -133,21 +133,21 @@ const UIStrings = {
    */
   doYouTrustThisCode: 'Do you trust this recording?',
   /**
-   * @description Warning shown to users when imports code into DevTools Recorder.
+   * @description Warning shown to users when imports code into DevTools Recorder. IMPORTANT: keep double quotes around PH1 and do not use single quotes.
    * @example {allow importing} PH1
    */
   doNotImport:
-      'Don\'t import recordings you do not understand or have not reviewed yourself into DevTools. This could allow attackers to steal your identity or take control of your computer. Please type \'\'{PH1}\'\' below to allow importing.',
+      'Don\'t import recordings you do not understand or have not reviewed yourself into DevTools. This could allow attackers to steal your identity or take control of your computer. Please type “{PH1}” below to allow importing.',
   /**
    * @description Text a user needs to type in order to confirm that they
    *are aware of the danger of import code into the DevTools Recorder.
    */
   allowImporting: 'allow importing',
   /**
-   * @description Input box placeholder which instructs the user to type 'allow importing' into the input box.
+   * @description Input box placeholder which instructs the user to type 'allow importing' into the input box. IMPORTANT: keep double quotes around PH1 and do not use single quotes.
    * @example {allow importing} PH1
    */
-  typeAllowImporting: 'Type \'\'{PH1}\'\'',
+  typeAllowImporting: 'Type “{PH1}”',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/recorder/RecorderController.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);

package/front_end/panels/settings/AISettingsTab.ts

@@ -120,6 +120,29 @@ const UIStrings = {
    */
   helpUnderstandStylingNetworkPerformanceAndFile:
       'Get help with understanding CSS styles, network requests, performance, and files',
+  /**
+   * @description Text describing the 'AI assistance' feature when V2 is enabled
+   */
+  aiAssistanceDescriptionV2: 'Get context-aware help on the inspected page',
+  /**
+   * @description First item in the description of the AI assistance feature when V2 is enabled
+   */
+  aiAssistanceWhenOnItem1V2:
+      'Debug styling, network, performance, source code, accessibility and storage issues with DevTools AI assistance',
+  /**
+   * @description Second item in the description of the AI assistance feature when V2 is enabled
+   */
+  aiAssistanceWhenOnItem2V2: 'Follow the agent\'s reasoning step-by-step and quickly jump to the relevant source data',
+  /**
+   * @description Explainer for which data is being sent by the AI assistance feature when V2 is enabled
+   */
+  aiAssistanceThingsToConsiderV2:
+      'To generate explanations, chat messages, data accessible for this site via DevTools panels and Web APIs, and items you select such as network requests, files, and performance traces are sent to Google and may be seen by human reviewers to improve this feature. This is an experimental AI feature and won’t always get it right.',
+  /**
+   * @description Explainer for which data is being sent by the AI assistance feature when V2 is enabled and logging is disabled
+   */
+  aiAssistanceThingsToConsiderNoLoggingV2:
+      'To generate explanations, chat messages, data accessible for this site via DevTools panels and Web APIs, and items you select such as network requests, files, and performance traces are sent to Google. The content you submit and that is generated by this feature will not be used to improve Google’s AI models. This is an experimental AI feature and won’t always get it right.',
   /**
    * @description Text describing the 'Code suggestions' feature
    */
@@ -480,6 +503,7 @@ export class AISettingsTab extends UI.Widget.VBox {
     }
 
     if (this.#aiAssistanceSetting) {
+      const isV2 = Root.Runtime.hostConfig.devToolsAiAssistanceV2?.enabled;
       const aiAssistanceData: AiSettingParams = {
         settingName: i18n.i18n.lockedString(
             AiAssistanceModel.AiUtils.isGeminiBranding() ? 'Gemini in Chrome DevTools' : 'AI assistance'),
@@ -488,12 +512,18 @@ export class AISettingsTab extends UI.Widget.VBox {
         enableSettingText: i18nString(UIStrings.enableAiAssistance),
         settingItems: [
           {iconName: 'info', text: this.#getAiAssistanceSettingInfo()},
-          {iconName: 'pen-spark', text: i18nString(UIStrings.receiveStylingSuggestions)}
+          {
+            iconName: 'pen-spark',
+            text: isV2 ? i18nString(UIStrings.aiAssistanceWhenOnItem2V2) :
+                         i18nString(UIStrings.receiveStylingSuggestions),
+          },
         ],
         toConsiderSettingItems: [{
           iconName: 'google',
-          text: noLogging ? i18nString(UIStrings.freestylerSendsDataNoLogging) :
-                            i18nString(UIStrings.freestylerSendsData)
+          text: isV2 ? (noLogging ? i18nString(UIStrings.aiAssistanceThingsToConsiderNoLoggingV2) :
+                                    i18nString(UIStrings.aiAssistanceThingsToConsiderV2)) :
+                       (noLogging ? i18nString(UIStrings.freestylerSendsDataNoLogging) :
+                                    i18nString(UIStrings.freestylerSendsData)),
         }],
         learnMoreLink: {
           url: 'https://developer.chrome.com/docs/devtools/ai-assistance',
@@ -581,6 +611,9 @@ export class AISettingsTab extends UI.Widget.VBox {
 
   #getAiAssistanceSettingDescription(): Platform.UIString.LocalizedString {
     const {hostConfig} = Root.Runtime;
+    if (hostConfig.devToolsAiAssistanceV2?.enabled) {
+      return i18nString(UIStrings.aiAssistanceDescriptionV2);
+    }
     if (hostConfig.devToolsAiAssistancePerformanceAgent?.enabled) {
       return i18nString(UIStrings.helpUnderstandStylingNetworkPerformanceAndFile);
     }
@@ -595,6 +628,9 @@ export class AISettingsTab extends UI.Widget.VBox {
 
   #getAiAssistanceSettingInfo(): Platform.UIString.LocalizedString {
     const {hostConfig} = Root.Runtime;
+    if (hostConfig.devToolsAiAssistanceV2?.enabled) {
+      return i18nString(UIStrings.aiAssistanceWhenOnItem1V2);
+    }
     if (hostConfig.devToolsAiAssistancePerformanceAgent?.enabled) {
       return i18nString(UIStrings.explainStylingNetworkPerformanceAndFile);
     }

package/front_end/panels/settings/SettingsScreen.ts

@@ -636,7 +636,7 @@ const GREENDEV_VIEW: View = (input, _output, target) => {
               <span>${i18nString(UIStrings.greenDevUnstable)}</span>
              </div>
              <div class="settings-experiments-block">
-               ${renderPrototypeCheckboxes(input.settings, ['aiAnnotations', 'copyToGemini', 'breakpointDebuggerAgent', 'emulationCapabilities'])}
+               ${renderPrototypeCheckboxes(input.settings, ['aiAnnotations', 'beyondStyling', 'breakpointDebuggerAgent', 'emulationCapabilities'])}
              </div>
            </devtools-card>
          </div>
@@ -646,7 +646,7 @@ const GREENDEV_VIEW: View = (input, _output, target) => {
 
 const GREENDEV_PROTOTYPE_NAMES: Record<keyof GreenDev.GreenDevSettings, string> = {
   aiAnnotations: 'AI auto-annotations',
-  copyToGemini: 'Copy changes to AI Prompt',
+  beyondStyling: 'Beyond Styling',
   breakpointDebuggerAgent: 'Breakpoint Debugger Agent',
   emulationCapabilities: 'Emulation Capabilities',
 };

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: ba9b7fcecd6da792b29305cac5a406adc76fc1e5
+Revision: a287ca9049cc3727d680078c1d9275b32f721c2d
 Update Mechanism: Manual (https://crbug.com/428069060)
 License: BSD-3-Clause
 License File: LICENSE