chrome-devtools-frontend 1.0.1568190 → 1.0.1569477

package/front_end/models/javascript_metadata/NativeFunctions.js

@@ -7400,6 +7400,18 @@ export const NativeFunctions = [
     name: "queryFeatureSupport",
     signatures: [["feature"]]
   },
+  {
+    name: "LanguageModelToolCall",
+    signatures: [["init"]]
+  },
+  {
+    name: "LanguageModelToolSuccess",
+    signatures: [["init"]]
+  },
+  {
+    name: "LanguageModelToolError",
+    signatures: [["init"]]
+  },
   {
     name: "registerAnimator",
     signatures: [["name","animatorCtor"]]

package/front_end/models/stack_trace/StackTraceImpl.ts

@@ -31,7 +31,9 @@ export class StackTraceImpl<SyncFragmentT extends FragmentImpl|DebuggableFragmen
 }
 
 export class FragmentImpl implements StackTrace.StackTrace.Fragment {
-  readonly node: FrameNode;
+  static readonly EMPTY_FRAGMENT = new FragmentImpl();
+
+  readonly node?: FrameNode;
   readonly stackTraces = new Set<AnyStackTraceImpl>();
 
   /**
@@ -46,11 +48,15 @@ export class FragmentImpl implements StackTrace.StackTrace.Fragment {
     return node.fragment;
   }
 
-  private constructor(node: FrameNode) {
+  private constructor(node?: FrameNode) {
     this.node = node;
   }
 
   get frames(): FrameImpl[] {
+    if (!this.node) {
+      return [];
+    }
+
     const frames: FrameImpl[] = [];
 
     for (const node of this.node.getCallStack()) {
@@ -101,6 +107,10 @@ export class DebuggableFragmentImpl implements StackTrace.StackTrace.DebuggableF
   }
 
   get frames(): DebuggableFrameImpl[] {
+    if (!this.fragment.node) {
+      return [];
+    }
+
     const frames: DebuggableFrameImpl[] = [];
 
     let index = 0;

package/front_end/models/stack_trace/StackTraceModel.ts

@@ -77,7 +77,7 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
         // is re-translated as a side-effect.
         // We just need to remember the stack traces of the skipped over fragments, so we can send the
         // UPDATED event also to them.
-        if (fragment.node.children.length === 0) {
+        if (fragment.node?.children.length === 0) {
           translatePromises.push(this.#translateFragment(fragment, translateRawFrames));
         }
         stackTracesToUpdate = stackTracesToUpdate.union(fragment.stackTraces);
@@ -133,6 +133,10 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   }
 
   async #createFragment(frames: RawFrame[], rawFramesToUIFrames: TranslateRawFrames): Promise<FragmentImpl> {
+    if (frames.length === 0) {
+      return FragmentImpl.EMPTY_FRAGMENT;
+    }
+
     const release = await this.#mutex.acquire();
     try {
       const node = this.#trie.insert(frames);
@@ -150,6 +154,10 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   }
 
   async #translateFragment(fragment: FragmentImpl, rawFramesToUIFrames: TranslateRawFrames): Promise<void> {
+    if (!fragment.node) {
+      return;
+    }
+
     const rawFrames = fragment.node.getCallStack().map(node => node.rawFrame).toArray();
     const uiFrames = await rawFramesToUIFrames(rawFrames, this.target());
     console.assert(rawFrames.length === uiFrames.length, 'Broken rawFramesToUIFrames implementation');

package/front_end/models/trace/Styles.ts

@@ -311,6 +311,10 @@ const UIStrings = {
    * @description Text in Timeline UIUtils of the Performance panel
    */
   largestContentfulPaint: 'Largest Contentful Paint',
+  /**
+   * @description Text in Timeline UIUtils of the Performance panel
+   */
+  softLargestContentfulPaint: 'Soft Largest Contentful Paint',
   /**
    * @description Text for timestamps of items
    */
@@ -880,7 +884,7 @@ export function maybeInitSylesMap(): EventStylesMap {
         true,
         ),
     [Types.Events.Name.MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION]: new TimelineRecordStyle(
-        i18nString(UIStrings.largestContentfulPaint),
+        i18nString(UIStrings.softLargestContentfulPaint),
         defaultCategoryStyles.rendering,
         true,
         ),
@@ -1125,15 +1129,14 @@ export function markerDetailsForEvent(event: Types.Events.Event): {
   }
   if (Types.Events.isAnyLargestContentfulPaintCandidate(event)) {
     color = 'var(--sys-color-green)';
-    title = Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP;
+    title = Types.Events.isSoftLargestContentfulPaintCandidate(event) ?
+        Handlers.ModelHandlers.PageLoadMetrics.MetricName.SOFT_LCP :
+        Handlers.ModelHandlers.PageLoadMetrics.MetricName.LCP;
   }
-  if (Types.Events.isNavigationStart(event)) {
+  if (Types.Events.isNavigationStart(event) || Types.Events.isSoftNavigationStart(event)) {
     color = 'var(--color-text-primary)';
-    title = Handlers.ModelHandlers.PageLoadMetrics.MetricName.NAV;
-  }
-  if (Types.Events.isSoftNavigationStart(event)) {
-    color = 'var(--sys-color-blue)';
-    title = Handlers.ModelHandlers.PageLoadMetrics.MetricName.SOFT_NAV;
+    title = Types.Events.isSoftNavigationStart(event) ? Handlers.ModelHandlers.PageLoadMetrics.MetricName.SOFT_NAV :
+                                                        Handlers.ModelHandlers.PageLoadMetrics.MetricName.NAV;
   }
   if (Types.Events.isMarkDOMContent(event)) {
     color = 'var(--color-text-disabled)';

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

@@ -460,8 +460,9 @@ export const enum MetricName {
   CLS = 'CLS',
   // Navigation
   NAV = 'Nav',
-  // Soft Navigation (just "Nav" b/c space is limited in flame chart)
-  SOFT_NAV = 'Nav',
+  // Soft Navigation and Soft Metrics
+  SOFT_NAV = 'Nav*',
+  SOFT_LCP = 'LCP*',
   // Note: INP is handled in UserInteractionsHandler
 }
 

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

@@ -678,7 +678,7 @@ export interface Mark extends Event {
 }
 
 export interface NavigationStart extends Mark {
-  name: 'navigationStart';
+  name: Name.NAVIGATION_START;
   args: Args&{
     frame: string,
     data?: ArgsData&{
@@ -738,7 +738,7 @@ export interface FirstContentfulPaint extends Mark {
 }
 
 export interface FirstPaint extends Mark {
-  name: 'firstPaint';
+  name: Name.MARK_FIRST_PAINT;
   args: Args&{
     frame: string,
     data?: ArgsData&{
@@ -761,8 +761,14 @@ const markerTypeGuards = [
 ];
 
 export const MarkerName = [
-  'MarkDOMContent', 'MarkLoad', 'firstPaint', 'firstContentfulPaint', 'largestContentfulPaint::Candidate',
-  'largestContentfulPaint::CandidateForSoftNavigation'
+  Name.MARK_DOM_CONTENT,
+  Name.MARK_LOAD,
+  Name.MARK_FIRST_PAINT,
+  Name.MARK_FCP,
+  Name.MARK_LCP_CANDIDATE,
+  Name.MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION,
+  Name.NAVIGATION_START,
+  Name.SOFT_NAVIGATION_START,
 ] as const;
 
 export interface MarkerEvent extends Event {
@@ -968,7 +974,7 @@ export interface CommitLoad extends Instant {
 }
 
 export interface MarkDOMContent extends Instant {
-  name: 'MarkDOMContent';
+  name: Name.MARK_DOM_CONTENT;
   args: Args&{
     data?: ArgsData & {
       frame: string,
@@ -980,7 +986,7 @@ export interface MarkDOMContent extends Instant {
 }
 
 export interface MarkLoad extends Instant {
-  name: 'MarkLoad';
+  name: Name.MARK_LOAD;
   args: Args&{
     data?: ArgsData & {
       frame: string,
@@ -2256,12 +2262,15 @@ export function isLayoutInvalidationTracking(
 }
 
 export function isFirstContentfulPaint(event: Event): event is FirstContentfulPaint {
-  return event.name === 'firstContentfulPaint';
+  return event.name === Name.MARK_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;
 }
+export function isSoftLargestContentfulPaintCandidate(event: Event): event is AnyLargestContentfulPaintCandidate {
+  return event.name === Name.MARK_LCP_CANDIDATE_FOR_SOFT_NAVIGATION;
+}
 export function isLargestImagePaintCandidate(event: Event): event is LargestImagePaintCandidate {
   return event.name === 'LargestImagePaint::Candidate';
 }
@@ -2270,15 +2279,15 @@ export function isLargestTextPaintCandidate(event: Event): event is LargestTextP
 }
 
 export function isMarkLoad(event: Event): event is MarkLoad {
-  return event.name === 'MarkLoad';
+  return event.name === Name.MARK_LOAD;
 }
 
 export function isFirstPaint(event: Event): event is FirstPaint {
-  return event.name === 'firstPaint';
+  return event.name === Name.MARK_FIRST_PAINT;
 }
 
 export function isMarkDOMContent(event: Event): event is MarkDOMContent {
-  return event.name === 'MarkDOMContent';
+  return event.name === Name.MARK_DOM_CONTENT;
 }
 
 export function isInteractiveTime(event: Event): event is InteractiveTime {

package/front_end/panels/application/preloading/PreloadingView.ts

@@ -564,9 +564,7 @@ export class PreloadingSummaryView extends UI.Widget.VBox {
     this.contentElement.insertBefore(this.warningsContainer, this.contentElement.firstChild);
     this.warningsView.show(this.warningsContainer);
 
-    const usedPreloadingContainer = new UI.Widget.VBox();
-    usedPreloadingContainer.contentElement.appendChild(this.usedPreloading);
-    usedPreloadingContainer.show(this.contentElement);
+    this.usedPreloading.show(this.contentElement);
   }
 
   override wasShown(): void {

package/front_end/panels/application/preloading/components/UsedPreloadingView.ts

@@ -1,7 +1,6 @@
 // Copyright 2023 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-/* eslint-disable @devtools/no-lit-render-outside-of-view */
 
 import '../../../../ui/kit/kit.js';
 import '../../../../ui/components/report_view/report_view.js';
@@ -13,8 +12,6 @@ import type * as Platform from '../../../../core/platform/platform.js';
 import {assertNotNullOrUndefined} from '../../../../core/platform/platform.js';
 import * as SDK from '../../../../core/sdk/sdk.js';
 import * as Protocol from '../../../../generated/protocol.js';
-import * as LegacyWrapper from '../../../../ui/components/legacy_wrapper/legacy_wrapper.js';
-import * as RenderCoordinator from '../../../../ui/components/render_coordinator/render_coordinator.js';
 import * as UI from '../../../../ui/legacy/legacy.js';
 import {html, type LitTemplate, nothing, render} from '../../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../../ui/visual_logging/visual_logging.js';
@@ -399,18 +396,17 @@ function renderBadge(config: Badge): LitTemplate {
 
 type View = (input: ViewInput, output: undefined, target: HTMLElement|ShadowRoot) => void;
 
-const DEFAULT_VIEW: View =
-    ({speculativeLoadingStatusData, speculationsInitiatedSummaryData}: ViewInput, output, target): void => {
-      // Disabled until https://crbug.com/1079231 is fixed.
-      // clang-format off
+const DEFAULT_VIEW: View = (input, _output, target) => {
+  // Disabled until https://crbug.com/1079231 is fixed.
+  // clang-format off
   render(html`
     <style>${usedPreloadingStyles}</style>
     <devtools-report>
-      ${renderSpeculativeLoadingStatusForThisPageSections(speculativeLoadingStatusData)}
+      ${renderSpeculativeLoadingStatusForThisPageSections(input.speculativeLoadingStatusData)}
 
       <devtools-report-divider></devtools-report-divider>
 
-      ${renderSpeculationsInitiatedByThisPageSummarySections(speculationsInitiatedSummaryData)}
+      ${renderSpeculationsInitiatedByThisPageSummarySections(input.speculationsInitiatedSummaryData)}
 
       <devtools-report-divider></devtools-report-divider>
 
@@ -423,20 +419,19 @@ const DEFAULT_VIEW: View =
                   .context('learn-more')}
         >${i18nString(UIStrings.learnMore)}</x-link>
       </devtools-report-section>
-    </devtools-report>`, target, {host: target instanceof ShadowRoot ? target.host : undefined});
-      // clang-format on
-    };
+    </devtools-report>`, target);
+  // clang-format on
+};
 
 /**
  * TODO(kenoss): Rename this class and file once https://crrev.com/c/4933567 landed.
  * This also shows summary of speculations initiated by this page.
  **/
-export class UsedPreloadingView extends LegacyWrapper.LegacyWrapper.WrappableComponent<UI.Widget.VBox> {
-  readonly #shadow = this.attachShadow({mode: 'open'});
+export class UsedPreloadingView extends UI.Widget.VBox {
   readonly #view: View;
 
   constructor(view = DEFAULT_VIEW) {
-    super();
+    super({useShadowDom: true});
     this.#view = view;
   }
 
@@ -448,17 +443,15 @@ export class UsedPreloadingView extends LegacyWrapper.LegacyWrapper.WrappableCom
 
   set data(data: UsedPreloadingViewData) {
     this.#data = data;
-    void this.#render();
+    this.requestUpdate();
   }
 
-  async #render(): Promise<void> {
+  override performUpdate(): void {
     const viewInput: ViewInput = {
       speculativeLoadingStatusData: this.#getSpeculativeLoadingStatusForThisPageData(),
       speculationsInitiatedSummaryData: this.#getSpeculationsInitiatedByThisPageSummaryData(),
     };
-    await RenderCoordinator.write('UsedPreloadingView render', () => {
-      this.#view(viewInput, undefined, this.#shadow);
-    });
+    this.#view(viewInput, undefined, this.contentElement);
   }
 
   #isPrerenderLike(speculationAction: Protocol.Preload.SpeculationAction): boolean {
@@ -583,11 +576,3 @@ export class UsedPreloadingView extends LegacyWrapper.LegacyWrapper.WrappableCom
     return {badges, revealRuleSetView, revealAttemptViewWithFilter};
   }
 }
-
-customElements.define('devtools-resources-used-preloading-view', UsedPreloadingView);
-
-declare global {
-  interface HTMLElementTagNameMap {
-    'devtools-resources-used-preloading-view': UsedPreloadingView;
-  }
-}

package/front_end/panels/common/AiCodeCompletionTeaser.ts

@@ -6,9 +6,10 @@ import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Root from '../../core/root/root.js';
+import * as AiCodeGeneration from '../../models/ai_code_generation/ai_code_generation.js';
 import * as Snackbars from '../../ui/components/snackbars/snackbars.js';
 import * as UI from '../../ui/legacy/legacy.js';
-import {html, nothing, render} from '../../ui/lit/lit.js';
+import {html, type LitTemplate, nothing, render} from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 
 import styles from './aiCodeCompletionTeaser.css.js';
@@ -61,17 +62,32 @@ const UIStringsNotTranslate = {
    */
   freDisclaimerTextAiWontAlwaysGetItRight: 'This feature uses AI and won’t always get it right',
   /**
-   * @description Second disclaimer item text for the fre dialog.
+   * @description Code completion disclaimer item text for the fre dialog.
+   */
+  freDisclaimerTextAsYouType:
+      'As you type, relevant data is being send to Google to generate code suggestions. Press Tab to accept.',
+  /**
+   * @description Code generation disclaimer item text for the fre dialog.
+   */
+  freDisclaimerDescribeCodeInComment:
+      'In Console or Sources, describe the code you need in a comment, then press Ctrl+I to generate it.',
+  /**
+   * @description Code generation disclaimer item text for the fre dialog.
+   */
+  freDisclaimerDescribeCodeInCommentForMacOs:
+      'In Console or Sources, describe the code you need in a comment, then press Cmd+I to generate it.',
+  /**
+   * @description Privacy disclaimer item text for the fre dialog.
    */
   freDisclaimerTextPrivacy:
       'To generate code suggestions, your console input, the history of your current console session, the currently inspected CSS, and the contents of the currently open file are shared with Google. This data may be seen by human reviewers to improve this feature.',
   /**
-   * @description Second disclaimer item text for the fre dialog when enterprise logging is off.
+   * @description Privacy disclaimer item text for the fre dialog when enterprise logging is off.
    */
   freDisclaimerTextPrivacyNoLogging:
       'To generate code suggestions, your console input, the history of your current console session, the currently inspected CSS, and the contents of the currently open file are shared with Google. This data will not be used to improve Google’s AI models. Your organization may change these settings at any time.',
   /**
-   * @description Third disclaimer item text for the fre dialog.
+   * @description Last disclaimer item text for the fre dialog.
    */
   freDisclaimerTextUseWithCaution: 'Use generated code snippets with caution',
   /**
@@ -192,15 +208,34 @@ export class AiCodeCompletionTeaser extends UI.Widget.Widget {
     }
   }
 
-  onAction = async(event: Event): Promise<void> => {
-    event.preventDefault();
-    const result = await FreDialog.show({
-      header: {iconName: 'smart-assistant', text: lockedString(UIStringsNotTranslate.freDisclaimerHeader)},
-      reminderItems: [
-        {
-          iconName: 'psychiatry',
-          content: lockedString(UIStringsNotTranslate.freDisclaimerTextAiWontAlwaysGetItRight),
-        },
+  #createReminderItems(): Array<{
+    iconName: string,
+    content: Common.UIString.LocalizedString|LitTemplate,
+  }> {
+    const reminderItems: Array<{
+      iconName: string,
+      content: Common.UIString.LocalizedString | LitTemplate,
+    }> = [{
+      iconName: 'psychiatry',
+      content: lockedString(UIStringsNotTranslate.freDisclaimerTextAiWontAlwaysGetItRight),
+    }];
+
+    const devtoolsLocale = i18n.DevToolsLocale.DevToolsLocale.instance();
+    if (AiCodeGeneration.AiCodeGeneration.AiCodeGeneration.isAiCodeGenerationEnabled(devtoolsLocale.locale)) {
+      reminderItems.push(
+          {
+            iconName: 'code',
+            content: lockedString(UIStringsNotTranslate.freDisclaimerTextAsYouType),
+          },
+          {
+            iconName: 'text-analysis',
+            content: Host.Platform.isMac() ?
+                lockedString(UIStringsNotTranslate.freDisclaimerDescribeCodeInCommentForMacOs) :
+                lockedString(UIStringsNotTranslate.freDisclaimerDescribeCodeInComment),
+          });
+    }
+
+    reminderItems.push(
         {
           iconName: 'google',
           content: this.#noLogging ? lockedString(UIStringsNotTranslate.freDisclaimerTextPrivacyNoLogging) :
@@ -217,8 +252,16 @@ export class AiCodeCompletionTeaser extends UI.Widget.Widget {
             })}
           >${lockedString(UIStringsNotTranslate.freDisclaimerTextUseWithCaution)}</x-link>`,
           // clang-format on
-        }
-      ],
+        });
+    return reminderItems;
+  }
+
+  onAction = async(event: Event): Promise<void> => {
+    event.preventDefault();
+
+    const result = await FreDialog.show({
+      header: {iconName: 'smart-assistant', text: lockedString(UIStringsNotTranslate.freDisclaimerHeader)},
+      reminderItems: this.#createReminderItems(),
       onLearnMoreClick: () => {
         void UI.ViewManager.ViewManager.instance().showView('chrome-ai');
       },

package/front_end/panels/common/AiCodeGenerationTeaser.ts

@@ -70,7 +70,7 @@ const UIStringsNotTranslate = {
 } as const;
 
 const lockedString = i18n.i18n.lockedString;
-const PROMOTION_ID = 'ai-code-generation';
+export const PROMOTION_ID = 'ai-code-generation';
 
 export enum AiCodeGenerationTeaserDisplayState {
   TRIGGER = 'trigger',

package/front_end/panels/elements/ElementsPanel.ts

@@ -982,7 +982,6 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
 
     const showMetricsWidgetInComputedPane = (): void => {
       this.metricsWidget.show(computedStylePanesWrapper.element, this.computedStyleWidget.element);
-      this.metricsWidget.toggleVisibility(true /* visible */);
       this.stylesWidget.removeEventListener(StylesSidebarPaneEvents.STYLES_UPDATE_COMPLETED, toggleMetricsWidget);
     };
 
@@ -993,14 +992,18 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
       } else {
         this.metricsWidget.show(matchedStylePanesWrapper.element);
         if (!this.stylesWidget.hasMatchedStyles) {
-          this.metricsWidget.toggleVisibility(false /* invisible */);
+          this.metricsWidget.hideWidget();
         }
         this.stylesWidget.addEventListener(StylesSidebarPaneEvents.STYLES_UPDATE_COMPLETED, toggleMetricsWidget);
       }
     };
 
     const toggleMetricsWidget = (event: Common.EventTarget.EventTargetEvent<StylesUpdateCompletedEvent>): void => {
-      this.metricsWidget.toggleVisibility(event.data.hasMatchedStyles);
+      if (event.data.hasMatchedStyles) {
+        this.metricsWidget.showWidget();
+      } else {
+        this.metricsWidget.hideWidget();
+      }
     };
 
     const tabSelected = (event: Common.EventTarget.EventTargetEvent<UI.TabbedPane.EventData>): void => {

package/front_end/panels/elements/ElementsSidebarPane.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import * as Common from '../../core/common/common.js';
+import type * as Common from '../../core/common/common.js';
 import type * as SDK from '../../core/sdk/sdk.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
@@ -10,16 +10,14 @@ import {type ComputedStyleModel, type CSSModelChangedEvent, Events} from './Comp
 
 export class ElementsSidebarPane extends UI.Widget.VBox {
   protected computedStyleModelInternal: ComputedStyleModel;
-  private readonly updateThrottler: Common.Throttler.Throttler;
-  private updateWhenVisible: boolean;
-  constructor(computedStyleModel: ComputedStyleModel, delegatesFocus?: boolean) {
-    super({useShadowDom: true, delegatesFocus, classes: ['flex-none']});
+  constructor(computedStyleModel: ComputedStyleModel, options: UI.Widget.WidgetOptions = {}) {
+    options.useShadowDom = options.useShadowDom ?? true;
+    options.classes = options.classes ?? [];
+    options.classes.push('flex-none');
+    super(options);
     this.computedStyleModelInternal = computedStyleModel;
     this.computedStyleModelInternal.addEventListener(Events.CSS_MODEL_CHANGED, this.onCSSModelChanged, this);
     this.computedStyleModelInternal.addEventListener(Events.COMPUTED_STYLE_CHANGED, this.onComputedStyleChanged, this);
-
-    this.updateThrottler = new Common.Throttler.Throttler(100);
-    this.updateWhenVisible = false;
   }
 
   node(): SDK.DOMModel.DOMNode|null {
@@ -34,29 +32,10 @@ export class ElementsSidebarPane extends UI.Widget.VBox {
     return this.computedStyleModelInternal;
   }
 
-  async doUpdate(): Promise<void> {
+  override async performUpdate(): Promise<void> {
     return;
   }
 
-  update(): void {
-    this.updateWhenVisible = !this.isShowing();
-    if (this.updateWhenVisible) {
-      return;
-    }
-    void this.updateThrottler.schedule(innerUpdate.bind(this));
-
-    function innerUpdate(this: ElementsSidebarPane): Promise<void> {
-      return this.isShowing() ? this.doUpdate() : Promise.resolve();
-    }
-  }
-
-  override wasShown(): void {
-    super.wasShown();
-    if (this.updateWhenVisible) {
-      this.update();
-    }
-  }
-
   onCSSModelChanged(_event: Common.EventTarget.EventTargetEvent<CSSModelChangedEvent|null>): void {
   }