chrome-devtools-frontend 1.0.1545096 → 1.0.1547571

package/.stylelintrc.json

@@ -1,8 +1,12 @@
 {
   "extends": "stylelint-config-standard",
-  "plugins": ["./scripts/stylelint_rules/lib/use_theme_colors.mjs"],
+  "plugins": [
+    "./scripts/stylelint_rules/lib/use_theme_colors.mjs",
+    "./scripts/stylelint_rules/lib/check_highlight_scope.mjs"
+  ],
   "rules": {
     "plugin/use_theme_colors": true,
+    "plugin/check_highlight_scope": true,
     "alpha-value-notation": "percentage",
     "color-function-notation": "modern",
     "hue-degree-notation": "angle",

package/docs/contributing/infrastructure.md

@@ -217,12 +217,12 @@ Below is a detailed description of what happens in such a build:
   - It does a `bot_update` of its own
   - Generates the GN files (`gn` step)
   - Compiles (`compile`) the project
-  - Reads the e2e_non_hosted test lists
+  - Reads the e2e test lists
   - Creates a CAS archive with project and the compilation output
   - Outputs the `compilator_properties`
 - Once the compilator is done we read the `compilator_properties` to find
   - the `cas_digest` to be used when triggering tests on swarming
-  - the `e2e_non_hosted_test_list` for sharding the e2e tests execution
+  - the `e2e_test_list` for sharding the e2e tests execution
 - Write the e2e test list at the location where building would have written it
 - The default test run phase starts at `Run tests` step:
   - We trigger all tests on swarming in parallel (`Trigger Tests`) substep.

package/docs/styleguide/ux/styles.md

@@ -29,7 +29,7 @@ tokens**](https://crsrc.org/c/third_party/devtools-frontend/src/front_end/design
 name e.g. `--sys-color-error-container`). They reference palette tokens and
 incorporate light / dark mode switches and should be used in the code directly.
 You can view all system tokens in their light and dark variant when running the
-component server with `npm run components-server` under *Theme Colors*.
+component server on our [component documentation page](https://chromedevtools.github.io/devtools-frontend/#ThemeColors).
 
 [**Application
 tokens**](https://crsrc.org/c/third_party/devtools-frontend/src/front_end/application_tokens.css)

package/eslint.config.mjs

@@ -10,7 +10,7 @@ import jsdocPlugin from 'eslint-plugin-jsdoc';
 import litPlugin from 'eslint-plugin-lit';
 import mochaPlugin from 'eslint-plugin-mocha';
 import globals from 'globals';
-import { join } from 'path';
+import { join } from 'node:path';
 import typescriptEslint from 'typescript-eslint';
 
 import devToolsPlugin from './scripts/eslint_rules/plugin.mjs';
@@ -284,6 +284,7 @@ export default defineConfig([
           },
         },
       ],
+      'import/enforce-node-protocol-usage': ['error', 'always'],
       // Try to spot '// console.log()' left over from debugging
       '@devtools/no-commented-out-console': 'error',
       // Prevent imports being commented out rather than deleted.

package/front_end/Images/generate-css-vars.js

@@ -1,7 +1,7 @@
 // Copyright 2020 The Chromium Authors
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
-const path = require('path');
+const path = require('node:path');
 
 const {writeIfChanged} = require('../../scripts/build/ninja/write-if-changed.js');
 const [, , buildTimestamp, targetGenDir, targetName, ...imageSources] = process.argv;

package/front_end/Images/src/arrow-down.svg

@@ -1,3 +1,10 @@
 <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.25 3V14.125L7.062 11.938L6 13L10 17L14 13L12.938 11.938L10.75 14.125V3H9.25Z" fill="black"/>
+<g clip-path="url(#clip0_4041_3016)">
+<path d="M9.25 4H10.75V13.125L14.9375 8.9375L16 10L10 16L4 10L5.0625 8.9375L9.25 13.125V4Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_4041_3016">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
 </svg>

package/front_end/Images/src/arrow-up.svg

@@ -1,3 +1,10 @@
 <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.25 17V5.875L7.062 8.062L6 7L10 3L14 7L12.938 8.062L10.75 5.875V17H9.25Z" fill="black"/>
+<g clip-path="url(#clip0_4041_3013)">
+<path d="M9.25 16V6.875L5.0625 11.0625L4 10L10 4L16 10L14.9375 11.0625L10.75 6.875V16H9.25Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_4041_3013">
+<rect width="20" height="20" fill="white"/>
+</clipPath>
+</defs>
 </svg>

package/front_end/core/common/common.ts

@@ -33,7 +33,6 @@ import * as StringOutputStream from './StringOutputStream.js';
 import * as TextDictionary from './TextDictionary.js';
 import * as Throttler from './Throttler.js';
 import * as Trie from './Trie.js';
-import * as Worker from './Worker.js';
 
 /*
  * This is re-exported here because we moved UIString into platform from
@@ -73,5 +72,4 @@ export {
   TextDictionary,
   Throttler,
   Trie,
-  Worker,
 };

package/front_end/core/host/AidaClient.ts

@@ -733,7 +733,7 @@ export function convertToUserTierEnum(userTier: string|undefined): UserTier {
         return UserTier.PUBLIC;
     }
   }
-  return UserTier.BETA;
+  return UserTier.PUBLIC;
 }
 
 let hostConfigTrackerInstance: HostConfigTracker|undefined;

package/front_end/core/host/InspectorFrontendHostAPI.ts

@@ -549,7 +549,6 @@ export const enum EnumeratedHistogram {
   LighthouseModeRun = 'DevTools.LighthouseModeRun',
   LighthouseCategoryUsed = 'DevTools.LighthouseCategoryUsed',
   SwatchActivated = 'DevTools.SwatchActivated',
-  AnimationPlaybackRateChanged = 'DevTools.AnimationPlaybackRateChanged',
   BuiltInAiAvailability = 'DevTools.BuiltInAiAvailability',
   // LINT.ThenChange(/front_end/devtools_compatibility.js:EnumeratedHistogram)
 }

package/front_end/core/host/UserMetrics.ts

@@ -269,11 +269,6 @@ export class UserMetrics {
         EnumeratedHistogram.SwatchActivated, swatch, SwatchType.MAX_VALUE);
   }
 
-  animationPlaybackRateChanged(playbackRate: AnimationsPlaybackRate): void {
-    InspectorFrontendHostInstance.recordEnumeratedHistogram(
-        EnumeratedHistogram.AnimationPlaybackRateChanged, playbackRate, AnimationsPlaybackRate.MAX_VALUE);
-  }
-
   workspacesPopulated(wallClockTimeInMilliseconds: number): void {
     InspectorFrontendHostInstance.recordPerformanceHistogram(
         'DevTools.Workspaces.PopulateWallClocktime', wallClockTimeInMilliseconds);

package/front_end/core/i18n/collect-ui-strings.js

@@ -3,7 +3,7 @@
 // found in the LICENSE file.
 
 const glob = require('glob');
-const path = require('path');
+const path = require('node:path');
 const yargs = require('yargs');
 const {hideBin} = require('yargs/helpers');
 

package/front_end/core/i18n/generate-locales-js.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-const path = require('path');
+const path = require('node:path');
 const yargs = require('yargs');
 const {hideBin} = require('yargs/helpers');
 

package/front_end/core/platform/HostRuntime.ts

@@ -0,0 +1,25 @@
+// 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 type * as Api from './api/api.js';
+
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore 'process' is not available when type-checking against browser types.
+export const IS_NODE = typeof (process as unknown) !== 'undefined' && process.versions?.node !== null;
+
+export const IS_BROWSER =
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore 'window' is not available when type-checking against node.js types.
+    typeof window !== 'undefined' || (typeof self !== 'undefined' && typeof self.postMessage === 'function');
+
+export const HOST_RUNTIME = await (async(): Promise<Api.HostRuntime.HostRuntime> => {
+  if (IS_NODE) {
+    return (await import('./node/node.js')).HostRuntime.HOST_RUNTIME;
+  }
+  if (IS_BROWSER) {
+    return (await import('./browser/browser.js')).HostRuntime.HOST_RUNTIME;
+  }
+
+  throw new Error('Unknown runtime!');
+})();

package/front_end/core/platform/KeyboardUtilities.ts

@@ -29,10 +29,10 @@ export function keyIsArrowKey(key: string): key is ArrowKey {
   return ARROW_KEYS.has(key as ArrowKey);
 }
 
-export function isEscKey(event: KeyboardEvent): boolean {
+export function isEscKey(event: {readonly key: string}): boolean {
   return event.key === 'Escape';
 }
 
-export function isEnterOrSpaceKey(event: KeyboardEvent): boolean {
+export function isEnterOrSpaceKey(event: {readonly key: string}): boolean {
   return event.key === 'Enter' || event.key === ' ';
 }

package/front_end/core/platform/StringUtilities.ts

@@ -584,5 +584,5 @@ export const concatBase64 = function(lhs: string, rhs: string): string {
   }
   const lhsLeaveAsIs = lhs.substring(0, lhs.length - 4);
   const lhsToDecode = lhs.substring(lhs.length - 4);
-  return lhsLeaveAsIs + window.btoa(window.atob(lhsToDecode) + window.atob(rhs));
+  return lhsLeaveAsIs + globalThis.btoa(globalThis.atob(lhsToDecode) + globalThis.atob(rhs));
 };

package/front_end/core/platform/api/HostRuntime.ts

@@ -0,0 +1,45 @@
+// 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.
+
+/**
+ * Provides abstractions for host features that require different implementations depending
+ * on whether DevTools runs in the browser or Node.js
+ */
+export interface HostRuntime {
+  createWorker(url: string): Worker;
+  workerScope: WorkerScope;
+}
+
+/**
+ * Abstracts away the differences between browser web workers and Node.js worker threads.
+ */
+export interface Worker {
+  postMessage(message: unknown, transfer?: WorkerTransferable[]): void;
+
+  dispose(): void;
+  terminate(immediately?: boolean): void;
+
+  set onmessage(listener: (event: WorkerMessageEvent) => void);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  set onerror(listener: (event: any) => void);
+}
+
+/**
+ * Currently we ony transfer MessagePorts to workers, but it's possible to add
+ * more things (like ReadableStream) as long as it's present in all runtimes.
+ */
+export type WorkerTransferable = typeof MessagePort.prototype;
+
+/**
+ * Used by workers to communicate with their parent.
+ */
+export interface WorkerScope {
+  postMessage(message: unknown): void;
+  set onmessage(listener: (event: WorkerMessageEvent) => void);
+}
+
+export interface WorkerMessageEvent {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  readonly data: any;
+}

package/front_end/core/platform/api/api.ts

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

package/front_end/core/{common/Worker.ts → platform/browser/HostRuntime.ts}

@@ -1,18 +1,30 @@
-// Copyright 2014 The Chromium Authors
+// 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.
 
-export class WorkerWrapper {
+import type * as Api from '../api/api.js';
+
+class WebWorkerScope implements Api.HostRuntime.WorkerScope {
+  postMessage(message: unknown): void {
+    self.postMessage(message);
+  }
+
+  set onmessage(listener: (event: Api.HostRuntime.WorkerMessageEvent) => void) {
+    self.onmessage = listener;
+  }
+}
+
+class WebWorker implements Api.HostRuntime.Worker {
   readonly #workerPromise: Promise<Worker>;
   #disposed?: boolean;
   #rejectWorkerPromise?: (error: Error) => void;
 
-  private constructor(workerLocation: URL) {
+  constructor(workerLocation: string) {
     this.#workerPromise = new Promise((fulfill, reject) => {
       this.#rejectWorkerPromise = reject;
-      const worker = new Worker(workerLocation, {type: 'module'});
+      const worker = new Worker(new URL(workerLocation), {type: 'module'});
       worker.onerror = event => {
-        console.error(`Failed to load worker for ${workerLocation.href}:`, event);
+        console.error(`Failed to load worker for ${workerLocation}:`, event);
       };
       worker.onmessage = (event: MessageEvent<unknown>) => {
         console.assert(event.data === 'workerReady');
@@ -22,11 +34,7 @@ export class WorkerWrapper {
     });
   }
 
-  static fromURL(url: URL): WorkerWrapper {
-    return new WorkerWrapper(url);
-  }
-
-  postMessage(message: unknown, transfer?: Transferable[]): void {
+  postMessage(message: unknown, transfer?: Api.HostRuntime.WorkerTransferable[]): void {
     void this.#workerPromise.then(worker => {
       if (!this.#disposed) {
         worker.postMessage(message, transfer ?? []);
@@ -46,15 +54,22 @@ export class WorkerWrapper {
     this.dispose();
   }
 
-  set onmessage(listener: (event: MessageEvent) => void) {
+  set onmessage(listener: (event: Api.HostRuntime.WorkerMessageEvent) => void) {
     void this.#workerPromise.then(worker => {
       worker.onmessage = listener;
     });
   }
 
-  set onerror(listener: (event: Event) => void) {
+  set onerror(listener: (event: unknown) => void) {
     void this.#workerPromise.then(worker => {
       worker.onerror = listener;
     });
   }
 }
+
+export const HOST_RUNTIME: Api.HostRuntime.HostRuntime = {
+  createWorker(url: string): Api.HostRuntime.Worker {
+    return new WebWorker(url);
+  },
+  workerScope: new WebWorkerScope(),
+};

package/front_end/core/platform/browser/browser.ts

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

package/front_end/core/platform/node/HostRuntime.ts

@@ -0,0 +1,85 @@
+// 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 WorkerThreads from 'node:worker_threads';
+
+import type * as Api from '../api/api.js';
+
+class NodeWorkerScope implements Api.HostRuntime.WorkerScope {
+  postMessage(message: unknown): void {
+    WorkerThreads.parentPort?.postMessage(message);
+  }
+
+  set onmessage(listener: (event: Api.HostRuntime.WorkerMessageEvent) => void) {
+    WorkerThreads.parentPort?.on('message', data => {
+      listener({data});
+    });
+  }
+}
+
+class NodeWorker implements Api.HostRuntime.Worker {
+  readonly #workerPromise: Promise<WorkerThreads.Worker>;
+  #disposed = false;
+  #rejectWorkerPromise?: (error: Error) => void;
+
+  constructor(url: string) {
+    this.#workerPromise = new Promise((resolve, reject) => {
+      this.#rejectWorkerPromise = reject;
+      const worker = new WorkerThreads.Worker(new URL(url));
+      worker.once('message', (message: unknown) => {
+        if (message === 'workerReady') {
+          resolve(worker);
+        }
+      });
+      worker.on('error', reject);
+    });
+  }
+
+  postMessage(message: unknown): void {
+    void this.#workerPromise.then(worker => {
+      if (!this.#disposed) {
+        worker.postMessage(message);
+      }
+    });
+  }
+
+  dispose(): void {
+    this.#disposed = true;
+    void this.#workerPromise.then(worker => worker.terminate());
+  }
+
+  terminate(immediately?: boolean): void {
+    if (immediately) {
+      this.#rejectWorkerPromise?.(new Error('Worker terminated'));
+    }
+    this.dispose();
+  }
+
+  set onmessage(listener: (event: unknown) => void) {
+    void this.#workerPromise.then(worker => {
+      worker.on('message', data => {
+        if (!this.#disposed) {
+          listener({data});
+        }
+      });
+    });
+  }
+
+  set onerror(listener: (event: unknown) => void) {
+    void this.#workerPromise.then(worker => {
+      worker.on('error', (error: Error) => {
+        if (!this.#disposed) {
+          listener({type: 'error', ...error});
+        }
+      });
+    });
+  }
+}
+
+export const HOST_RUNTIME: Api.HostRuntime.HostRuntime = {
+  createWorker(url: string): Api.HostRuntime.Worker {
+    return new NodeWorker(url);
+  },
+  workerScope: new NodeWorkerScope(),
+};

package/front_end/core/platform/node/node.ts

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

package/front_end/core/platform/platform.ts

@@ -7,7 +7,7 @@ import * as Brand from './Brand.js';
 import * as Constructor from './Constructor.js';
 import * as DateUtilities from './DateUtilities.js';
 import * as DevToolsPath from './DevToolsPath.js';
-import * as DOMUtilities from './DOMUtilities.js';
+import * as HostRuntime from './HostRuntime.js';
 import * as KeyboardUtilities from './KeyboardUtilities.js';
 import * as MapUtilities from './MapUtilities.js';
 import * as MimeType from './MimeType.js';
@@ -31,7 +31,7 @@ export {
   Constructor,
   DateUtilities,
   DevToolsPath,
-  DOMUtilities,
+  HostRuntime,
   KeyboardUtilities,
   MapUtilities,
   MimeType,

package/front_end/core/sdk/AnimationModel.ts

@@ -375,7 +375,7 @@ export class AnimationModel extends SDKModel<EventTypes> {
     const animation = await AnimationImpl.parsePayload(this, payload);
     // Ignore Web Animations custom effects & groups.
     const keyframesRule = animation.source().keyframesRule();
-    if (animation.type() === 'WebAnimation' && keyframesRule && keyframesRule.keyframes().length === 0) {
+    if (animation.type() === 'WebAnimation' && keyframesRule?.keyframes().length === 0) {
       this.#pendingAnimations.delete(animation.id());
     } else {
       this.#animationsById.set(animation.id(), animation);

package/front_end/core/sdk/CSSModel.ts

@@ -190,7 +190,7 @@ export class CSSModel extends SDKModel<EventTypes> {
 
       const {styles} =
           await this.agent.invoke_setStyleTexts({edits: [{styleSheetId, range: range.serializeToObject(), text}]});
-      if (!styles || styles.length !== 1) {
+      if (styles?.length !== 1) {
         return false;
       }
 

package/front_end/core/sdk/CSSProperty.ts

@@ -292,7 +292,7 @@ export class CSSProperty extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
       }
       if (cssMetadata().isGridAreaDefiningProperty(propertyName)) {
         const rowResult = GridAreaRowRegex.exec(token);
-        if (rowResult && rowResult.index === 0 && !propertyText.trimEnd().endsWith(']')) {
+        if (rowResult?.index === 0 && !propertyText.trimEnd().endsWith(']')) {
           propertyText = propertyText.trimEnd() + '\n' + doubleIndent;
         }
       }

package/front_end/core/sdk/CSSPropertyParserMatchers.ts

@@ -1237,7 +1237,7 @@ export class AnchorFunctionMatcher extends matcherBase(AnchorFunctionMatch) {
     if (node.name === 'VariableName') {
       // Double-dashed anchor reference to be rendered with a link to its matching anchor.
       let parent = node.parent;
-      if (!parent || parent.name !== 'ArgList') {
+      if (parent?.name !== 'ArgList') {
         return null;
       }
       parent = parent.parent;

package/front_end/core/sdk/ConsoleModel.ts

@@ -432,7 +432,7 @@ export class ConsoleModel extends SDKModel<EventTypes> {
     const callFunctionResult =
         await globalObject.callFunction(saveVariable, [RemoteObject.toCallArgument(remoteObject)]);
     globalObject.release();
-    if (callFunctionResult.wasThrown || !callFunctionResult.object || callFunctionResult.object.type !== 'string') {
+    if (callFunctionResult.wasThrown || callFunctionResult.object?.type !== 'string') {
       failedToSave(callFunctionResult.object || null);
     } else {
       const text = (callFunctionResult.object.value as string);

package/front_end/core/sdk/Cookie.ts

@@ -278,7 +278,7 @@ export class Cookie {
     // extension cookie tests currently use the funtionality, and if we
     // ever decide to implement that it should be done by preventing
     // such cookies from being set.
-    if (!domain || domain[0] !== '.') {
+    if (domain?.[0] !== '.') {
       return false;
     }
 

package/front_end/core/sdk/DOMModel.ts

@@ -746,7 +746,7 @@ export class DOMNode {
       }
 
       const oldAttribute = oldAttributesMap.get(name);
-      if (!oldAttribute || oldAttribute.value !== value) {
+      if (oldAttribute?.value !== value) {
         attributesChanged = true;
       }
     }
@@ -1671,7 +1671,7 @@ export class DOMModel extends SDKModel<EventTypes> {
     }
     const {nodeIds} =
         await this.agent.invoke_getSearchResults({searchId: this.#searchId, fromIndex: index, toIndex: index + 1});
-    return nodeIds && nodeIds.length === 1 ? this.nodeForId(nodeIds[0]) : null;
+    return nodeIds?.length === 1 ? this.nodeForId(nodeIds[0]) : null;
   }
 
   private cancelSearch(): void {

package/front_end/core/sdk/DebuggerModel.ts

@@ -858,7 +858,7 @@ export class DebuggerModel extends SDKModel<EventTypes> {
       let functionName: RemoteObject|null = null;
       if (response.properties) {
         for (const prop of response.properties) {
-          if (prop.name === 'name' && prop.value && prop.value.type === 'string') {
+          if (prop.name === 'name' && prop.value?.type === 'string') {
             functionName = prop.value;
           }
         }

package/front_end/core/sdk/NetworkManager.ts

@@ -1502,6 +1502,12 @@ export class NetworkDispatcher implements ProtocolProxyApi.NetworkDispatcher {
     this.updateNetworkRequest(networkRequest);
   }
 
+  directUDPSocketJoinedMulticastGroup(_event: Protocol.Network.DirectUDPSocketJoinedMulticastGroupEvent): void {
+  }
+
+  directUDPSocketLeftMulticastGroup(_event: Protocol.Network.DirectUDPSocketLeftMulticastGroupEvent): void {
+  }
+
   trustTokenOperationDone(event: Protocol.Network.TrustTokenOperationDoneEvent): void {
     const request = this.#requestsById.get(event.requestId);
     if (!request) {

package/front_end/core/sdk/PreloadingModel.ts

@@ -47,7 +47,7 @@ export class PreloadingModel extends SDKModel<EventTypes> {
     void this.agent.invoke_enable();
 
     const targetInfo = target.targetInfo();
-    if (targetInfo !== undefined && targetInfo.subtype === 'prerender') {
+    if (targetInfo?.subtype === 'prerender') {
       this.lastPrimaryPageModel = TargetManager.instance().primaryPageTarget()?.model(PreloadingModel) || null;
     }
 

package/front_end/core/sdk/RemoteObject.ts

@@ -970,7 +970,7 @@ export class RemoteArray {
   }
 
   static objectAsArray(object: RemoteObject|null): RemoteArray {
-    if (!object || object.type !== 'object' || (object.subtype !== 'array' && object.subtype !== 'typedarray')) {
+    if (object?.type !== 'object' || (object.subtype !== 'array' && object.subtype !== 'typedarray')) {
       throw new Error('Object is empty or not an array');
     }
     return new RemoteArray(object);

package/front_end/core/sdk/ResourceTreeModel.ts

@@ -891,7 +891,7 @@ export class ResourceTreeFrame {
 
   addRequest(request: NetworkRequest): void {
     let resource = this.resourcesMap.get(request.url());
-    if (resource && resource.request === request) {
+    if (resource?.request === request) {
       // Already in the tree, we just got an extra update.
       return;
     }

package/front_end/core/sdk/Script.ts

@@ -27,7 +27,7 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-import type * as Platform from '../../core/platform/platform.js';
+import * as Platform from '../../core/platform/platform.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Common from '../common/common.js';
@@ -504,10 +504,10 @@ function frameIdForScript(script: Script): Protocol.Page.FrameId|null {
 export const sourceURLRegex = /^[\x20\t]*\/\/[@#] sourceURL=\s*(\S*?)\s*$/;
 
 export async function disassembleWasm(content: string): Promise<TextUtils.WasmDisassembly.WasmDisassembly> {
-  const worker = Common.Worker.WorkerWrapper.fromURL(
-      new URL('../../entrypoints/wasmparser_worker/wasmparser_worker-entrypoint.js', import.meta.url));
+  const worker = Platform.HostRuntime.HOST_RUNTIME.createWorker(
+      new URL('../../entrypoints/wasmparser_worker/wasmparser_worker-entrypoint.js', import.meta.url).toString());
   const promise = new Promise<TextUtils.WasmDisassembly.WasmDisassembly>((resolve, reject) => {
-    worker.onmessage = ({data}: MessageEvent) => {
+    worker.onmessage = ({data}) => {
       if ('method' in data) {
         switch (data.method) {
           case 'disassemble':