chrome-devtools-frontend 1.0.1535712 → 1.0.1536371

package/front_end/panels/security/CookieReportView.ts

@@ -12,6 +12,7 @@ import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import type * as TextUtils from '../../models/text_utils/text_utils.js';
+import * as uiI18n from '../../ui/i18n/i18n.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';
@@ -448,7 +449,7 @@ export class CookieReportView extends UI.Widget.VBox {
                 'https://github.com/privacysandbox/privacy-sandbox-dev-support/blob/main/3pc-migration-readiness.md',
             i18nString(UIStrings.guidance), undefined, undefined, 'readiness-list-link');
 
-        return html`${i18n.i18n.getFormatLocalizedString(str_, UIStrings.gitHubResource, {
+        return html`${uiI18n.getFormatLocalizedString(str_, UIStrings.gitHubResource, {
           PH1: githubLink,
         })}`;
       }
@@ -461,7 +462,7 @@ export class CookieReportView extends UI.Widget.VBox {
                 (domain.charAt(0) === '.' ? domain.substring(1) : domain),
             i18nString(UIStrings.reportedIssues), undefined, undefined, 'compatibility-lookup-link');
 
-        return html`${i18n.i18n.getFormatLocalizedString(str_, UIStrings.gracePeriod, {
+        return html`${uiI18n.getFormatLocalizedString(str_, UIStrings.gracePeriod, {
           PH1: gracePeriodLink,
         })}`;
       }

package/front_end/panels/settings/AISettingsTab.ts

@@ -13,6 +13,7 @@ import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as Input from '../../ui/components/input/input.js';
 import * as LegacyWrapper from '../../ui/components/legacy_wrapper/legacy_wrapper.js';
 import * as Switch from '../../ui/components/switch/switch.js';
+import * as uiI18n from '../../ui/i18n/i18n.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';
@@ -515,7 +516,7 @@ export class AISettingsTab extends LegacyWrapper.LegacyWrapper.WrappableComponen
       },
       {
         icon: 'policy',
-        text: html`${i18n.i18n.getFormatLocalizedString(str_, UIStrings.termsOfServicePrivacyNotice, {
+        text: html`${uiI18n.getFormatLocalizedString(str_, UIStrings.termsOfServicePrivacyNotice, {
           PH1: tosLink,
           PH2: privacyNoticeLink,
         })}`,

package/front_end/panels/settings/KeybindsSettingsTab.ts

@@ -42,6 +42,11 @@ const UIStrings = {
    * @description Link text in the settings pane to add another shortcut for an action
    */
   addAShortcut: 'Add a shortcut',
+  /**
+   * @description Placeholder text in the settings pane when adding a new shortcut.
+   * Explaining that key strokes are going to be recoded.
+   */
+  recordingKeys: 'Recoding keys',
   /**
    * @description Label for a button in the settings pane that confirms changes to a keyboard shortcut
    */
@@ -446,6 +451,7 @@ export class ShortcutListItem {
     if (this.isEditing) {
       const shortcutInput = shortcutElement.createChild('input', 'harmony-input');
       shortcutInput.setAttribute('jslog', `${VisualLogging.textField().track({change: true})}`);
+      shortcutInput.setAttribute('placeholder', i18nString(UIStrings.recordingKeys));
       shortcutInput.spellcheck = false;
       shortcutInput.maxLength = 0;
       this.shortcutInputs.set(shortcut, shortcutInput);

package/front_end/panels/settings/components/SyncSection.ts

@@ -16,6 +16,7 @@ import * as Badges from '../../../models/badges/badges.js';
 import * as Buttons from '../../../ui/components/buttons/buttons.js';
 import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
 import type * as SettingsComponents from '../../../ui/components/settings/settings.js';
+import * as uiI18n from '../../../ui/i18n/i18n.js';
 import * as Lit from '../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
 import * as PanelCommon from '../../common/common.js';
@@ -112,7 +113,7 @@ function renderDataDisclaimer(): HTMLElement {
 
   const container = document.createElement('span');
   Lit.render(relevantDataTooltipTemplate, container);
-  cachedTooltipElement = i18n.i18n.getFormatLocalizedString(str_, UIStrings.dataDisclaimer, {
+  cachedTooltipElement = uiI18n.getFormatLocalizedString(str_, UIStrings.dataDisclaimer, {
     PH1: container,
   });
   return cachedTooltipElement;

package/front_end/panels/sources/DebuggerPausedMessage.ts

@@ -11,6 +11,7 @@ import * as Protocol from '../../generated/protocol.js';
 import type * as Bindings from '../../models/bindings/bindings.js';
 import type * as BreakpointManager from '../../models/breakpoints/breakpoints.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
+import * as uiI18n from '../../ui/i18n/i18n.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 
@@ -175,12 +176,12 @@ export class DebuggerPausedMessage {
       let messageElement;
       if (data.insertion) {
         if (data.targetNode === data.node) {
-          messageElement = i18n.i18n.getFormatLocalizedString(str_, UIStrings.childSAdded, {PH1: targetNodeLink});
+          messageElement = uiI18n.getFormatLocalizedString(str_, UIStrings.childSAdded, {PH1: targetNodeLink});
         } else {
-          messageElement = i18n.i18n.getFormatLocalizedString(str_, UIStrings.descendantSAdded, {PH1: targetNodeLink});
+          messageElement = uiI18n.getFormatLocalizedString(str_, UIStrings.descendantSAdded, {PH1: targetNodeLink});
         }
       } else {
-        messageElement = i18n.i18n.getFormatLocalizedString(str_, UIStrings.descendantSRemoved, {PH1: targetNodeLink});
+        messageElement = uiI18n.getFormatLocalizedString(str_, UIStrings.descendantSRemoved, {PH1: targetNodeLink});
       }
       subElement.appendChild(document.createElement('br'));
       subElement.appendChild(messageElement);

package/front_end/panels/sources/ResourceOriginPlugin.ts

@@ -6,6 +6,7 @@
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Bindings from '../../models/bindings/bindings.js';
 import type * as Workspace from '../../models/workspace/workspace.js';
+import * as uiI18n from '../../ui/i18n/i18n.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
@@ -62,14 +63,14 @@ export class ResourceOriginPlugin extends Plugin {
         }
         element.append(link);
       });
-      return [new UI.Toolbar.ToolbarItem(i18n.i18n.getFormatLocalizedString(str_, UIStrings.fromS, {PH1: element}))];
+      return [new UI.Toolbar.ToolbarItem(uiI18n.getFormatLocalizedString(str_, UIStrings.fromS, {PH1: element}))];
     }
 
     // Handle anonymous scripts with an originStackTrace.
     for (const script of debuggerWorkspaceBinding.scriptsForUISourceCode(this.uiSourceCode)) {
       if (script.originStackTrace?.callFrames.length) {
         const link = linkifier.linkifyStackTraceTopFrame(script.debuggerModel.target(), script.originStackTrace);
-        return [new UI.Toolbar.ToolbarItem(i18n.i18n.getFormatLocalizedString(str_, UIStrings.fromS, {PH1: link}))];
+        return [new UI.Toolbar.ToolbarItem(uiI18n.getFormatLocalizedString(str_, UIStrings.fromS, {PH1: link}))];
       }
     }
 

package/front_end/panels/sources/SourcesNavigator.ts

@@ -15,6 +15,7 @@ import * as Bindings from '../../models/bindings/bindings.js';
 import * as Persistence from '../../models/persistence/persistence.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Workspace from '../../models/workspace/workspace.js';
+import * as uiI18n from '../../ui/i18n/i18n.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Snippets from '../snippets/snippets.js';
 
@@ -190,7 +191,7 @@ export class FilesNavigatorView extends NavigatorView {
     const link =
         UI.XLink.XLink.create('https://goo.gle/devtools-automatic-workspace-folders', 'com.chrome.devtools.json');
     this.#automaticFileSystemNudge =
-        i18n.i18n.getFormatLocalizedString(str_, UIStrings.automaticWorkspaceNudge, {PH1: link});
+        uiI18n.getFormatLocalizedString(str_, UIStrings.automaticWorkspaceNudge, {PH1: link});
     this.#automaticFileSystemNudge.classList.add('automatic-file-system-nudge');
     this.contentElement.insertBefore(this.#automaticFileSystemNudge, this.contentElement.firstChild);
 

package/front_end/panels/sources/TabbedEditorContainer.ts

@@ -12,6 +12,7 @@ import * as Workspace from '../../models/workspace/workspace.js';
 import type * as CodeMirror from '../../third_party/codemirror.next/codemirror.next.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
 import * as Tooltips from '../../ui/components/tooltips/tooltips.js';
+import * as uiI18n from '../../ui/i18n/i18n.js';
 import * as SourceFrame from '../../ui/legacy/components/source_frame/source_frame.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
@@ -633,11 +634,11 @@ export class TabbedEditorContainer extends Common.ObjectWrapper.ObjectWrapper<Ev
             await UI.ViewManager.ViewManager.instance().showView('navigator-files');
             await automaticFileSystemManager.connectAutomaticFileSystem(/* addIfMissing= */ true);
           });
-          tooltip.append(i18n.i18n.getFormatLocalizedString(
+          tooltip.append(uiI18n.getFormatLocalizedString(
               str_, UIStrings.changesWereNotSavedToFileSystemToSaveAddFolderToWorkspace, {PH1: link}));
         } else {
           const link = UI.XLink.XLink.create('https://developer.chrome.com/docs/devtools/workspaces/', 'Workspace');
-          tooltip.append(i18n.i18n.getFormatLocalizedString(
+          tooltip.append(uiI18n.getFormatLocalizedString(
               str_, UIStrings.changesWereNotSavedToFileSystemToSaveSetUpYourWorkspace, {PH1: link}));
         }
         suffixElement.append(icon, tooltip);

package/front_end/panels/sources/WatchExpressionsSidebarPane.ts

@@ -94,7 +94,7 @@ const str_ = i18n.i18n.registerUIStrings('panels/sources/WatchExpressionsSidebar
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 let watchExpressionsSidebarPaneInstance: WatchExpressionsSidebarPane;
 
-export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWidget implements
+export class WatchExpressionsSidebarPane extends UI.Widget.VBox implements
     UI.ActionRegistration.ActionDelegate, UI.Toolbar.ItemsProvider,
     UI.ContextMenu.Provider<ObjectUI.ObjectPropertiesSection.ObjectPropertyTreeElement|UISourceCodeFrame> {
   private watchExpressions: WatchExpression[];
@@ -106,7 +106,7 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
   private readonly expandController: ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController;
   private readonly linkifier: Components.Linkifier.Linkifier;
   private constructor() {
-    super(true);
+    super({useShadowDom: true});
     this.registerRequiredCSS(watchExpressionsSidebarPaneStyles, objectValueStyles);
 
     // TODO(szuend): Replace with a Set once the web test
@@ -125,7 +125,7 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
     this.refreshButton = new UI.Toolbar.ToolbarButton(
         i18nString(UIStrings.refreshWatchExpressions), 'refresh', undefined, 'refresh-watch-expressions');
     this.refreshButton.setSize(Buttons.Button.Size.SMALL);
-    this.refreshButton.addEventListener(UI.Toolbar.ToolbarButton.Events.CLICK, this.update, this);
+    this.refreshButton.addEventListener(UI.Toolbar.ToolbarButton.Events.CLICK, this.requestUpdate, this);
 
     this.contentElement.classList.add('watch-expressions');
     this.contentElement.setAttribute('jslog', `${VisualLogging.section('sources.watch')}`);
@@ -138,10 +138,10 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
     this.expandController =
         new ObjectUI.ObjectPropertiesSection.ObjectPropertiesSectionsTreeExpandController(this.treeOutline);
 
-    UI.Context.Context.instance().addFlavorChangeListener(SDK.RuntimeModel.ExecutionContext, this.update, this);
-    UI.Context.Context.instance().addFlavorChangeListener(SDK.DebuggerModel.CallFrame, this.update, this);
+    UI.Context.Context.instance().addFlavorChangeListener(SDK.RuntimeModel.ExecutionContext, this.requestUpdate, this);
+    UI.Context.Context.instance().addFlavorChangeListener(SDK.DebuggerModel.CallFrame, this.requestUpdate, this);
     this.linkifier = new Components.Linkifier.Linkifier();
-    this.update();
+    this.requestUpdate();
   }
 
   static instance(): WatchExpressionsSidebarPane {
@@ -182,7 +182,7 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
     this.createWatchExpression(null).startEditing();
   }
 
-  override async doUpdate(): Promise<void> {
+  override async performUpdate(): Promise<void> {
     this.linkifier.reset();
     this.contentElement.removeChildren();
     this.treeOutline.removeChildren();
@@ -265,14 +265,14 @@ export class WatchExpressionsSidebarPane extends UI.ThrottledWidget.ThrottledWid
   private deleteAllButtonClicked(): void {
     this.watchExpressions = [];
     this.saveExpressions();
-    this.update();
+    this.requestUpdate();
   }
 
   private async focusAndAddExpressionToWatch(expression: string): Promise<void> {
     await UI.ViewManager.ViewManager.instance().showView('sources.watch');
     this.createWatchExpression(expression);
     this.saveExpressions();
-    this.update();
+    this.requestUpdate();
   }
 
   handleAction(_context: UI.Context.Context, _actionId: string): boolean {

package/front_end/panels/timeline/TimelineUIUtils.ts

@@ -48,6 +48,7 @@ import * as Tracing from '../../services/tracing/tracing.js';
 import * as CodeHighlighter from '../../ui/components/code_highlighter/code_highlighter.js';
 // eslint-disable-next-line @devtools/es-modules-import
 import codeHighlighterStyles from '../../ui/components/code_highlighter/codeHighlighter.css.js';
+import * as uiI18n from '../../ui/i18n/i18n.js';
 import * as PerfUI from '../../ui/legacy/components/perf_ui/perf_ui.js';
 // eslint-disable-next-line @devtools/es-modules-import
 import imagePreviewStyles from '../../ui/legacy/components/utils/imagePreview.css.js';
@@ -1899,7 +1900,7 @@ export class TimelineUIUtils {
       const niceNodeLink = createLinkForInvalidationNode(invalidation);
 
       const text = scriptLink ?
-          i18n.i18n.getFormatLocalizedString(
+          uiI18n.getFormatLocalizedString(
               str_, UIStrings.invalidationWithCallFrame, {PH1: niceNodeLink, PH2: scriptLink}) as HTMLElement :
           niceNodeLink;
 
@@ -2207,7 +2208,7 @@ export class TimelineUIUtils {
       PH1: i18n.TimeUtilities.millisToString(durationMilli, true),
       PH2: i18n.TimeUtilities.millisToString(offsetMilli, true),
     });
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.emptyPlaceholder, {PH1: durationText});
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.emptyPlaceholder, {PH1: durationText});
   }
 
   static quadWidth(quad: number[]): number {

package/front_end/panels/timeline/components/DetailsView.ts

@@ -7,6 +7,7 @@ import * as i18n from '../../../core/i18n/i18n.js';
 import * as Platform from '../../../core/platform/platform.js';
 import type * as Protocol from '../../../generated/protocol.js';
 import * as Trace from '../../../models/trace/trace.js';
+import * as uiI18n from '../../../ui/i18n/i18n.js';
 import * as UI from '../../../ui/legacy/legacy.js';
 
 // *********************************************************************
@@ -86,8 +87,8 @@ export function buildWarningElementsForEvent(
         const forcedReflowLink = UI.XLink.XLink.create(
             'https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing#avoid-forced-synchronous-layouts',
             i18nString(UIStrings.forcedReflow), undefined, undefined, 'forced-reflow');
-        span.appendChild(i18n.i18n.getFormatLocalizedString(
-            str_, UIStrings.sIsALikelyPerformanceBottleneck, {PH1: forcedReflowLink}));
+        span.appendChild(
+            uiI18n.getFormatLocalizedString(str_, UIStrings.sIsALikelyPerformanceBottleneck, {PH1: forcedReflowLink}));
         break;
       }
       case 'IDLE_CALLBACK_OVER_TIME': {
@@ -103,7 +104,7 @@ export function buildWarningElementsForEvent(
       case 'LONG_TASK': {
         const longTaskLink = UI.XLink.XLink.create(
             'https://web.dev/optimize-long-tasks/', i18nString(UIStrings.longTask), undefined, undefined, 'long-tasks');
-        span.appendChild(i18n.i18n.getFormatLocalizedString(
+        span.appendChild(uiI18n.getFormatLocalizedString(
             str_, UIStrings.sTookS,
             {PH1: longTaskLink, PH2: i18n.TimeUtilities.millisToString((duration || 0), true)}));
         break;
@@ -111,7 +112,7 @@ export function buildWarningElementsForEvent(
       case 'LONG_INTERACTION': {
         const longInteractionINPLink = UI.XLink.XLink.create(
             'https://web.dev/inp', i18nString(UIStrings.longInteractionINP), undefined, undefined, 'long-interaction');
-        span.appendChild(i18n.i18n.getFormatLocalizedString(
+        span.appendChild(uiI18n.getFormatLocalizedString(
             str_, UIStrings.sIsLikelyPoorPageResponsiveness, {PH1: longInteractionINPLink}));
         break;
       }

package/front_end/panels/timeline/components/FieldSettingsDialog.ts

@@ -11,6 +11,7 @@ import * as Buttons from '../../../ui/components/buttons/buttons.js';
 import * as Dialogs from '../../../ui/components/dialogs/dialogs.js';
 import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
 import * as Input from '../../../ui/components/input/input.js';
+import * as uiI18n from '../../../ui/i18n/i18n.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';
@@ -331,7 +332,7 @@ export class FieldSettingsDialog extends HTMLElement {
   #render = (): void => {
     const linkEl =
         UI.XLink.XLink.create('https://developer.chrome.com/docs/crux', i18n.i18n.lockedString('Chrome UX Report'));
-    const descriptionEl = i18n.i18n.getFormatLocalizedString(str_, UIStrings.fetchAggregated, {PH1: linkEl});
+    const descriptionEl = uiI18n.getFormatLocalizedString(str_, UIStrings.fetchAggregated, {PH1: linkEl});
 
     // clang-format off
     const output = html`

package/front_end/panels/timeline/components/LiveMetricsView.ts

@@ -25,6 +25,7 @@ import * as LegacyWrapper from '../../../ui/components/legacy_wrapper/legacy_wra
 import type * as Menus from '../../../ui/components/menus/menus.js';
 import * as RenderCoordinator from '../../../ui/components/render_coordinator/render_coordinator.js';
 import type * as Settings from '../../../ui/components/settings/settings.js';
+import * as uiI18n from '../../../ui/i18n/i18n.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';
@@ -629,8 +630,8 @@ export class LiveMetricsView extends LegacyWrapper.LegacyWrapper.WrappableCompon
       <div class="device-toolbar-description">${md(i18nString(UIStrings.useDeviceToolbar))}</div>
       ${fieldEnabled ? html`
         <ul class="environment-recs-list">
-          <li>${i18n.i18n.getFormatLocalizedString(str_, UIStrings.device, {PH1: deviceRecEl})}</li>
-          <li>${i18n.i18n.getFormatLocalizedString(str_, UIStrings.network, {PH1: networkRecEl})}</li>
+          <li>${uiI18n.getFormatLocalizedString(str_, UIStrings.device, {PH1: deviceRecEl})}</li>
+          <li>${uiI18n.getFormatLocalizedString(str_, UIStrings.network, {PH1: networkRecEl})}</li>
         </ul>
       ` : nothing}
       <div class="environment-option">
@@ -839,7 +840,7 @@ export class LiveMetricsView extends LegacyWrapper.LegacyWrapper.WrappableCompon
     dateEl.classList.add('collection-period-range');
     dateEl.textContent = range || i18nString(UIStrings.notEnoughData);
 
-    const message = i18n.i18n.getFormatLocalizedString(str_, UIStrings.collectionPeriod, {
+    const message = uiI18n.getFormatLocalizedString(str_, UIStrings.collectionPeriod, {
       PH1: dateEl,
     });
 
@@ -862,7 +863,7 @@ export class LiveMetricsView extends LegacyWrapper.LegacyWrapper.WrappableCompon
 
     const linkEl =
         UI.XLink.XLink.create('https://developer.chrome.com/docs/crux', i18n.i18n.lockedString('Chrome UX Report'));
-    const messageEl = i18n.i18n.getFormatLocalizedString(str_, UIStrings.seeHowYourLocalMetricsCompare, {PH1: linkEl});
+    const messageEl = uiI18n.getFormatLocalizedString(str_, UIStrings.seeHowYourLocalMetricsCompare, {PH1: linkEl});
 
     return html`
       <div class="field-data-message">${messageEl}</div>

package/front_end/panels/timeline/components/MetricCompareStrings.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as i18n from '../../../core/i18n/i18n.js';
+import * as uiI18n from '../../../ui/i18n/i18n.js';
 
 import type {MetricRating} from './Utils.js';
 
@@ -185,40 +186,40 @@ export function renderCompareText(
   };
 
   if (rating === 'good' && compare === 'better') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodBetterCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodBetterCompare, values);
   }
   if (rating === 'good' && compare === 'worse') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodWorseCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodWorseCompare, values);
   }
   if (rating === 'good' && compare === 'similar') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodSimilarCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodSimilarCompare, values);
   }
   if (rating === 'good' && !compare) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodSummarized, values);
   }
   if (rating === 'needs-improvement' && compare === 'better') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementBetterCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementBetterCompare, values);
   }
   if (rating === 'needs-improvement' && compare === 'worse') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementWorseCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementWorseCompare, values);
   }
   if (rating === 'needs-improvement' && compare === 'similar') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSimilarCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSimilarCompare, values);
   }
   if (rating === 'needs-improvement' && !compare) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSummarized, values);
   }
   if (rating === 'poor' && compare === 'better') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorBetterCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorBetterCompare, values);
   }
   if (rating === 'poor' && compare === 'worse') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorWorseCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorWorseCompare, values);
   }
   if (rating === 'poor' && compare === 'similar') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorSimilarCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorSimilarCompare, values);
   }
   if (rating === 'poor' && !compare) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorSummarized, values);
   }
 
   throw new Error('Compare string not found');
@@ -241,40 +242,40 @@ export function renderDetailedCompareText(options: {
   };
 
   if (localRating === 'good' && fieldRating === 'good') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodGoodDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodGoodDetailedCompare, values);
   }
   if (localRating === 'good' && fieldRating === 'needs-improvement') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodNeedsImprovementDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodNeedsImprovementDetailedCompare, values);
   }
   if (localRating === 'good' && fieldRating === 'poor') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodPoorDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodPoorDetailedCompare, values);
   }
   if (localRating === 'good' && !fieldRating) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.goodSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.goodSummarized, values);
   }
   if (localRating === 'needs-improvement' && fieldRating === 'good') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementGoodDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementGoodDetailedCompare, values);
   }
   if (localRating === 'needs-improvement' && fieldRating === 'needs-improvement') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementNeedsImprovementDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementNeedsImprovementDetailedCompare, values);
   }
   if (localRating === 'needs-improvement' && fieldRating === 'poor') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementPoorDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementPoorDetailedCompare, values);
   }
   if (localRating === 'needs-improvement' && !fieldRating) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.needsImprovementSummarized, values);
   }
   if (localRating === 'poor' && fieldRating === 'good') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorGoodDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorGoodDetailedCompare, values);
   }
   if (localRating === 'poor' && fieldRating === 'needs-improvement') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorNeedsImprovementDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorNeedsImprovementDetailedCompare, values);
   }
   if (localRating === 'poor' && fieldRating === 'poor') {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorPoorDetailedCompare, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorPoorDetailedCompare, values);
   }
   if (localRating === 'poor' && !fieldRating) {
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.poorSummarized, values);
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.poorSummarized, values);
   }
 
   throw new Error('Detailed compare string not found');

package/front_end/panels/timeline/components/insights/LCPDiscovery.ts

@@ -8,6 +8,7 @@ import './Checklist.js';
 import * as i18n from '../../../../core/i18n/i18n.js';
 import type {LCPDiscoveryInsightModel} from '../../../../models/trace/insights/LCPDiscovery.js';
 import * as Trace from '../../../../models/trace/trace.js';
+import * as uiI18n from '../../../../ui/i18n/i18n.js';
 import * as Lit from '../../../../ui/lit/lit.js';
 
 import {BaseInsightComponent} from './BaseInsightComponent.js';
@@ -63,7 +64,7 @@ export class LCPDiscovery extends BaseInsightComponent<LCPDiscoveryInsightModel>
     const timeWrapper = document.createElement('span');
     timeWrapper.classList.add('discovery-time-ms');
     timeWrapper.innerText = i18n.TimeUtilities.formatMicroSecondsAsMillisFixed(delay);
-    return i18n.i18n.getFormatLocalizedString(str_, UIStrings.lcpLoadDelay, {PH1: timeWrapper});
+    return uiI18n.getFormatLocalizedString(str_, UIStrings.lcpLoadDelay, {PH1: timeWrapper});
   }
 
   override renderContent(): Lit.LitTemplate {

package/front_end/third_party/chromium/README.chromium

@@ -1,7 +1,7 @@
 Name: Dependencies sourced from the upstream `chromium` repository
 URL: https://source.chromium.org/chromium/chromium/src/+/main:components/variations/proto/devtools/
 Version: N/A
-Revision: c7f689c4ea24e98a4a1e06c78b10633db5a9f78f
+Revision: 02e01d70b196feed2ae409aa37b1c99afb6c2ef3
 Update Mechanism: Manual (https://crbug.com/428069060)
 License: BSD-3-Clause
 License File: LICENSE

package/front_end/ui/components/docs/tooltip/basic.ts

@@ -31,7 +31,7 @@ Lit.render(
       >
         Non-button click trigger
       </span>
-      <devtools-tooltip id="rich-tooltip" variant="rich" use-click>
+      <devtools-tooltip id="rich-tooltip" variant="rich" trigger="click">
         <p>Rich tooltip</p>
         <button>Action</button>
       </devtools-tooltip>