chrome-devtools-frontend 1.0.1695017 → 1.0.1696961

package/front_end/models/emulation/DeviceModeModel.ts

@@ -9,7 +9,6 @@ import * as Platform from '../../core/platform/platform.js';
 import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
-import * as Geometry from '../geometry/geometry.js';
 
 import {
   type Cutout,
@@ -27,46 +26,46 @@ const UIStrings = {
    * @description Error message shown on the Devices settings tab when the user enters an empty
    * width for a custom device.
    */
-  widthCannotBeEmpty: 'Width can’t be empty.',
+  widthCannotBeEmpty: 'Width can’t be empty',
   /**
    * @description Error message shown on the Devices settings tab when the user enters an invalid
    * width for a custom device.
    */
-  widthMustBeANumber: 'Width must be a number.',
+  widthMustBeANumber: 'Width must be a number',
   /**
    * @description Error message shown on the Devices settings tab when the user has entered a width
    * for a custom device that is too large.
    * @example {9999} PH1
    */
-  widthMustBeLessThanOrEqualToS: 'Width must be less than or equal to {PH1}.',
+  widthMustBeLessThanOrEqualToS: 'Width must be less than or equal to {PH1}',
   /**
    * @description Error message shown on the Devices settings tab when the user has entered a width
    * for a custom device that is too small.
    * @example {50} PH1
    */
-  widthMustBeGreaterThanOrEqualToS: 'Width must be greater than or equal to {PH1}.',
+  widthMustBeGreaterThanOrEqualToS: 'Width must be greater than or equal to {PH1}',
   /**
    * @description Error message shown on the Devices settings tab when the user enters an empty
    * height for a custom device.
    */
-  heightCannotBeEmpty: 'Height can’t be empty.',
+  heightCannotBeEmpty: 'Height can’t be empty',
   /**
    * @description Error message shown on the Devices settings tab when the user enters an invalid
    * height for a custom device.
    */
-  heightMustBeANumber: 'Height must be a number.',
+  heightMustBeANumber: 'Height must be a number',
   /**
    * @description Error message shown on the Devices settings tab when the user has entered a height
    * for a custom device that is too large.
    * @example {9999} PH1
    */
-  heightMustBeLessThanOrEqualToS: 'Height must be less than or equal to {PH1}.',
+  heightMustBeLessThanOrEqualToS: 'Height must be less than or equal to {PH1}',
   /**
    * @description Error message shown on the Devices settings tab when the user has entered a height
    * for a custom device that is too small.
    * @example {50} PH1
    */
-  heightMustBeGreaterThanOrEqualTo: 'Height must be greater than or equal to {PH1}.',
+  heightMustBeGreaterThanOrEqualTo: 'Height must be greater than or equal to {PH1}',
   /**
    * @description Error message shown on the Devices settings tab when the user enters an invalid
    * device pixel ratio for a custom device.
@@ -77,13 +76,13 @@ const UIStrings = {
    * pixel ratio for a custom device that is too large.
    * @example {10} PH1
    */
-  devicePixelRatioMustBeLessThanOr: 'Device pixel ratio must be less than or equal to {PH1}.',
+  devicePixelRatioMustBeLessThanOr: 'Device pixel ratio must be less than or equal to {PH1}',
   /**
    * @description Error message shown on the Devices settings tab when the user enters a device
    * pixel ratio for a custom device that is too small.
    * @example {0} PH1
    */
-  devicePixelRatioMustBeGreater: 'Device pixel ratio must be greater than or equal to {PH1}.',
+  devicePixelRatioMustBeGreater: 'Device pixel ratio must be greater than or equal to {PH1}',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('models/emulation/DeviceModeModel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -99,11 +98,11 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     SDK.TargetManager.SDKModelObserver<SDK.EmulationModel.EmulationModel> {
   #screenRect: Rect;
   #visiblePageRect: Rect;
-  #availableSize: Geometry.Size;
-  #preferredSize: Geometry.Size;
+  #availableSize: Platform.Size;
+  #preferredSize: Platform.Size;
   #initialized: boolean;
   #autoFitScaleOnInitialize: boolean;
-  #appliedDeviceSize: Geometry.Size;
+  #appliedDeviceSize: Platform.Size;
   #appliedDeviceScaleFactor: number;
   #appliedUserAgentType: UA;
   readonly #scaleSetting: Common.Settings.Setting<number>;
@@ -126,7 +125,6 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   readonly #targetManager: SDK.TargetManager.TargetManager;
   readonly #settings: Common.Settings.Settings;
   readonly #multitargetNetworkManager: SDK.NetworkManager.MultitargetNetworkManager;
-  #lastScreenshotBlobUrl: string|null = null;
 
   constructor(
       targetManager: SDK.TargetManager.TargetManager,
@@ -139,12 +137,12 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     this.#multitargetNetworkManager = multitargetNetworkManager;
     this.#screenRect = new Rect(0, 0, 1, 1);
     this.#visiblePageRect = new Rect(0, 0, 1, 1);
-    this.#availableSize = new Geometry.Size(1, 1);
-    this.#preferredSize = new Geometry.Size(1, 1);
+    this.#availableSize = new Platform.Size(1, 1);
+    this.#preferredSize = new Platform.Size(1, 1);
     this.#initialized = false;
     this.#autoFitScaleOnInitialize = false;
-    this.#appliedDeviceSize = new Geometry.Size(1, 1);
-    this.#appliedDeviceScaleFactor = globalThis.devicePixelRatio;
+    this.#appliedDeviceSize = new Platform.Size(1, 1);
+    this.#appliedDeviceScaleFactor = Platform.HostRuntime.HOST_RUNTIME.getDevicePixelRatio();
     this.#appliedUserAgentType = UA.DESKTOP;
 
     this.#scaleSetting = this.#settings.createSetting('emulation.device-scale', 1);
@@ -316,7 +314,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     }
   }
 
-  setAvailableSize(availableSize: Geometry.Size, preferredSize: Geometry.Size): void {
+  setAvailableSize(availableSize: Platform.Size, preferredSize: Platform.Size): void {
     this.#availableSize = availableSize;
     this.#preferredSize = preferredSize;
     this.#initialized = true;
@@ -417,7 +415,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     return this.#fitScale;
   }
 
-  appliedDeviceSize(): Geometry.Size {
+  appliedDeviceSize(): Platform.Size {
     return this.#appliedDeviceSize;
   }
 
@@ -659,7 +657,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       } else {
         this.#appliedUserAgentType = this.#device.touch() ? UA.DESKTOP_TOUCH : UA.DESKTOP;
       }
-      this.applyDeviceMetrics(new Geometry.Size(orientation.width, orientation.height), this.#scaleSetting.get(),
+      this.applyDeviceMetrics(new Platform.Size(orientation.width, orientation.height), this.#scaleSetting.get(),
                               this.#device.deviceScaleFactor, mobile, this.getScreenOrientationType(),
                               resetPageScaleFactor);
       this.applyUserAgent(this.#device.userAgent, this.#device.userAgentMetadata);
@@ -682,7 +680,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
       const defaultDeviceScaleFactor = mobile ? defaultMobileScaleFactor : 0;
       this.#fitScale = this.calculateFitScale(this.#widthSetting.get(), this.#heightSetting.get());
       this.#appliedUserAgentType = this.#uaSetting.get();
-      this.applyDeviceMetrics(new Geometry.Size(screenWidth, screenHeight), this.#scaleSetting.get(),
+      this.applyDeviceMetrics(new Platform.Size(screenWidth, screenHeight), this.#scaleSetting.get(),
                               this.#deviceScaleFactorSetting.get() || defaultDeviceScaleFactor, mobile,
                               screenHeight >= screenWidth ? Protocol.Emulation.ScreenOrientationType.PortraitPrimary :
                                                             Protocol.Emulation.ScreenOrientationType.LandscapePrimary,
@@ -737,7 +735,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     this.#multitargetNetworkManager.setUserAgentOverride(userAgent, userAgent ? userAgentMetadata : null);
   }
 
-  private applyDeviceMetrics(screenSize: Geometry.Size, scale: number, deviceScaleFactor: number, mobile: boolean,
+  private applyDeviceMetrics(screenSize: Platform.Size, scale: number, deviceScaleFactor: number, mobile: boolean,
                              screenOrientation: Protocol.Emulation.ScreenOrientationType|null,
                              resetPageScaleFactor: boolean): void {
     screenSize.width = Math.max(1, Math.floor(screenSize.width));
@@ -752,7 +750,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
         screenOrientation === Protocol.Emulation.ScreenOrientationType.LandscapePrimary ? 90 : 0;
 
     this.#appliedDeviceSize = screenSize;
-    this.#appliedDeviceScaleFactor = deviceScaleFactor || window.devicePixelRatio;
+    this.#appliedDeviceScaleFactor = deviceScaleFactor || Platform.HostRuntime.HOST_RUNTIME.getDevicePixelRatio();
     this.#screenRect = new Rect(Math.max(0, (this.#availableSize.width - screenSize.width * scale) / 2), 0,
                                 screenSize.width * scale, screenSize.height * scale);
     this.#visiblePageRect = new Rect(
@@ -866,34 +864,37 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     }
   }
 
+  private getScreenshotFileName(): string {
+    const url = this.inspectedURL();
+    let fileName = '';
+    if (url) {
+      const withoutFragment = Platform.StringUtilities.removeURLFragment(url);
+      fileName = Platform.StringUtilities.trimURL(withoutFragment);
+    }
+
+    const device = this.device();
+    if (device && this.type() === Type.Device) {
+      fileName += `(${device.title})`;
+    }
+    return fileName;
+  }
+
   async captureScreenshot(): Promise<void> {
     const screenshot = await this.#captureScreenshot(false);
     if (screenshot === null) {
       return;
     }
 
-    const pageImage = new Image();
-    pageImage.src = 'data:image/png;base64,' + screenshot;
-    pageImage.onload = async () => {
-      const scale = pageImage.naturalWidth / this.screenRect().width;
-      const screenRect = this.screenRect().scale(scale);
-      const visiblePageRect = this.visiblePageRect().scale(scale);
-      const contentLeft = visiblePageRect.left;
-      const contentTop = visiblePageRect.top;
-
-      const canvas = new OffscreenCanvas(Math.floor(screenRect.width),
-                                         // Cap the height to not hit the GPU limit.
-                                         // https://crbug.com/1260828
-                                         Math.min((1 << 14), Math.floor(screenRect.height)));
-      const ctx = canvas.getContext('2d', {willReadFrequently: true});
-      if (!ctx) {
-        throw new Error('Could not get 2d context from canvas.');
-      }
-      ctx.imageSmoothingEnabled = false;
-
-      ctx.drawImage(pageImage, Math.floor(contentLeft), Math.floor(contentTop));
-      void this.saveScreenshot(canvas);
-    };
+    await Platform.HostRuntime.HOST_RUNTIME.saveScreenshot({
+      base64Png: screenshot,
+      fileName: this.getScreenshotFileName(),
+      clip: {
+        screenRectWidth: this.screenRect().width,
+        screenRectHeight: this.screenRect().height,
+        visiblePageRectLeft: this.visiblePageRect().left,
+        visiblePageRectTop: this.visiblePageRect().top,
+      },
+    });
   }
 
   async captureFullSizeScreenshot(): Promise<void> {
@@ -901,7 +902,7 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     if (screenshot === null) {
       return;
     }
-    return this.saveScreenshotBase64(screenshot);
+    await this.saveScreenshot(screenshot);
   }
 
   async captureAreaScreenshot(clip?: Protocol.Page.Viewport): Promise<void> {
@@ -909,69 +910,18 @@ export class DeviceModeModel extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     if (screenshot === null) {
       return;
     }
-    return this.saveScreenshotBase64(screenshot);
-  }
-
-  private saveScreenshotBase64(screenshot: string): void {
-    const pageImage = new Image();
-    pageImage.src = 'data:image/png;base64,' + screenshot;
-    pageImage.onload = () => {
-      const canvas = new OffscreenCanvas(pageImage.naturalWidth,
-                                         // Cap the height to not hit the GPU limit.
-                                         // https://crbug.com/1260828
-                                         Math.min((1 << 14), Math.floor(pageImage.naturalHeight)));
-      const ctx = canvas.getContext('2d', {willReadFrequently: true});
-      if (!ctx) {
-        throw new Error('Could not get 2d context for base64 screenshot.');
-      }
-      ctx.imageSmoothingEnabled = false;
-      ctx.drawImage(pageImage, 0, 0);
-      void this.saveScreenshot(canvas);
-    };
+    await this.saveScreenshot(screenshot);
   }
 
-  private paintImage(ctx: OffscreenCanvasRenderingContext2D|CanvasRenderingContext2D, src: string,
-                     rect: Rect): Promise<void> {
-    return new Promise(resolve => {
-      const image = new Image();
-      image.crossOrigin = 'Anonymous';
-      image.srcset = src;
-      image.onerror = () => resolve();
-      image.onload = () => {
-        ctx.drawImage(image, rect.left, rect.top, rect.width, rect.height);
-        resolve();
-      };
+  async saveScreenshot(screenshot: string): Promise<void> {
+    await Platform.HostRuntime.HOST_RUNTIME.saveScreenshot({
+      base64Png: screenshot,
+      fileName: this.getScreenshotFileName(),
     });
   }
 
-  async saveScreenshot(canvas: OffscreenCanvas): Promise<void> {
-    const url = this.inspectedURL();
-    let fileName = '';
-    if (url) {
-      const withoutFragment = Platform.StringUtilities.removeURLFragment(url);
-      fileName = Platform.StringUtilities.trimURL(withoutFragment);
-    }
-
-    const device = this.device();
-    if (device && this.type() === Type.Device) {
-      fileName += `(${device.title})`;
-    }
-    this.#revokeLastScreenshotBlobUrl();
-    /* eslint-disable-next-line @devtools/no-imperative-dom-api */
-    const link = document.createElement('a');
-    link.download = fileName + '.png';
-    const blob = await canvas.convertToBlob({type: 'image/png'});
-    const blobUrl = URL.createObjectURL(blob);
-    this.#lastScreenshotBlobUrl = blobUrl;
-    link.href = blobUrl;
-    link.click();
-  }
-
   #revokeLastScreenshotBlobUrl(): void {
-    if (this.#lastScreenshotBlobUrl) {
-      URL.revokeObjectURL(this.#lastScreenshotBlobUrl);
-      this.#lastScreenshotBlobUrl = null;
-    }
+    Platform.HostRuntime.HOST_RUNTIME.revokeLastScreenshotUrl();
   }
 
   private applyTouch(touchEnabled: boolean, mobile: boolean): void {

package/front_end/models/heap_snapshot/HeapSnapshotProxy.ts

@@ -154,7 +154,7 @@ export class HeapSnapshotWorkerProxy extends Common.ObjectWrapper.ObjectWrapper<
     }
   }
 
-  setupForSecondaryInit(port: MessagePort): Promise<void> {
+  setupForSecondaryInit(port: PlatformApi.HostRuntime.WorkerMessagePort): Promise<void> {
     const callId = this.nextCallId++;
     const done = new Promise<void>((resolve, reject) => {
       this.callbacks.set(callId, error => {

package/front_end/models/issues_manager/CookieIssue.ts

@@ -28,7 +28,7 @@ const UIStrings = {
   /**
    * @description Text to show in Console panel when a third-party cookie is blocked in Chrome.
    */
-  consoleTpcdErrorMessage: 'Third-party cookie blocked in Chrome due to Chrome flags or browser settings.',
+  consoleTpcdErrorMessage: 'Third-party cookie blocked in Chrome due to Chrome flags or browser settings',
 
 } as const;
 const str_ = i18n.i18n.registerUIStrings('models/issues_manager/CookieIssue.ts', UIStrings);

package/front_end/models/issues_manager/DeprecationIssue.ts

@@ -14,12 +14,12 @@ const UIStrings = {
   /**
    * @description This links to the Chrome feature status page when one exists.
    */
-  feature: 'Check the feature status page for more details.',
+  feature: 'Check the feature status page for more details',
   /**
    * @description This links to the Chromium Dash schedule when a milestone is set.
    * @example {100} milestone
    */
-  milestone: 'This change will go into effect with milestone {milestone}.',
+  milestone: 'This change will go into effect with milestone {milestone}',
   /**
    * @description Title of issue raised when a deprecated feature is used.
    */

package/front_end/models/javascript_metadata/NativeFunctions.ts

@@ -8490,7 +8490,7 @@ export const NativeFunctions: readonly NativeFunctionValue[] = [
   },
   {
     name: "executeTool",
-    signatures: [["tool","inputArguments","?options"]]
+    signatures: [["tool","?inputObject","?options"]]
   },
   {
     name: "TaskController",
@@ -8722,10 +8722,6 @@ export const NativeFunctions: readonly NativeFunctionValue[] = [
     name: "setReportEventDataForAutomaticBeacons",
     signatures: [["event"]]
   },
-  {
-    name: "FencedFrameConfig",
-    signatures: [["url"]]
-  },
   {
     name: "setSharedStorageContext",
     signatures: [["contextString"]]

package/front_end/models/live-metrics/LiveMetrics.ts

@@ -29,7 +29,7 @@ const UIStrings = {
   /**
    * @description Warning text indicating that the Largest Contentful Paint (LCP) performance metric was affected by the page loading in the background.
    */
-  lcpVisibilityWarning: 'LCP may be inflated because the page started loading in the background.',
+  lcpVisibilityWarning: 'LCP may be inflated because the page started loading in the background',
 } as const;
 
 const str_ = i18n.i18n.registerUIStrings('models/live-metrics/LiveMetrics.ts', UIStrings);

package/front_end/models/persistence/IsolatedFileSystem.ts

@@ -84,7 +84,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
     });
   }
 
-  static errorMessage(error: DOMError): string {
+  static errorMessage(error: DOMException|Error): string {
     return i18nString(UIStrings.fileSystemErrorS, {PH1: error.message});
   }
 
@@ -105,7 +105,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       entry.getMetadata(resolve, errorHandler);
     }
 
-    function errorHandler(error: DOMError): void {
+    function errorHandler(error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when getting file metadata \'' + path);
       resolve(null);
@@ -256,10 +256,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       resolve(true);
     }
 
-    /**
-     * TODO(jsbell): Update externs replacing DOMError with DOMException. https://crbug.com/496901
-     */
-    function errorHandler(this: IsolatedFileSystem, error: DOMError): void {
+    function errorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when deleting file \'' + (this.path() + '/' + path) + '\'');
       resolve(false);
@@ -281,10 +278,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       resolve(true);
     }
 
-    /**
-     * TODO(jsbell): Update externs replacing DOMError with DOMException. https://crbug.com/496901
-     */
-    function errorHandler(this: IsolatedFileSystem, error: DOMError): void {
+    function errorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when deleting directory \'' + (this.path() + '/' + path) + '\'');
       resolve(false);
@@ -297,7 +291,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
         entry.file(resolve, errorHandler.bind(this));
       }, errorHandler.bind(this));
 
-      function errorHandler(this: IsolatedFileSystem, error: DOMError): void {
+      function errorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
         if (error.name === 'NotFoundError') {
           resolve(null);
           return;
@@ -336,9 +330,9 @@ export class IsolatedFileSystem extends PlatformFileSystem {
   override async setFileContent(path: Platform.DevToolsPath.EncodedPathString, content: string, isBase64: boolean):
       Promise<void> {
     Host.userMetrics.actionTaken(Host.UserMetrics.Action.FileSavedInWorkspace);
-    let resolve: (result: ProgressEvent<EventTarget>|undefined) => void;
-    const innerSetFileContent = (): Promise<ProgressEvent<EventTarget>|undefined> => {
-      const promise = new Promise<ProgressEvent<EventTarget>|undefined>(x => {
+    let resolve: () => void;
+    const innerSetFileContent = (): Promise<void> => {
+      const promise = new Promise<void>(x => {
         resolve = x;
       });
       this.domFileSystem.root.getFile(
@@ -354,7 +348,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
     }
 
     async function fileWriterCreated(this: IsolatedFileSystem, fileWriter: FileWriter): Promise<void> {
-      fileWriter.onerror = errorHandler.bind(this);
+      fileWriter.onerror = () => errorHandler.call(this, fileWriter.error);
       fileWriter.onwriteend = fileWritten;
       let blob: Blob;
       if (isBase64) {
@@ -365,16 +359,15 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       fileWriter.write(blob);
 
       function fileWritten(): void {
-        fileWriter.onwriteend = resolve;
+        fileWriter.onwriteend = () => resolve();
         fileWriter.truncate(blob.size);
       }
     }
 
-    function errorHandler(this: IsolatedFileSystem, error: DOMError|ProgressEvent<EventTarget>): void {
-      // @ts-expect-error TODO(crbug.com/1172300) Properly type this after jsdoc to ts migration
+    function errorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when setting content for file \'' + (this.path() + '/' + path) + '\'');
-      resolve(undefined);
+      resolve();
     }
   }
 
@@ -412,7 +405,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       callback(false);
     }
 
-    function newFileEntryLoadErrorHandler(this: IsolatedFileSystem, error: DOMError): void {
+    function newFileEntryLoadErrorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
       if (error.name !== 'NotFoundError') {
         callback(false);
         return;
@@ -424,7 +417,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       callback(true, entry.name);
     }
 
-    function errorHandler(this: IsolatedFileSystem, error: DOMError): void {
+    function errorHandler(this: IsolatedFileSystem, error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when renaming file \'' + (this.path() + '/' + path) + '\' to \'' + newName + '\'');
       callback(false);
@@ -450,7 +443,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
 
     dirReader.readEntries(innerCallback, errorHandler);
 
-    function errorHandler(error: DOMError): void {
+    function errorHandler(error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when reading directory \'' + dirEntry.fullPath + '\'');
       callback([]);
@@ -464,7 +457,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
       this.readDirectory(dirEntry, callback);
     }
 
-    function errorHandler(error: DOMError): void {
+    function errorHandler(error: DOMException|Error): void {
       const errorMessage = IsolatedFileSystem.errorMessage(error);
       console.error(errorMessage + ' when requesting entry \'' + path + '\'');
       callback([]);

package/front_end/models/trace/insights/DuplicatedJavaScript.ts

@@ -26,7 +26,7 @@ export const UIStrings = {
    * @description Description of an insight that identifies multiple copies of the same JavaScript sources, and recommends removing the duplication.
    */
   description:
-      'Remove large, [duplicate JavaScript modules](https://developer.chrome.com/docs/performance/insights/duplicated-javascript) from bundles to reduce unnecessary bytes consumed by network activity.',
+      'Remove large, [duplicate JavaScript modules](https://developer.chrome.com/docs/performance/insights/duplicated-javascript) from bundles to reduce unnecessary bytes consumed by network activity',
   /**
    * @description Label for a column in a data table; entries will be the locations of JavaScript or CSS code, e.g. the name of a JavaScript package or module.
    */

package/front_end/models/trace/insights/INPBreakdown.ts

@@ -20,7 +20,7 @@ export const UIStrings = {
    * @description Text to tell the user about the longest user interaction.
    */
   description:
-      'Start investigating [how to improve INP](https://developer.chrome.com/docs/performance/insights/inp-breakdown) by looking at the longest subpart.',
+      'Start investigating [how to improve INP](https://developer.chrome.com/docs/performance/insights/inp-breakdown) by looking at the longest subpart',
   /**
    * @description Title for the performance insight "INP breakdown", which shows a breakdown of INP by subparts / sections.
    */

package/front_end/models/trace/insights/ImageDelivery.ts

@@ -29,16 +29,16 @@ export const UIStrings = {
   /**
    * @description Message displayed in a chip explaining that an image file size is large for the # of pixels it has and recommends possible adjustments to improve the image size.
    */
-  useCompression: 'Increasing the image compression factor could improve this image’s download size.',
+  useCompression: 'Increasing the image compression factor could improve this image’s download size',
   /**
    * @description Message displayed in a chip explaining that an image file size is large for the # of pixels it has and recommends possible adjustments to improve the image size.
    */
   useModernFormat:
-      'Using a modern image format (WebP, AVIF) or increasing the image compression could improve this image’s download size.',
+      'Using a modern image format (WebP, AVIF) or increasing the image compression could improve this image’s download size',
   /**
    * @description Message displayed in a chip advising the user to use video formats instead of GIFs because videos generally have smaller file sizes.
    */
-  useVideoFormat: 'Using video formats instead of GIFs can improve the download size of animated content.',
+  useVideoFormat: 'Using video formats instead of GIFs can improve the download size of animated content',
   /**
    * @description Message displayed in a chip explaining that an image was displayed on the page with dimensions much smaller than the image file dimensions.
    * @example {1000x500} PH1

package/front_end/models/trace/insights/LCPDiscovery.ts

@@ -27,12 +27,12 @@ export const UIStrings = {
    * @description Description of an insight that provides details about the LCP metric, and the network requests necessary to load it.
    */
   description:
-      '[Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading.',
+      '[Optimize LCP](https://developer.chrome.com/docs/performance/insights/lcp-discovery) by making the LCP image discoverable from the HTML immediately, and avoiding lazy-loading',
   /**
    * @description Text to tell the user how long after the earliest discovery time their LCP element loaded.
    * @example {401ms} PH1
    */
-  lcpLoadDelay: 'LCP image loaded {PH1} after earliest start point.',
+  lcpLoadDelay: 'LCP image loaded {PH1} after earliest start point',
   /**
    * @description Text to tell the user that a fetchpriority property value of "high" is applied to the LCP request.
    */

package/front_end/models/trace/insights/NetworkDependencyTree.ts

@@ -31,12 +31,12 @@ export const UIStrings = {
    * @description Description of an insight that recommends avoiding chaining critical requests.
    */
   description:
-      '[Avoid chaining critical requests](https://developer.chrome.com/docs/performance/insights/network-dependency-tree) by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',
+      '[Avoid chaining critical requests](https://developer.chrome.com/docs/performance/insights/network-dependency-tree) by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load',
   /**
    * @description Description of the warning that recommends avoiding chaining critical requests.
    */
   warningDescription:
-      'Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load.',
+      'Avoid chaining critical requests by reducing the length of chains, reducing the download size of resources, or deferring the download of unnecessary resources to improve page load',
   /**
    * @description Text status indicating that there aren’t long chaining critical network requests.
    */
@@ -96,7 +96,7 @@ export const UIStrings = {
    * @description Description of the table that recommends preconnecting to the origins to save time. "preconnect" should not be translated.
    */
   estSavingTableDescription:
-      'Add [preconnect](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/) hints to your most important origins, but try to use no more than 4.',
+      'Add [preconnect](https://developer.chrome.com/docs/lighthouse/performance/uses-rel-preconnect/) hints to your most important origins, but try to use no more than 4',
   /**
    * @description Label for a column in a data table; entries will be the origin of a web resource.
    */

package/front_end/models/trace/insights/Viewport.ts

@@ -26,7 +26,7 @@ export const UIStrings = {
    * @description Text to tell the user how a viewport meta element can improve performance. \xa0 is a non-breaking space
    */
   description:
-      'Tap interactions may be [delayed by up to 300\xA0ms](https://developer.chrome.com/docs/performance/insights/viewport) if the viewport isn’t optimized for mobile.',
+      'Tap interactions may be [delayed by up to 300\xA0ms](https://developer.chrome.com/docs/performance/insights/viewport) if the viewport isn’t optimized for mobile',
   /**
    * @description Text for a label describing the portion of an interaction event that was delayed due to a bad mobile viewport.
    */

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

@@ -84,7 +84,7 @@ export interface CandyStripedTimeRange {
  */
 export interface TimespanBreakdownEntryBreakdown {
   bounds: TraceWindowMicro;
-  label: string|HTMLElement;
+  label: string|object;
   showDuration: boolean;
 }
 
@@ -126,7 +126,7 @@ export interface BottomInfoBar {
   // In DevTools, this infobar is a UI.Infobar.Infobar but we can't refer to
   // the type here.
   infobar: {
-    element: HTMLElement,
+    element: object,
     dispose: () => void,
   };
 }

package/front_end/panels/accessibility/AccessibilityNodeView.ts

@@ -59,7 +59,7 @@ const UIStrings = {
    * @description Reason in the Accessibility tab in the Elements panel.
    * @example {aria-hidden} PH1
    */
-  elementIsPlaceholder: 'Element is {PH1}.',
+  elementIsPlaceholder: 'Element is {PH1}',
   /**
    * @description Reason in the Accessibility tab in the Elements panel.
    * @example {aria-hidden} PH1
@@ -108,7 +108,7 @@ const UIStrings = {
    * (which are not translated). https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles
    * @example {role=link} PH1
    */
-  elementHasPlaceholder: 'Element has {PH1}.',
+  elementHasPlaceholder: 'Element has {PH1}',
   /**
    * @description Reason in the Accessibility tab in the Elements panel.
    */

package/front_end/panels/accessibility/AccessibilitySubPane.ts

@@ -4,7 +4,6 @@
 /* eslint-disable @devtools/no-imperative-dom-api */
 
 import type * as SDK from '../../core/sdk/sdk.js';
-// eslint-disable-next-line @devtools/es-modules-import
 import objectValueStyles from '../../ui/legacy/components/object_ui/objectValue.css.js';
 import * as UI from '../../ui/legacy/legacy.js';