chrome-devtools-frontend 1.0.1533544 → 1.0.1534717

package/front_end/third_party/puppeteer/package/src/cdp/Page.ts

@@ -859,7 +859,7 @@ export class CdpPage extends Page {
     }
     const textTokens = [];
     // eslint-disable-next-line max-len -- The comment is long.
-    // eslint-disable-next-line rulesdir/use-using -- These are not owned by this function.
+    // eslint-disable-next-line @puppeteer/use-using -- These are not owned by this function.
     for (const arg of args) {
       const remoteObject = arg.remoteObject();
       if (remoteObject.objectId) {

package/front_end/third_party/puppeteer/package/src/revisions.ts

@@ -8,7 +8,7 @@
  * @internal
  */
 export const PUPPETEER_REVISIONS = Object.freeze({
-  chrome: '141.0.7390.78',
-  'chrome-headless-shell': '141.0.7390.78',
+  chrome: '141.0.7390.122',
+  'chrome-headless-shell': '141.0.7390.122',
   firefox: 'stable_144.0',
 });

package/front_end/third_party/puppeteer/package/src/util/version.ts

@@ -6,5 +6,5 @@
 
 // If moved update release-please config
 // x-release-please-start-version
-export const packageVersion = '24.26.0';
+export const packageVersion = '24.26.1';
 // x-release-please-end

package/front_end/ui/components/dialogs/Dialog.ts

@@ -5,11 +5,11 @@
 
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as Platform from '../../../core/platform/platform.js';
-import * as WindowBoundsService from '../../../services/window_bounds/window_bounds.js';
 import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
 import * as RenderCoordinator from '../../../ui/components/render_coordinator/render_coordinator.js';
 import * as Lit from '../../../ui/lit/lit.js';
 import * as VisualLogging from '../../../ui/visual_logging/visual_logging.js';
+import * as UI from '../../legacy/legacy.js';
 import * as Buttons from '../buttons/buttons.js';
 
 import dialogStyles from './dialog.css.js';
@@ -77,10 +77,6 @@ interface DialogData {
    */
   dialogShownCallback: (() => unknown)|null;
 
-  /**
-   * Optional. Service that provides the window dimensions used for positioning the Dialog.
-   */
-  windowBoundsService: WindowBoundsService.WindowBoundsService.WindowBoundsService;
   /**
    * Whether the dialog is closed when the 'Escape' key is pressed. When true, the event is
    * propagation is stopped.
@@ -132,7 +128,6 @@ export class Dialog extends HTMLElement {
     horizontalAlignment: DialogHorizontalAlignment.CENTER,
     getConnectorCustomXPosition: null,
     dialogShownCallback: null,
-    windowBoundsService: WindowBoundsService.WindowBoundsService.WindowBoundsServiceImpl.instance(),
     closeOnESC: true,
     closeOnScroll: true,
     closeButton: false,
@@ -161,7 +156,7 @@ export class Dialog extends HTMLElement {
     this.#forceDialogCloseInDevToolsBound();
   });
   readonly #dialogResizeObserver = new ResizeObserver(this.#updateDialogBounds.bind(this));
-  #devToolsBoundingElement = this.windowBoundsService.getDevToolsBoundingElement();
+  #devToolsBoundingElement = UI.UIUtils.getDevToolsBoundingElement();
 
   // We bind here because we have to listen to keydowns on the entire window,
   // not on the Dialog element itself. This is because if the user has the
@@ -204,16 +199,6 @@ export class Dialog extends HTMLElement {
     this.#onStateChange();
   }
 
-  get windowBoundsService(): WindowBoundsService.WindowBoundsService.WindowBoundsService {
-    return this.#props.windowBoundsService;
-  }
-
-  set windowBoundsService(windowBoundsService: WindowBoundsService.WindowBoundsService.WindowBoundsService) {
-    this.#props.windowBoundsService = windowBoundsService;
-    this.#devToolsBoundingElement = this.windowBoundsService.getDevToolsBoundingElement();
-    this.#onStateChange();
-  }
-
   get bestVerticalPosition(): DialogVerticalPosition|null {
     return this.#bestVerticalPosition;
   }
@@ -733,6 +718,11 @@ export class Dialog extends HTMLElement {
     VisualLogging.setMappedParent(this.#getDialog(), this.parentElementOrShadowHost() as HTMLElement);
     // clang-format on
   }
+
+  setBoundingElementForTesting(element: HTMLElement): void {
+    this.#devToolsBoundingElement = element;
+    this.#onStateChange();
+  }
 }
 
 customElements.define('devtools-dialog', Dialog);

package/front_end/ui/components/docs/style_property_editor/masonry.html

@@ -0,0 +1,21 @@
+<!--
+  Copyright 2025 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>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1" />
+  <title>Basic Masonry Editor example</title>
+  <style>
+    .container {
+      font-size: 12px;
+    }
+  </style>
+</head>
+<body>
+  <div id="container">
+  </div>
+  <script type="module" src="./masonry.js"></script>
+</body>

package/front_end/ui/components/docs/style_property_editor/masonry.ts

@@ -0,0 +1,50 @@
+// Copyright 2025 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 Elements from '../../../../panels/elements/components/components.js';
+import * as FrontendHelpers from '../../../../testing/EnvironmentHelpers.js';
+import * as ComponentHelpers from '../../helpers/helpers.js';
+
+await ComponentHelpers.ComponentServerSetup.setup();
+await FrontendHelpers.initializeGlobalVars();
+
+const component = new Elements.StylePropertyEditor.MasonryEditor();
+
+document.getElementById('container')?.appendChild(component);
+
+const computedProperties = new Map([
+  ['align-content', 'initial'],
+  ['justify-content', 'normal'],
+  ['align-items', 'normal'],
+  ['justify-items', 'normal'],
+]);
+
+const originalComputedProperties = new Map(computedProperties);
+
+const authoredProperties = new Map([
+  ['justify-content', 'normal'],
+]);
+
+component.data = {
+  computedProperties,
+  authoredProperties,
+};
+
+component.addEventListener('propertyselected', (event: Elements.StylePropertyEditor.PropertySelectedEvent) => {
+  authoredProperties.set(event.data.name, event.data.value);
+  computedProperties.set(event.data.name, event.data.value);
+  component.data = {
+    computedProperties,
+    authoredProperties,
+  };
+});
+
+component.addEventListener('propertydeselected', (event: Elements.StylePropertyEditor.PropertyDeselectedEvent) => {
+  authoredProperties.delete(event.data.name);
+  computedProperties.set(event.data.name, originalComputedProperties.get(event.data.name) as string);
+  component.data = {
+    computedProperties,
+    authoredProperties,
+  };
+});

package/front_end/ui/components/text_editor/TextEditor.ts

@@ -3,8 +3,8 @@
 // found in the LICENSE file.
 
 import * as Common from '../../../core/common/common.js';
-import * as WindowBoundsService from '../../../services/window_bounds/window_bounds.js';
 import * as CodeMirror from '../../../third_party/codemirror.next/codemirror.next.js';
+import * as UI from '../../legacy/legacy.js';
 import * as ThemeSupport from '../../legacy/theme_support/theme_support.js';
 import * as CodeHighlighter from '../code_highlighter/code_highlighter.js';
 
@@ -166,8 +166,7 @@ export class TextEditor extends HTMLElement {
   }
 
   #startObservingResize(): void {
-    const devtoolsElement =
-        WindowBoundsService.WindowBoundsService.WindowBoundsServiceImpl.instance().getDevToolsBoundingElement();
+    const devtoolsElement = UI.UIUtils.getDevToolsBoundingElement();
     if (devtoolsElement) {
       this.#devtoolsResizeObserver.observe(devtoolsElement);
     }

package/front_end/ui/components/text_editor/config.ts

@@ -7,7 +7,6 @@ import * as Common from '../../../core/common/common.js';
 import type * as Host from '../../../core/host/host.js';
 import * as i18n from '../../../core/i18n/i18n.js';
 import * as TextUtils from '../../../models/text_utils/text_utils.js';
-import * as WindowBoundsService from '../../../services/window_bounds/window_bounds.js';
 import * as CM from '../../../third_party/codemirror.next/codemirror.next.js';
 import * as UI from '../../legacy/legacy.js';
 import * as VisualLogging from '../../visual_logging/visual_logging.js';
@@ -343,8 +342,7 @@ let sideBarElement: HTMLElement|null = null;
 
 function getTooltipSpace(): DOMRect {
   if (!sideBarElement) {
-    sideBarElement =
-        WindowBoundsService.WindowBoundsService.WindowBoundsServiceImpl.instance().getDevToolsBoundingElement();
+    sideBarElement = UI.UIUtils.getDevToolsBoundingElement();
   }
   return sideBarElement.getBoundingClientRect();
 }

package/front_end/ui/legacy/UIUtils.ts

@@ -56,6 +56,7 @@ import confirmDialogStyles from './confirmDialog.css.js';
 import {Dialog} from './Dialog.js';
 import {GlassPane, PointerEventsBehavior, SizeBehavior} from './GlassPane.js';
 import inspectorCommonStyles from './inspectorCommon.css.js';
+import {InspectorView} from './InspectorView.js';
 import {KeyboardShortcut, Keys} from './KeyboardShortcut.js';
 import smallBubbleStyles from './smallBubble.css.js';
 import {Tooltip} from './Tooltip.js';
@@ -2348,3 +2349,7 @@ export function copyTextToClipboard(text: string, alert?: string): void {
     ARIAUtils.LiveAnnouncer.alert(alert);
   }
 }
+
+export function getDevToolsBoundingElement(): HTMLElement {
+  return InspectorView.maybeGetInspectorViewInstance()?.element || document.body;
+}

package/front_end/ui/legacy/components/inline_editor/CSSAngle.ts

@@ -99,7 +99,7 @@ export class CSSAngle extends HTMLElement {
       this.angleElement = this.querySelector<HTMLElement>('.css-angle');
     }
     if (!this.swatchElement) {
-      this.swatchElement = this.querySelector<HTMLElement>('devtools-css-angle-swatch');
+      this.swatchElement = this.querySelector('devtools-css-angle-swatch');
     }
     if (!this.angleElement || !this.swatchElement) {
       return;

package/front_end/ui/legacy/components/perf_ui/BrickBreaker.ts

@@ -4,7 +4,7 @@
 /* eslint-disable @devtools/no-imperative-dom-api */
 
 import * as i18n from '../../../../core/i18n/i18n.js';
-import * as WindowBounds from '../../../../services/window_bounds/window_bounds.js';
+import * as UI from '../../legacy.js';
 import * as ThemeSupport from '../../theme_support/theme_support.js';
 
 import type {FlameChart} from './FlameChart.js';
@@ -124,7 +124,7 @@ export class BrickBreaker extends HTMLElement {
   #keyPressHandlerBound = this.#keyPressHandler.bind(this);
   #closeGameBound = this.#closeGame.bind(this);
   #mouseMoveHandlerBound = this.#mouseMoveHandler.bind(this);
-  #boundingElement = WindowBounds.WindowBoundsService.WindowBoundsServiceImpl.instance().getDevToolsBoundingElement();
+  #boundingElement = UI.UIUtils.getDevToolsBoundingElement();
   // Value by which we moved the game up relative to the viewport
   #gameViewportOffset = 0;
   #running = false;

package/front_end/ui/legacy/components/perf_ui/Font.ts

@@ -3,8 +3,6 @@
 // found in the LICENSE file.
 import * as Host from '../../../../core/host/host.js';
 
-let fontFamily: string|null = null;
-
 /**
  * Because we run our UI in a couple of contexts (actual app & test
  * environments) and on multiple platforms, the font is not consistent, so this
@@ -19,18 +17,7 @@ let fontFamily: string|null = null;
  * to ensure that the screenshot tests are consistent.
  **/
 export function getFontFamilyForCanvas(): string {
-  if (fontFamily) {
-    return fontFamily;
-  }
-
-  const bodyStyles = getComputedStyle(document.body);
-  if (bodyStyles.fontFamily) {
-    fontFamily = bodyStyles.fontFamily;
-  } else {
-    fontFamily = Host.Platform.fontFamily();
-  }
-
-  return fontFamily;
+  return Host.Platform.fontFamily();
 }
 
 export const DEFAULT_FONT_SIZE = '11px';

package/front_end/ui/visual_logging/KnownContextValues.ts

@@ -356,11 +356,13 @@ export const knownContextValues = new Set([
   'ai_assistance',
   'align-content',
   'align-content-center',
+  'align-content-end',
   'align-content-flex-end',
   'align-content-flex-start',
   'align-content-space-around',
   'align-content-space-between',
   'align-content-space-evenly',
+  'align-content-start',
   'align-content-stretch',
   'align-items',
   'align-items-baseline',
@@ -1994,6 +1996,7 @@ export const knownContextValues = new Set([
   'justify-content-space-between',
   'justify-content-space-evenly',
   'justify-content-start',
+  'justify-content-stretch',
   'justify-items',
   'justify-items-center',
   'justify-items-end',

package/inspector_overlay/testing/InspectorOverlayHelpers.ts

@@ -217,11 +217,7 @@ export function drawGridLineNamesAndAssertLabels(
 
   for (const expected of expectedLabels) {
     const foundLabel = foundLabels.find(({textContent}) => textContent === expected.textContent);
-
-    if (!foundLabel) {
-      assert.fail(`Expected line name label with text content ${expected.textContent} not found`);
-      return;
-    }
+    assert.exists(foundLabel, `Expected line name label with text content ${expected.textContent} not found`);
 
     if (expected.type === 'column' && typeof expected.x !== 'undefined') {
       assert.closeTo(
@@ -256,11 +252,7 @@ export function drawGridAreaNamesAndAssertLabels(
   });
   for (const expected of expectedLabels) {
     const foundLabel = foundLabels.find(({textContent}) => textContent === expected.textContent);
-
-    if (!foundLabel) {
-      assert.fail(`Expected area label with text content ${expected.textContent} not found`);
-      return;
-    }
+    assert.exists(foundLabel, `Expected area label with text content ${expected.textContent} not found`);
 
     if (typeof expected.left !== 'undefined') {
       assert.strictEqual(

package/package.json

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

package/front_end/services/window_bounds/WindowBoundsService.ts

@@ -1,27 +0,0 @@
-// Copyright 2021 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 Legacy from '../../ui/legacy/legacy.js';
-
-export interface WindowBoundsService {
-  getDevToolsBoundingElement(): HTMLElement;
-}
-
-let windowBoundsServiceImplInstance: WindowBoundsServiceImpl;
-export class WindowBoundsServiceImpl implements WindowBoundsService {
-  static instance(opts: {
-    forceNew: boolean|null,
-  } = {forceNew: null}): WindowBoundsServiceImpl {
-    const {forceNew} = opts;
-    if (!windowBoundsServiceImplInstance || forceNew) {
-      windowBoundsServiceImplInstance = new WindowBoundsServiceImpl();
-    }
-
-    return windowBoundsServiceImplInstance;
-  }
-
-  getDevToolsBoundingElement(): HTMLElement {
-    return Legacy.InspectorView.InspectorView.maybeGetInspectorViewInstance()?.element || document.body;
-  }
-}

package/front_end/services/window_bounds/window_bounds.ts

@@ -1,9 +0,0 @@
-// Copyright 2021 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 WindowBoundsService from './WindowBoundsService.js';
-
-export {
-  WindowBoundsService,
-};