chrome-devtools-frontend 1.0.1534717 → 1.0.1536371

package/front_end/ui/legacy/Widget.ts

@@ -125,6 +125,14 @@ export class WidgetElement<WidgetT extends Widget> extends HTMLElement {
     widget.show(this.parentElement as HTMLElement, undefined, /* suppressOrphanWidgetError= */ true);
   }
 
+  disconnectedCallback(): void {
+    const widget = Widget.get(this);
+    if (widget) {
+      widget.setHideOnDetach();
+      widget.detach();
+    }
+  }
+
   override appendChild<T extends Node>(child: T): T {
     if (child instanceof HTMLElement && child.tagName !== 'STYLE') {
       Widget.getOrCreateWidget(child).show(this);
@@ -264,7 +272,6 @@ export class Widget {
   #notificationDepth = 0;
   #invalidationsSuspended = 0;
   #parentWidget: Widget|null = null;
-  #defaultFocusedElement?: Element|null;
   #cachedConstraints?: Geometry.Constraints;
   #constraints?: Geometry.Constraints;
   #invalidationsRequested?: boolean;
@@ -724,7 +731,13 @@ export class Widget {
   }
 
   setDefaultFocusedElement(element: Element|null): void {
-    this.#defaultFocusedElement = element;
+    const defaultFocusedElement = this.getDefaultFocusedElement();
+    if (defaultFocusedElement) {
+      defaultFocusedElement.removeAttribute('autofocus');
+    }
+    if (element) {
+      element.setAttribute('autofocus', '');
+    }
   }
 
   setDefaultFocusedChild(child: Widget): void {
@@ -732,21 +745,28 @@ export class Widget {
     this.defaultFocusedChild = child;
   }
 
-  focus(): void {
-    if (!this.isShowing()) {
-      return;
+  getDefaultFocusedElement(): HTMLElement|null {
+    const autofocusElement = this.contentElement.hasAttribute('autofocus') ?
+        this.contentElement :
+        this.contentElement.querySelector<HTMLElement>('[autofocus]');
+    let widgetElement: Element|null = autofocusElement;
+    while (widgetElement) {
+      const widget = Widget.get(widgetElement);
+      if (widget) {
+        return widget === this ? autofocusElement : null;
+      }
+      widgetElement = widgetElement.parentElementOrShadowHost();
     }
+    return null;
+  }
 
-    if (this.#shadowRoot?.delegatesFocus && this.contentElement.querySelector('[autofocus]')) {
-      this.element.focus();
+  focus(): void {
+    if (!this.isShowing()) {
       return;
     }
-
-    const element = (this.#defaultFocusedElement as HTMLElement | null);
-    if (element) {
-      if (!element.hasFocus()) {
-        element.focus();
-      }
+    const autofocusElement = this.getDefaultFocusedElement();
+    if (autofocusElement) {
+      autofocusElement.focus();
       return;
     }
 
@@ -759,10 +779,6 @@ export class Widget {
           return;
         }
       }
-      let child = this.contentElement.traverseNextNode(this.contentElement);
-      while (child) {
-        child = child.traverseNextNode(this.contentElement);
-      }
     }
   }
 

package/front_end/ui/legacy/components/object_ui/ObjectPropertiesSection.ts

@@ -35,6 +35,7 @@ import * as i18n from '../../../../core/i18n/i18n.js';
 import * as Platform from '../../../../core/platform/platform.js';
 import * as SDK from '../../../../core/sdk/sdk.js';
 import * as TextUtils from '../../../../models/text_utils/text_utils.js';
+import * as uiI18n from '../../../../ui/i18n/i18n.js';
 import * as IconButton from '../../../components/icon_button/icon_button.js';
 import * as TextEditor from '../../../components/text_editor/text_editor.js';
 import * as VisualLogging from '../../../visual_logging/visual_logging.js';
@@ -438,7 +439,7 @@ export class ObjectPropertiesSection extends UI.TreeOutline.TreeOutlineInShadow
       wrapperElement.classList.add('error');
       wrapperElement.classList.add('value');
       wrapperElement.appendChild(
-          i18n.i18n.getFormatLocalizedString(str_, UIStrings.exceptionS, {PH1: propertyValue.element}));
+          uiI18n.getFormatLocalizedString(str_, UIStrings.exceptionS, {PH1: propertyValue.element}));
       propertyValue.element = wrapperElement;
     }
     propertyValue.element.classList.add('value');

package/front_end/ui/legacy/legacy.ts

@@ -42,7 +42,6 @@ import * as SuggestBox from './SuggestBox.js';
 import * as TabbedPane from './TabbedPane.js';
 import * as TargetCrashedScreen from './TargetCrashedScreen.js';
 import * as TextPrompt from './TextPrompt.js';
-import * as ThrottledWidget from './ThrottledWidget.js';
 import * as Toolbar from './Toolbar.js';
 import * as Tooltip from './Tooltip.js';
 import * as TreeOutline from './Treeoutline.js';
@@ -95,7 +94,6 @@ export {
   TabbedPane,
   TargetCrashedScreen,
   TextPrompt,
-  ThrottledWidget,
   Toolbar,
   Tooltip,
   TreeOutline,

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -810,6 +810,7 @@ export const knownContextValues = new Set([
   'column-rule-color',
   'column-rule-outset',
   'column-rule-style',
+  'column-rule-visibility-items',
   'column-rule-width',
   'column-span',
   'column-width',
@@ -848,6 +849,7 @@ export const knownContextValues = new Set([
   'console-group-similar-false',
   'console-history-autocomplete',
   'console-history-autocomplete-false',
+  'console-insight-teaser',
   'console-insight-teasers-enabled',
   'console-insights',
   'console-insights-enabled',
@@ -3161,6 +3163,7 @@ export const knownContextValues = new Set([
   'row-rule-color',
   'row-rule-outset',
   'row-rule-style',
+  'row-rule-visibility-items',
   'row-rule-width',
   'rp-id',
   'rpId',
@@ -3685,6 +3688,7 @@ export const knownContextValues = new Set([
   'targets',
   'task-duration',
   'te',
+  'teaser-info-tooltip',
   'terms-of-service',
   'terms-of-service-accepted',
   'terms-of-service.console-insights',
@@ -3729,6 +3733,7 @@ export const knownContextValues = new Set([
   'text-emphasis-style',
   'text-grow',
   'text-indent',
+  'text-justify',
   'text-node',
   'text-orientation',
   'text-overflow',

package/mcp/mcp.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+export * as I18n from '../front_end/core/i18n/i18n.js';
 export {ConnectionTransport} from '../front_end/core/protocol_client/ConnectionTransport.js';
 export {
   PerformanceInsightFormatter

package/package.json

@@ -102,5 +102,5 @@
       "flat-cache": "6.1.12"
     }
   },
-  "version": "1.0.1534717"
+  "version": "1.0.1536371"
 }

package/front_end/ui/components/docs/recorder_create_recording_view/basic.html

@@ -1,20 +0,0 @@
-<!--
-  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.
--->
-<!DOCTYPE html>
-<html>
-
-<head>
-  <meta charset="UTF-8" />
-  <meta name="viewport" content="width=device-width" />
-  <title>Recorder: CreateRecordingView</title>
-</head>
-
-<body>
-  <div id="container"></div>
-  <script src="./basic.js" type="module"></script>
-</body>
-
-</html>

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

@@ -1,27 +0,0 @@
-// 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.
-
-import * as ComponentHelpers from '../../../../../front_end/ui/components/helpers/helpers.js';
-import * as RecorderComponents from '../../../../panels/recorder/components/components.js';
-import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
-
-await ComponentHelpers.ComponentServerSetup.setup();
-await FrontendHelpers.initializeGlobalVars();
-async function initializeGlobalActions(): Promise<void> {
-  const UI = await import('../../../../../front_end/ui/legacy/legacy.js');
-  const actionRegistry = UI.ActionRegistry.ActionRegistry.instance();
-  UI.ShortcutRegistry.ShortcutRegistry.instance({
-    forceNew: true,
-    actionRegistry,
-  });
-}
-
-await initializeGlobalActions();
-
-const component1 = new RecorderComponents.CreateRecordingView.CreateRecordingView();
-document.getElementById('container')?.appendChild(component1);
-
-const component2 = new RecorderComponents.CreateRecordingView.CreateRecordingView();
-document.getElementById('container')?.appendChild(component2);
-component2.shadowRoot?.querySelector('devtools-control-button')?.click();

package/front_end/ui/legacy/ThrottledWidget.ts

@@ -1,48 +0,0 @@
-// Copyright 2014 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 Common from '../../core/common/common.js';
-
-import {VBox} from './Widget.js';
-
-export class ThrottledWidget extends VBox {
-  private readonly updateThrottler: Common.Throttler.Throttler;
-  private updateWhenVisible: boolean;
-  protected lastUpdatePromise: Promise<void> = Promise.resolve();
-
-  constructor(useShadowDom?: boolean, timeout?: number) {
-    super({useShadowDom});
-    this.updateThrottler = new Common.Throttler.Throttler(timeout === undefined ? 100 : timeout);
-    this.updateWhenVisible = false;
-  }
-
-  protected doUpdate(): Promise<void> {
-    return Promise.resolve();
-  }
-
-  update(): void {
-    this.updateWhenVisible = !this.isShowing();
-    if (this.updateWhenVisible) {
-      return;
-    }
-    this.lastUpdatePromise = this.updateThrottler.schedule(() => {
-      if (this.isShowing()) {
-        return this.doUpdate();
-      }
-      this.updateWhenVisible = true;
-      return Promise.resolve();
-    });
-  }
-
-  override get updateComplete(): Promise<boolean> {
-    return this.updateThrottler.processCompleted?.then(result => Boolean(result)) || Promise.resolve(false);
-  }
-
-  override wasShown(): void {
-    super.wasShown();
-    if (this.updateWhenVisible) {
-      this.update();
-    }
-  }
-}