chrome-devtools-frontend 1.0.1380117 → 1.0.1386602

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

@@ -46,6 +46,10 @@ export class CdpHTTPRequest extends HTTPRequest {
     return this.#client;
   }
 
+  override set client(newClient: CDPSession) {
+    this.#client = newClient;
+  }
+
   constructor(
     client: CDPSession,
     frame: Frame | null,

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

@@ -5,7 +5,6 @@
  */
 import type {Protocol} from 'devtools-protocol';
 
-import type {CDPSession} from '../api/CDPSession.js';
 import type {Frame} from '../api/Frame.js';
 import {HTTPResponse, type RemoteAddress} from '../api/HTTPResponse.js';
 import {ProtocolError} from '../common/Errors.js';
@@ -19,7 +18,6 @@ import type {CdpHTTPRequest} from './HTTPRequest.js';
  * @internal
  */
 export class CdpHTTPResponse extends HTTPResponse {
-  #client: CDPSession;
   #request: CdpHTTPRequest;
   #contentPromise: Promise<Uint8Array> | null = null;
   #bodyLoadedDeferred = Deferred.create<void, Error>();
@@ -34,13 +32,11 @@ export class CdpHTTPResponse extends HTTPResponse {
   #timing: Protocol.Network.ResourceTiming | null;
 
   constructor(
-    client: CDPSession,
     request: CdpHTTPRequest,
     responsePayload: Protocol.Network.Response,
     extraInfo: Protocol.Network.ResponseReceivedExtraInfoEvent | null,
   ) {
     super();
-    this.#client = client;
     this.#request = request;
 
     this.#remoteAddress = {
@@ -128,7 +124,9 @@ export class CdpHTTPResponse extends HTTPResponse {
         .valueOrThrow()
         .then(async () => {
           try {
-            const response = await this.#client.send(
+            // Use CDPSession from corresponding request to retrieve body, as it's client
+            // might have been updated (e.g. for an adopted OOPIF).
+            const response = await this.#request.client.send(
               'Network.getResponseBody',
               {
                 requestId: this.#request.id,

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

@@ -514,17 +514,12 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
   }
 
   #handleRequestRedirect(
-    client: CDPSession,
+    _client: CDPSession,
     request: CdpHTTPRequest,
     responsePayload: Protocol.Network.Response,
     extraInfo: Protocol.Network.ResponseReceivedExtraInfoEvent | null,
   ): void {
-    const response = new CdpHTTPResponse(
-      client,
-      request,
-      responsePayload,
-      extraInfo,
-    );
+    const response = new CdpHTTPResponse(request, responsePayload, extraInfo);
     request._response = response;
     request._redirectChain.push(request);
     response._resolveBody(
@@ -536,7 +531,7 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
   }
 
   #emitResponseEvent(
-    client: CDPSession,
+    _client: CDPSession,
     responseReceived: Protocol.Network.ResponseReceivedEvent,
     extraInfo: Protocol.Network.ResponseReceivedExtraInfoEvent | null,
   ): void {
@@ -568,7 +563,6 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
     }
 
     const response = new CdpHTTPResponse(
-      client,
       request,
       responseReceived.response,
       extraInfo,
@@ -627,10 +621,10 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
         event,
       );
       if (queuedEvents.loadingFinishedEvent) {
-        this.#emitLoadingFinished(queuedEvents.loadingFinishedEvent);
+        this.#emitLoadingFinished(client, queuedEvents.loadingFinishedEvent);
       }
       if (queuedEvents.loadingFailedEvent) {
-        this.#emitLoadingFailed(queuedEvents.loadingFailedEvent);
+        this.#emitLoadingFailed(client, queuedEvents.loadingFailedEvent);
       }
       return;
     }
@@ -654,7 +648,7 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
   }
 
   #onLoadingFinished(
-    _client: CDPSession,
+    client: CDPSession,
     event: Protocol.Network.LoadingFinishedEvent,
   ): void {
     // If the response event for this request is still waiting on a
@@ -665,11 +659,14 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
     if (queuedEvents) {
       queuedEvents.loadingFinishedEvent = event;
     } else {
-      this.#emitLoadingFinished(event);
+      this.#emitLoadingFinished(client, event);
     }
   }
 
-  #emitLoadingFinished(event: Protocol.Network.LoadingFinishedEvent): void {
+  #emitLoadingFinished(
+    client: CDPSession,
+    event: Protocol.Network.LoadingFinishedEvent,
+  ): void {
     const request = this.#networkEventManager.getRequest(event.requestId);
     // For certain requestIds we never receive requestWillBeSent event.
     // @see https://crbug.com/750469
@@ -677,6 +674,8 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
       return;
     }
 
+    this.#maybeReassignOOPIFRequestClient(client, request);
+
     // Under certain conditions we never get the Network.responseReceived
     // event from protocol. @see https://crbug.com/883475
     if (request.response()) {
@@ -687,7 +686,7 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
   }
 
   #onLoadingFailed(
-    _client: CDPSession,
+    client: CDPSession,
     event: Protocol.Network.LoadingFailedEvent,
   ): void {
     // If the response event for this request is still waiting on a
@@ -698,17 +697,21 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
     if (queuedEvents) {
       queuedEvents.loadingFailedEvent = event;
     } else {
-      this.#emitLoadingFailed(event);
+      this.#emitLoadingFailed(client, event);
     }
   }
 
-  #emitLoadingFailed(event: Protocol.Network.LoadingFailedEvent): void {
+  #emitLoadingFailed(
+    client: CDPSession,
+    event: Protocol.Network.LoadingFailedEvent,
+  ): void {
     const request = this.#networkEventManager.getRequest(event.requestId);
     // For certain requestIds we never receive requestWillBeSent event.
     // @see https://crbug.com/750469
     if (!request) {
       return;
     }
+    this.#maybeReassignOOPIFRequestClient(client, request);
     request._failureText = event.errorText;
     const response = request.response();
     if (response) {
@@ -717,4 +720,18 @@ export class NetworkManager extends EventEmitter<NetworkManagerEvents> {
     this.#forgetRequest(request, true);
     this.emit(NetworkManagerEvent.RequestFailed, request);
   }
+
+  #maybeReassignOOPIFRequestClient(
+    client: CDPSession,
+    request: CdpHTTPRequest,
+  ): void {
+    // Document requests for OOPIFs start in the parent frame but are adopted by their
+    // child frame, meaning their loadingFinished and loadingFailed events are fired on
+    // the child session. In this case we reassign the request CDPSession to ensure all
+    // subsequent actions use the correct session (e.g. retrieving response body in
+    // HTTPResponse).
+    if (client !== request.client && request.isNavigationRequest()) {
+      request.client = client;
+    }
+  }
 }

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

@@ -552,6 +552,10 @@ export class CdpPage extends Page {
     return this._timeoutSettings.timeout();
   }
 
+  override getDefaultNavigationTimeout(): number {
+    return this._timeoutSettings.navigationTimeout();
+  }
+
   override async queryObjects<Prototype>(
     prototypeHandle: JSHandle<Prototype>,
   ): Promise<JSHandle<Prototype[]>> {

package/front_end/third_party/puppeteer/package/src/common/ConnectOptions.ts

@@ -12,6 +12,7 @@ import type {
 } from '../api/Browser.js';
 
 import type {ConnectionTransport} from './ConnectionTransport.js';
+import type {DownloadBehavior} from './DownloadBehavior.js';
 import type {Viewport} from './Viewport.js';
 
 /**
@@ -54,6 +55,10 @@ export interface BrowserConnectOptions {
    * @defaultValue '\{width: 800, height: 600\}'
    */
   defaultViewport?: Viewport | null;
+  /**
+   * Sets the download behavior for the context.
+   */
+  downloadBehavior?: DownloadBehavior;
   /**
    * Slows down Puppeteer operations by the specified amount of milliseconds to
    * aid debugging.

package/front_end/third_party/puppeteer/package/src/common/DownloadBehavior.ts

@@ -0,0 +1,31 @@
+/**
+ * @license
+ * Copyright 2024 Google Inc.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @public
+ */
+export type DownloadPolicy = 'deny' | 'allow' | 'allowAndName' | 'default';
+
+/**
+ * @public
+ */
+export interface DownloadBehavior {
+  /**
+   * Whether to allow all or deny all download requests, or use default behavior if
+   * available.
+   *
+   * @remarks
+   * Setting this to `allowAndName` will name all files according to their download guids.
+   */
+  policy: DownloadPolicy;
+  /**
+   * The default path to save downloaded files to.
+   *
+   * @remarks
+   * Setting this is required if behavior is set to `allow` or `allowAndName`.
+   */
+  downloadPath?: string;
+}

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

@@ -39,3 +39,4 @@ export * from './util.js';
 export type * from './Viewport.js';
 export * from './WaitTask.js';
 export * from './XPathQueryHandler.js';
+export type * from './DownloadBehavior.js';

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

@@ -1,4 +1,4 @@
 /**
  * @internal
  */
-export const packageVersion = '23.7.1';
+export const packageVersion = '23.9.0';

package/front_end/third_party/puppeteer/package/src/node/BrowserLauncher.ts

@@ -84,6 +84,7 @@ export abstract class BrowserLauncher {
       handleSIGHUP = true,
       acceptInsecureCerts = false,
       defaultViewport = DEFAULT_VIEWPORT,
+      downloadBehavior,
       slowMo = 0,
       timeout = 30000,
       waitForInitialPage = true,
@@ -206,6 +207,7 @@ export abstract class BrowserLauncher {
             [],
             acceptInsecureCerts,
             defaultViewport,
+            downloadBehavior,
             browserProcess.nodeProcess,
             browserCloseCallback,
             options.targetFilter,

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

@@ -8,7 +8,7 @@
  * @internal
  */
 export const PUPPETEER_REVISIONS = Object.freeze({
-  chrome: '130.0.6723.116',
-  'chrome-headless-shell': '130.0.6723.116',
-  firefox: 'stable_132.0.1',
+  chrome: '131.0.6778.85',
+  'chrome-headless-shell': '131.0.6778.85',
+  firefox: 'stable_132.0.2',
 });

package/front_end/third_party/puppeteer/puppeteer-tsconfig.json

@@ -104,6 +104,7 @@
     "package/lib/esm/puppeteer/common/CustomQueryHandler.js",
     "package/lib/esm/puppeteer/common/Debug.js",
     "package/lib/esm/puppeteer/common/Device.js",
+    "package/lib/esm/puppeteer/common/DownloadBehavior.js",
     "package/lib/esm/puppeteer/common/Errors.js",
     "package/lib/esm/puppeteer/common/EventEmitter.js",
     "package/lib/esm/puppeteer/common/FileChooser.js",

package/front_end/ui/components/data_grid/DataGridControllerIntegrator.ts

@@ -35,7 +35,10 @@ export class DataGridControllerIntegrator extends UI.Widget.VBox {
     return this.#data;
   }
 
-  update(data: Readonly<DataGridControllerData>): void {
+  override update(data?: Readonly<DataGridControllerData>): void {
+    if (!data) {
+      return;
+    }
     this.#data = data;
     // Setting of `dataGrid.data` is compute heavy because of the
     // filtering logic. Thus, we're debouncing calls to the setter.

package/front_end/ui/components/dialogs/ButtonDialog.test.ts

@@ -0,0 +1,78 @@
+// Copyright 2024 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as Helpers from '../../../testing/DOMHelpers.js';  // eslint-disable-line rulesdir/es_modules_import
+import * as Buttons from '../buttons/buttons.js';
+import * as Coordinator from '../render_coordinator/render_coordinator.js';
+
+import * as Dialogs from './dialogs.js';
+
+const coordinator = Coordinator.RenderCoordinator.RenderCoordinator.instance();
+
+describe('ButtonDialog', () => {
+  async function getButtonDialog(fieldToTest?: Partial<Dialogs.ButtonDialog.ButtonDialogData>) {
+    const defaultMinimumButtonDialogData: Dialogs.ButtonDialog.ButtonDialogData = {
+      openOnRender: false,
+      iconName: 'help',
+      variant: Buttons.Button.Variant.TOOLBAR,
+      dialogTitle: '',
+    };
+    const buttonDialog = new Dialogs.ButtonDialog.ButtonDialog();
+    buttonDialog.data = Object.assign(defaultMinimumButtonDialogData, fieldToTest);
+
+    Helpers.renderElementIntoDOM(buttonDialog);
+    await coordinator.done();
+
+    return buttonDialog;
+  }
+
+  function getButtonFromButtonDialog(buttonDialog: Dialogs.ButtonDialog.ButtonDialog): Buttons.Button.Button {
+    assert.isNotNull(buttonDialog.shadowRoot);
+    const button = buttonDialog.shadowRoot.querySelector('devtools-button');
+    if (!button) {
+      assert.fail('devtools-button not found');
+    }
+    assert.instanceOf(button, HTMLElement);
+    return button;
+  }
+
+  function getDialogFromButtonDialog(buttonDialog: Dialogs.ButtonDialog.ButtonDialog): Dialogs.Dialog.Dialog {
+    assert.isNotNull(buttonDialog.shadowRoot);
+    const dialog = buttonDialog.shadowRoot.querySelector('devtools-dialog');
+    if (!dialog) {
+      assert.fail('devtools-dialog not found');
+    }
+    assert.instanceOf(dialog, HTMLElement);
+    return dialog;
+  }
+
+  it('should display dialog on initial render when provided prop', async () => {
+    const buttonDialog = await getButtonDialog({
+      openOnRender: true,
+    });
+    const dialog = getDialogFromButtonDialog(buttonDialog);
+
+    assert.isTrue(dialog.hasAttribute('open'));
+  });
+
+  it('should not display dialog on initial render by default', async () => {
+    const buttonDialog = await getButtonDialog({
+      openOnRender: false,
+    });
+    const dialog = getDialogFromButtonDialog(buttonDialog);
+
+    assert.isFalse(dialog.hasAttribute('open'));
+  });
+
+  it('Opens if button is clicked', async () => {
+    const buttonDialog = await getButtonDialog({});
+    const dialog = getDialogFromButtonDialog(buttonDialog);
+    assert.isFalse(dialog.hasAttribute('open'));
+
+    const button = getButtonFromButtonDialog(buttonDialog);
+    button.click();
+    await coordinator.done();
+    assert.isTrue(dialog.hasAttribute('open'));
+  });
+});

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

@@ -0,0 +1,131 @@
+// Copyright 2024 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import type * as Buttons from '../../../ui/components/buttons/buttons.js';
+import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
+import * as LitHtml from '../../../ui/lit-html/lit-html.js';
+
+import buttonDialogStyles from './buttonDialog.css.js';
+import {
+  type ClickOutsideDialogEvent,
+  type Dialog as DialogElement,
+  DialogHorizontalAlignment,
+  DialogVerticalPosition,
+} from './Dialog.js';
+
+const {html} = LitHtml;
+
+export interface ButtonDialogData {
+  openOnRender?: boolean;
+  jslogContext?: string;
+  // The below are parts of ButtonData. See comments of ButtonData.
+  iconName: string;
+  variant: Buttons.Button.Variant.PRIMARY_TOOLBAR|Buttons.Button.Variant.TOOLBAR|Buttons.Button.Variant.ICON;
+  iconTitle?: string;
+  // The below are parts of DialogData. See comments of DialogData.
+  position?: DialogVerticalPosition;
+  horizontalAlignment?: DialogHorizontalAlignment;
+  closeOnESC?: boolean;
+  closeOnScroll?: boolean;
+  closeButton?: boolean;
+  dialogTitle: string;
+}
+
+export class ButtonDialog extends HTMLElement {
+  readonly #shadow = this.attachShadow({mode: 'open'});
+  readonly #renderBound = this.#render.bind(this);
+
+  #dialog: DialogElement|null = null;
+  #showButton: Buttons.Button.Button|null = null;
+  #data: ButtonDialogData|null = null;
+
+  connectedCallback(): void {
+    this.#shadow.adoptedStyleSheets = [buttonDialogStyles];
+  }
+
+  set data(data: ButtonDialogData) {
+    this.#data = data;
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#renderBound);
+  }
+
+  #showDialog(): void {
+    if (!this.#dialog) {
+      throw new Error('Dialog not found');
+    }
+    void this.#dialog.setDialogVisible(true);
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#renderBound);
+  }
+
+  #closeDialog(evt?: ClickOutsideDialogEvent): void {
+    if (!this.#dialog) {
+      throw new Error('Dialog not found');
+    }
+    void this.#dialog.setDialogVisible(false);
+    if (evt) {
+      evt.stopImmediatePropagation();
+    }
+    void ComponentHelpers.ScheduledRender.scheduleRender(this, this.#renderBound);
+  }
+
+  #render(): void {
+    if (!this.#data) {
+      throw new Error('ButtonDialog.data is not set');
+    }
+    if (!ComponentHelpers.ScheduledRender.isScheduledRender(this)) {
+      throw new Error('Button dialog render was not scheduled');
+    }
+
+    // clang-format off
+    LitHtml.render(
+      html`
+      <devtools-button
+        @click=${this.#showDialog}
+        on-render=${ComponentHelpers.Directives.nodeRenderedCallback(node => {
+          this.#showButton = node as Buttons.Button.Button;
+        })}
+        .data=${{
+          variant: this.#data.variant,
+          iconName: this.#data.iconName,
+          title: this.#data.iconTitle,
+          jslogContext: this.#data.jslogContext,
+        } as Buttons.Button.ButtonData}
+      ></devtools-button>
+      <devtools-dialog
+        @clickoutsidedialog=${this.#closeDialog}
+        .origin=${() => {
+          if (!this.#showButton) {
+            throw new Error('Button not found');
+          }
+          return this.#showButton;
+        }}
+        .position=${this.#data.position ?? DialogVerticalPosition.BOTTOM}
+        .horizontalAlignment=${this.#data.horizontalAlignment ?? DialogHorizontalAlignment.RIGHT}
+        .closeOnESC=${this.#data.closeOnESC ?? false}
+        .closeOnScroll=${this.#data.closeOnScroll ?? false}
+        .closeButton=${this.#data.closeButton ?? false}
+        .dialogTitle=${this.#data.dialogTitle}
+        .jslogContext=${this.#data.jslogContext ?? ''}
+        on-render=${ComponentHelpers.Directives.nodeRenderedCallback(node => {
+          this.#dialog = node as DialogElement;
+        })}
+      >
+        <slot></slot>
+      </devtools-dialog>
+      `,
+      this.#shadow, {host: this});
+    // clang-format on
+
+    if (this.#data.openOnRender) {
+      this.#showDialog();
+      this.#data.openOnRender = false;
+    }
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'devtools-button-dialog': ButtonDialog;
+  }
+}
+customElements.define('devtools-button-dialog', ButtonDialog);

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

@@ -5,6 +5,7 @@
 import * as Platform from '../../../core/platform/platform.js';
 import type * as WindowBoundsService from '../../../services/window_bounds/window_bounds.js';
 import * as Helpers from '../../../testing/DOMHelpers.js';  // eslint-disable-line rulesdir/es_modules_import
+import {describeWithLocale} from '../../../testing/EnvironmentHelpers.js';
 import * as Coordinator from '../render_coordinator/render_coordinator.js';
 
 import * as Dialogs from './dialogs.js';
@@ -552,6 +553,48 @@ describe('Dialog', () => {
       }
     });
   });
+
+  describeWithLocale('rendering', () => {
+    it('do not render dialog header line if title is empty and there is no close button', async () => {
+      const dialog = new Dialogs.Dialog.Dialog();
+      dialog.closeButton = false;
+      dialog.dialogTitle = '';
+      Helpers.renderElementIntoDOM(dialog);
+      await coordinator.done();
+
+      assert.isNotNull(dialog.shadowRoot);
+      const dialogHeader = dialog.shadowRoot.querySelector('.dialog-header');
+      assert.notExists(dialogHeader);
+    });
+
+    it('should render a close button in the dialog if closeButton is true', async () => {
+      const dialog = new Dialogs.Dialog.Dialog();
+      dialog.closeButton = true;
+      Helpers.renderElementIntoDOM(dialog);
+      await coordinator.done();
+
+      assert.isNotNull(dialog.shadowRoot);
+      const dialogHeader = dialog.shadowRoot.querySelector('.dialog-header');
+      assert.exists(dialogHeader);
+      const closeButton = dialogHeader.querySelector('devtools-button');
+      assert.exists(closeButton);
+    });
+
+    it('should render dialog title if it is not empty', async () => {
+      const dialogTitle = 'Button dialog example';
+      const dialog = new Dialogs.Dialog.Dialog();
+      dialog.dialogTitle = dialogTitle;
+      Helpers.renderElementIntoDOM(dialog);
+      await coordinator.done();
+
+      assert.isNotNull(dialog.shadowRoot);
+      const dialogHeader = dialog.shadowRoot.querySelector('.dialog-header');
+      assert.exists(dialogHeader);
+      const dialogTitleElement = dialogHeader.querySelector('.dialog-header-text');
+      assert.exists(dialogTitleElement);
+      assert.strictEqual(dialogTitleElement.textContent, dialogTitle);
+    });
+  });
 });
 
 describe('closing the dialog with click', () => {