npm - chrome-devtools-frontend - Versions diffs - 1.0.970539 → 1.0.971140 - Mend

chrome-devtools-frontend 1.0.970539 → 1.0.971140

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (35) hide show

package/config/gni/devtools_grd_files.gni CHANGED Viewed

@@ -59,6 +59,7 @@ grd_files_release_sources = [
   "front_end/Images/flex-nowrap-icon.svg",
   "front_end/Images/flex-wrap-icon.svg",
   "front_end/Images/help_outline.svg",
+  "front_end/Images/ic_changes.svg",
   "front_end/Images/ic_checkmark_16x16.svg",
   "front_end/Images/ic_command_go_to_line.svg",
   "front_end/Images/ic_command_go_to_symbol.svg",
@@ -569,6 +570,7 @@ grd_files_debug_sources = [
   "front_end/core/i18n/time-utilities.js",
   "front_end/core/platform/DevToolsPath.js",
   "front_end/core/platform/UIString.js",
+  "front_end/core/platform/UserVisibleError.js",
   "front_end/core/platform/array-utilities.js",
   "front_end/core/platform/date-utilities.js",
   "front_end/core/platform/dcheck.js",
@@ -1044,6 +1046,7 @@ grd_files_debug_sources = [
   "front_end/panels/lighthouse/LighthouseReportSelector.js",
   "front_end/panels/lighthouse/LighthouseReporterTypes.js",
   "front_end/panels/lighthouse/LighthouseStartView.js",
+  "front_end/panels/lighthouse/LighthouseStartViewFR.js",
   "front_end/panels/lighthouse/LighthouseStatusView.js",
   "front_end/panels/lighthouse/RadioSetting.js",
   "front_end/panels/lighthouse/lighthouseDialog.css.js",

package/config/gni/devtools_image_files.gni CHANGED Viewed

@@ -69,6 +69,7 @@ devtools_svg_sources = [
   "flex-nowrap-icon.svg",
   "flex-wrap-icon.svg",
   "help_outline.svg",
+  "ic_changes.svg",
   "ic_checkmark_16x16.svg",
   "ic_command_go_to_line.svg",
   "ic_command_go_to_symbol.svg",

package/front_end/Images/src/ic_changes.svg ADDED Viewed

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.75 16.75V6.74572L12.4599 3.25H5.25V16.75H15.75ZM13 2L17 6.25V17C17 17.5523 16.5523 18 16 18H5C4.44772 18 4 17.5523 4 17V3C4 2.44772 4.44772 2 5 2H13Z" fill="black"/>
+<path d="M11 6H10V8H8V9H10V11H11V9H13V8H11V6Z" fill="black"/>
+<path d="M13 13L13 14L8 14L8 13L13 13Z" fill="black"/>
+</svg>

package/front_end/core/common/ParsedURL.ts CHANGED Viewed

@@ -256,9 +256,9 @@ export class ParsedURL {
     return ParsedURL.urlRegexInstance;
   }
-  static extractPath(url: string): string {
+  static extractPath(url: string): Platform.DevToolsPath.EncodedPathString {
     const parsedURL = this.fromString(url);
-    return parsedURL ? parsedURL.path : '';
+    return (parsedURL ? parsedURL.path : '') as Platform.DevToolsPath.EncodedPathString;
   }
   static extractOrigin(url: string): string {

package/front_end/core/host/UserMetrics.ts CHANGED Viewed

@@ -586,7 +586,9 @@ export enum DevtoolsExperiments {
   'bfcacheDisplayTree' = 54,
   'stylesPaneCSSChanges' = 55,
   'headerOverrides' = 56,
-  'MaxValue' = 57,
+  'lighthousePanelFR' = 57,
+  // Increment this when new experiments are added.
+  'MaxValue' = 58,
 }
 /* eslint-enable @typescript-eslint/naming-convention */

package/front_end/core/i18n/locales/en-US.json CHANGED Viewed

@@ -4835,6 +4835,12 @@
   "panels/elements/StylesSidebarPane.ts | constructedStylesheet": {
     "message": "constructed stylesheet"
   },
+  "panels/elements/StylesSidebarPane.ts | copiedToClipboard": {
+    "message": "Copied to clipboard"
+  },
+  "panels/elements/StylesSidebarPane.ts | copyAllCSSChanges": {
+    "message": "Copy all the CSS changes"
+  },
   "panels/elements/StylesSidebarPane.ts | copyAllDeclarations": {
     "message": "Copy all declarations"
   },
@@ -5765,6 +5771,9 @@
   "panels/lighthouse/LighthouseController.ts | legacyNavigation": {
     "message": "Legacy navigation"
   },
+  "panels/lighthouse/LighthouseController.ts | lighthouseMode": {
+    "message": "Lighthouse mode"
+  },
   "panels/lighthouse/LighthouseController.ts | localStorage": {
     "message": "Local Storage"
   },
@@ -5774,6 +5783,9 @@
   "panels/lighthouse/LighthouseController.ts | multipleTabsAreBeingControlledBy": {
     "message": "Multiple tabs are being controlled by the same service worker. Close your other tabs on the same origin to audit this page."
   },
+  "panels/lighthouse/LighthouseController.ts | navigation": {
+    "message": "Navigation"
+  },
   "panels/lighthouse/LighthouseController.ts | performance": {
     "message": "Performance"
   },
@@ -5786,6 +5798,9 @@
   "panels/lighthouse/LighthouseController.ts | resetStorageLocalstorage": {
     "message": "Reset storage (cache, service workers, etc) before auditing. (Good for performance & PWA testing)"
   },
+  "panels/lighthouse/LighthouseController.ts | runLighthouseInMode": {
+    "message": "Run Lighthouse in navigation, timespan, or snapshot mode"
+  },
   "panels/lighthouse/LighthouseController.ts | seo": {
     "message": "SEO"
   },
@@ -5795,6 +5810,9 @@
   "panels/lighthouse/LighthouseController.ts | simulatedThrottling": {
     "message": "Simulated throttling"
   },
+  "panels/lighthouse/LighthouseController.ts | snapshot": {
+    "message": "Snapshot"
+  },
   "panels/lighthouse/LighthouseController.ts | thereMayBeStoredDataAffectingLoadingPlural": {
     "message": "There may be stored data affecting loading performance in these locations: {PH1}. Audit this page in an incognito window to prevent those resources from affecting your scores."
   },
@@ -5861,6 +5879,9 @@
   "panels/lighthouse/LighthouseStartView.ts | learnMore": {
     "message": "Learn more"
   },
+  "panels/lighthouse/LighthouseStartViewFR.ts | mode": {
+    "message": "Mode"
+  },
   "panels/lighthouse/LighthouseStatusView.ts | ahSorryWeRanIntoAnError": {
     "message": "Ah, sorry! We ran into an error."
   },

package/front_end/core/i18n/locales/en-XL.json CHANGED Viewed

@@ -4835,6 +4835,12 @@
   "panels/elements/StylesSidebarPane.ts | constructedStylesheet": {
     "message": "ĉón̂śt̂ŕûćt̂éd̂ śt̂ýl̂éŝh́êét̂"
   },
+  "panels/elements/StylesSidebarPane.ts | copiedToClipboard": {
+    "message": "Ĉóp̂íêd́ t̂ó ĉĺîṕb̂óâŕd̂"
+  },
+  "panels/elements/StylesSidebarPane.ts | copyAllCSSChanges": {
+    "message": "Ĉóp̂ý âĺl̂ t́ĥé ĈŚŜ ćĥán̂ǵêś"
+  },
   "panels/elements/StylesSidebarPane.ts | copyAllDeclarations": {
     "message": "Ĉóp̂ý âĺl̂ d́êćl̂ár̂át̂íôńŝ"
   },
@@ -5765,6 +5771,9 @@
   "panels/lighthouse/LighthouseController.ts | legacyNavigation": {
     "message": "L̂éĝáĉý n̂áv̂íĝát̂íôń"
   },
+  "panels/lighthouse/LighthouseController.ts | lighthouseMode": {
+    "message": "L̂íĝh́t̂h́ôúŝé m̂ód̂é"
+  },
   "panels/lighthouse/LighthouseController.ts | localStorage": {
     "message": "L̂óĉál̂ Śt̂ór̂áĝé"
   },
@@ -5774,6 +5783,9 @@
   "panels/lighthouse/LighthouseController.ts | multipleTabsAreBeingControlledBy": {
     "message": "M̂úl̂t́îṕl̂é t̂áb̂ś âŕê b́êín̂ǵ ĉón̂t́r̂ól̂ĺêd́ b̂ý t̂h́ê śâḿê service worker. Ćl̂óŝé ŷóûŕ ôt́ĥér̂ t́âb́ŝ ón̂ t́ĥé ŝám̂é ôŕîǵîń t̂ó âúd̂ít̂ t́ĥíŝ ṕâǵê."
   },
+  "panels/lighthouse/LighthouseController.ts | navigation": {
+    "message": "N̂áv̂íĝát̂íôń"
+  },
   "panels/lighthouse/LighthouseController.ts | performance": {
     "message": "P̂ér̂f́ôŕm̂án̂ćê"
   },
@@ -5786,6 +5798,9 @@
   "panels/lighthouse/LighthouseController.ts | resetStorageLocalstorage": {
     "message": "R̂éŝét̂ śt̂ór̂áĝé (cache, service workers, êt́ĉ) b́êf́ôŕê áûd́ît́îńĝ. (Ǵôód̂ f́ôŕ p̂ér̂f́ôŕm̂án̂ćê & PWA t́êśt̂ín̂ǵ)"
   },
+  "panels/lighthouse/LighthouseController.ts | runLighthouseInMode": {
+    "message": "R̂ún̂ Ĺîǵĥt́ĥóûśê ín̂ ńâv́îǵât́îón̂, t́îḿêśp̂án̂, ór̂ śn̂áp̂śĥót̂ ḿôd́ê"
+  },
   "panels/lighthouse/LighthouseController.ts | seo": {
     "message": "ŜÉÔ"
   },
@@ -5795,6 +5810,9 @@
   "panels/lighthouse/LighthouseController.ts | simulatedThrottling": {
     "message": "Ŝím̂úl̂át̂éd̂ t́ĥŕôt́t̂ĺîńĝ"
   },
+  "panels/lighthouse/LighthouseController.ts | snapshot": {
+    "message": "Ŝńâṕŝh́ôt́"
+  },
   "panels/lighthouse/LighthouseController.ts | thereMayBeStoredDataAffectingLoadingPlural": {
     "message": "T̂h́êŕê ḿâý b̂é ŝt́ôŕêd́ d̂át̂á âf́f̂éĉt́îńĝ ĺôád̂ín̂ǵ p̂ér̂f́ôŕm̂án̂ćê ín̂ t́ĥéŝé l̂óĉát̂íôńŝ: {PH1}. Áûd́ît́ t̂h́îś p̂áĝé îń âń îńĉóĝńît́ô ẃîńd̂óŵ t́ô ṕr̂év̂én̂t́ t̂h́ôśê ŕêśôúr̂ćêś f̂ŕôḿ âf́f̂éĉt́îńĝ ýôúr̂ śĉór̂éŝ."
   },
@@ -5861,6 +5879,9 @@
   "panels/lighthouse/LighthouseStartView.ts | learnMore": {
     "message": "L̂éâŕn̂ ḿôŕê"
   },
+  "panels/lighthouse/LighthouseStartViewFR.ts | mode": {
+    "message": "M̂ód̂é"
+  },
   "panels/lighthouse/LighthouseStatusView.ts | ahSorryWeRanIntoAnError": {
     "message": "Âh́, ŝór̂ŕŷ! Ẃê ŕâń îńt̂ó âń êŕr̂ór̂."
   },

package/front_end/core/platform/UserVisibleError.ts ADDED Viewed

@@ -0,0 +1,28 @@
+// Copyright 2021 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 {LocalizedString} from './UIString.js';
+/**
+ * Represents an error that might become visible to the user. Where errors
+ * might be surfaced to the user (such as by displaying the message to the
+ * console), this class should be used to enforce that the message is
+ * localized on the way in.
+ */
+export class UserVisibleError extends Error {
+  readonly message: LocalizedString;
+  constructor(message: LocalizedString) {
+    super(message);
+    this.message = message;
+  }
+}
+export function isUserVisibleError(error: unknown): error is UserVisibleError {
+  if (typeof error === 'object' && error !== null) {
+    return error instanceof UserVisibleError;
+  }
+  return false;
+}

package/front_end/core/platform/platform.ts CHANGED Viewed

@@ -38,6 +38,7 @@ import * as SetUtilities from './set-utilities.js';
 import * as StringUtilities from './string-utilities.js';
 import * as TypeScriptUtilities from './typescript-utilities.js';
 import * as UIString from './UIString.js';
+import * as UserVisibleError from './UserVisibleError.js';
 export {DCHECK} from './dcheck.js';
 /* `assertNotNull` also need to be exposed, as TypeScript does not
@@ -57,4 +58,5 @@ export {
   StringUtilities,
   TypeScriptUtilities,
   UIString,
+  UserVisibleError,
 };

package/front_end/core/sdk/ChildTargetManager.ts CHANGED Viewed

@@ -140,7 +140,6 @@ export class ChildTargetManager extends SDKModel<EventTypes> implements Protocol
     } else if (targetInfo.type === 'auction_worklet') {
       type = Type.AuctionWorklet;
     }
     const target = this.#targetManager.createTarget(
         targetInfo.targetId, targetName, type, this.#parentTarget, sessionId, undefined, undefined, targetInfo);
     target.setInspectedURL(this.#parentTarget.inspectedURL());

package/front_end/core/sdk/NetworkManager.ts CHANGED Viewed

@@ -412,6 +412,16 @@ export class NetworkDispatcher implements ProtocolProxyApi.NetworkDispatcher {
      * once it is created in `requestWillBeSent`.
      */
     this.#requestIdToTrustTokenEvent = new Map();
+    MultitargetNetworkManager.instance().addEventListener(
+        MultitargetNetworkManager.Events.RequestIntercepted, this.#markAsIntercepted.bind(this));
+  }
+  #markAsIntercepted(event: Common.EventTarget.EventTargetEvent<string>): void {
+    const request = this.requestForURL(event.data);
+    if (request) {
+      request.setWasIntercepted(true);
+    }
   }
   private headersMapToHeadersArray(headersMap: Protocol.Network.Headers): NameValue[] {
@@ -446,7 +456,7 @@ export class NetworkDispatcher implements ProtocolProxyApi.NetworkDispatcher {
     if (!networkRequest.statusText) {
       networkRequest.statusText = response.statusText;
     }
-    if (!networkRequest.hasExtraResponseInfo()) {
+    if (!networkRequest.hasExtraResponseInfo() || networkRequest.wasIntercepted()) {
       networkRequest.responseHeaders = this.headersMapToHeadersArray(response.headers);
     }
@@ -1401,6 +1411,8 @@ export class MultitargetNetworkManager extends Common.ObjectWrapper.ObjectWrappe
     for (const requestInterceptor of this.#urlsForRequestInterceptor.keysArray()) {
       await requestInterceptor(interceptedRequest);
       if (interceptedRequest.hasResponded()) {
+        this.dispatchEventToListeners(
+            MultitargetNetworkManager.Events.RequestIntercepted, interceptedRequest.request.url);
         return;
       }
     }
@@ -1467,6 +1479,7 @@ export namespace MultitargetNetworkManager {
     UserAgentChanged = 'UserAgentChanged',
     InterceptorsChanged = 'InterceptorsChanged',
     AcceptedEncodingsChanged = 'AcceptedEncodingsChanged',
+    RequestIntercepted = 'RequestIntercepted',
   }
   export type EventTypes = {
@@ -1475,6 +1488,7 @@ export namespace MultitargetNetworkManager {
     [Events.UserAgentChanged]: void,
     [Events.InterceptorsChanged]: void,
     [Events.AcceptedEncodingsChanged]: void,
+    [Events.RequestIntercepted]: string,
   };
 }

package/front_end/core/sdk/NetworkRequest.ts CHANGED Viewed

@@ -290,6 +290,7 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
   #parsedQueryParameters?: NameValue[];
   #contentDataProvider?: (() => Promise<ContentData>);
   #isSameSiteInternal: boolean|null;
+  #wasIntercepted: boolean;
   private constructor(
       requestId: string, backendRequestId: Protocol.Network.RequestId|undefined, url: string, documentURL: string,
@@ -363,6 +364,8 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
     this.localizedFailDescription = null;
     this.#isSameSiteInternal = null;
+    this.#wasIntercepted = false;
   }
   static create(
@@ -964,6 +967,14 @@ export class NetworkRequest extends Common.ObjectWrapper.ObjectWrapper<EventType
     return this.#responseHeaderValues[headerName];
   }
+  wasIntercepted(): boolean {
+    return this.#wasIntercepted;
+  }
+  setWasIntercepted(wasIntercepted: boolean): void {
+    this.#wasIntercepted = wasIntercepted;
+  }
   get responseCookies(): Cookie[] {
     if (!this.#responseCookiesInternal) {
       this.#responseCookiesInternal =

package/front_end/entrypoints/lighthouse_worker/LighthouseService.ts CHANGED Viewed

@@ -103,7 +103,7 @@ async function start(method: string, params: any): Promise<unknown> {
     const url = params.url;
     // Handle legacy Lighthouse runner path.
-    if (method === 'start') {
+    if (method === 'legacyNavigation') {
       // @ts-expect-error https://github.com/GoogleChrome/lighthouse/issues/11628
       const connection = self.setUpWorkerConnection(port);
       // @ts-expect-error https://github.com/GoogleChrome/lighthouse/issues/11628
@@ -115,14 +115,21 @@ async function start(method: string, params: any): Promise<unknown> {
     puppeteerConnection =
         await Puppeteer.PuppeteerConnection.getPuppeteerConnection(rawConnection, mainFrameId, mainTargetId);
+    if (method === 'snapshot') {
+      // @ts-expect-error https://github.com/GoogleChrome/lighthouse/issues/11628
+      return await self.runLighthouseSnapshot({
+        url,
+        config,
+        page: puppeteerConnection.page,
+      });
+    }
     // @ts-expect-error https://github.com/GoogleChrome/lighthouse/issues/11628
-    const result = await self.runLighthouseNavigation({
+    return await self.runLighthouseNavigation({
       url,
       config,
       page: puppeteerConnection.page,
     });
-    return result;
   } catch (err) {
     return ({
       fatal: true,
@@ -179,8 +186,10 @@ function notifyFrontendViaWorkerMessage(method: string, params: any): void {
 self.onmessage = async(event: MessageEvent): Promise<void> => {
   const messageFromFrontend = JSON.parse(event.data);
   switch (messageFromFrontend.method) {
-    case 'navigate':
-    case 'start': {
+    case 'navigation':
+    case 'timespan':
+    case 'snapshot':
+    case 'legacyNavigation': {
       const result = await start(messageFromFrontend.method, messageFromFrontend.params);
       self.postMessage(JSON.stringify({id: messageFromFrontend.id, result}));
       break;

package/front_end/entrypoints/main/MainImpl.ts CHANGED Viewed

@@ -376,6 +376,9 @@ export class MainImpl {
     Root.Runtime.experiments.register(
         Root.Runtime.ExperimentName.HEADER_OVERRIDES, 'Local overrides for response headers');
+    // New Lighthouse panel with timespan and snapshot mode
+    Root.Runtime.experiments.register('lighthousePanelFR', 'Use Lighthouse panel with timespan and snapshot modes');
     Root.Runtime.experiments.enableExperimentsByDefault([
       'sourceOrderViewer',
       'hideIssuesFeature',

package/front_end/models/bindings/CSSWorkspaceBinding.ts CHANGED Viewed

@@ -100,6 +100,27 @@ export class CSSWorkspaceBinding implements SDK.TargetManager.SDKModelObserver<S
     return locationPromise;
   }
+  propertyRawLocation(cssProperty: SDK.CSSProperty.CSSProperty, forName: boolean): SDK.CSSModel.CSSLocation|null {
+    const style = cssProperty.ownerStyle;
+    if (!style || style.type !== SDK.CSSStyleDeclaration.Type.Regular || !style.styleSheetId) {
+      return null;
+    }
+    const header = style.cssModel().styleSheetHeaderForId(style.styleSheetId);
+    if (!header) {
+      return null;
+    }
+    const range = forName ? cssProperty.nameRange() : cssProperty.valueRange();
+    if (!range) {
+      return null;
+    }
+    const lineNumber = range.startLine;
+    const columnNumber = range.startColumn;
+    return new SDK.CSSModel.CSSLocation(
+        header, header.lineNumberInSource(lineNumber), header.columnNumberInSource(lineNumber, columnNumber));
+  }
   propertyUILocation(cssProperty: SDK.CSSProperty.CSSProperty, forName: boolean): Workspace.UISourceCode.UILocation
       |null {
     const style = cssProperty.ownerStyle;

package/front_end/models/persistence/Automapping.ts CHANGED Viewed

@@ -323,7 +323,7 @@ export class Automapping {
     }
     if (networkPath.endsWith('/')) {
-      networkPath += 'index.html';
+      networkPath = networkPath + 'index.html' as Platform.DevToolsPath.EncodedPathString;
     }
     const similarFiles =

package/front_end/models/persistence/FileSystemWorkspaceBinding.ts CHANGED Viewed

@@ -59,9 +59,9 @@ export class FileSystemWorkspaceBinding {
     return fileSystemPath;
   }
-  static relativePath(uiSourceCode: Workspace.UISourceCode.UISourceCode): string[] {
+  static relativePath(uiSourceCode: Workspace.UISourceCode.UISourceCode): Platform.DevToolsPath.EncodedPathString[] {
     const baseURL = (uiSourceCode.project() as FileSystem).fileSystemBaseURL;
-    return uiSourceCode.url().substring(baseURL.length).split('/');
+    return uiSourceCode.url().substring(baseURL.length).split('/') as Platform.DevToolsPath.EncodedPathString[];
   }
   static tooltipForUISourceCode(uiSourceCode: Workspace.UISourceCode.UISourceCode): string {

package/front_end/panels/browser_debugger/categorizedBreakpointsSidebarPane.css CHANGED Viewed

@@ -17,7 +17,6 @@
 .tree-outline li {
   margin-left: 14px;
   user-select: text;
-  cursor: default;
 }
 .tree-outline li.parent {

package/front_end/panels/elements/ElementsPanel.ts CHANGED Viewed

@@ -35,6 +35,7 @@
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
+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 Extensions from '../../models/extensions/extensions.js';
@@ -1269,9 +1270,22 @@ export class DOMNodeRevealer implements Common.Revealer.Revealer {
     const panel = ElementsPanel.instance();
     panel.pendingNodeReveal = true;
-    return new Promise(revealPromise);
+    return (new Promise<void>(revealPromise)).catch((reason: Error) => {
+      let message: string;
+      if (Platform.UserVisibleError.isUserVisibleError(reason)) {
+        message = reason.message;
+      } else {
+        message = i18nString(UIStrings.nodeCannotBeFoundInTheCurrent);
+      }
-    function revealPromise(resolve: () => void, reject: (arg0: Error) => void): void {
+      Common.Console.Console.instance().warn(message);
+      // Blink tests expect an exception to be raised and unhandled here to detect that the node
+      // was actually not successfully viewed.
+      throw reason;
+    });
+    function revealPromise(
+        resolve: () => void, reject: (arg0: Platform.UserVisibleError.UserVisibleError) => void): void {
       if (node instanceof SDK.DOMModel.DOMNode) {
         onNodeResolved((node as SDK.DOMModel.DOMNode));
       } else if (node instanceof SDK.DOMModel.DeferredDOMNode) {
@@ -1281,10 +1295,12 @@ export class DOMNodeRevealer implements Common.Revealer.Revealer {
         if (domModel) {
           void domModel.pushObjectAsNodeToFrontend(node).then(checkRemoteObjectThenReveal);
         } else {
-          reject(new Error('Could not resolve a node to reveal.'));
+          const msg = i18nString(UIStrings.nodeCannotBeFoundInTheCurrent);
+          reject(new Platform.UserVisibleError.UserVisibleError(msg));
         }
       } else {
-        reject(new Error('Can\'t reveal a non-node.'));
+        const msg = i18nString(UIStrings.theRemoteObjectCouldNotBe);
+        reject(new Platform.UserVisibleError.UserVisibleError(msg));
         panel.pendingNodeReveal = false;
       }
@@ -1304,8 +1320,7 @@ export class DOMNodeRevealer implements Common.Revealer.Revealer {
         const isDocument = node instanceof SDK.DOMModel.DOMDocument;
         if (!isDocument && isDetached) {
           const msg = i18nString(UIStrings.nodeCannotBeFoundInTheCurrent);
-          Common.Console.Console.instance().warn(msg);
-          reject(new Error(msg));
+          reject(new Platform.UserVisibleError.UserVisibleError(msg));
           return;
         }
@@ -1313,14 +1328,14 @@ export class DOMNodeRevealer implements Common.Revealer.Revealer {
           void panel.revealAndSelectNode(resolvedNode, !omitFocus).then(resolve);
           return;
         }
-        reject(new Error('Could not resolve node to reveal.'));
+        const msg = i18nString(UIStrings.nodeCannotBeFoundInTheCurrent);
+        reject(new Platform.UserVisibleError.UserVisibleError(msg));
       }
       function checkRemoteObjectThenReveal(resolvedNode: SDK.DOMModel.DOMNode|null): void {
         if (!resolvedNode) {
           const msg = i18nString(UIStrings.theRemoteObjectCouldNotBe);
-          Common.Console.Console.instance().warn(msg);
-          reject(new Error(msg));
+          reject(new Platform.UserVisibleError.UserVisibleError(msg));
           return;
         }
         onNodeResolved(resolvedNode);
@@ -1329,8 +1344,7 @@ export class DOMNodeRevealer implements Common.Revealer.Revealer {
       function checkDeferredDOMNodeThenReveal(resolvedNode: SDK.DOMModel.DOMNode|null): void {
         if (!resolvedNode) {
           const msg = i18nString(UIStrings.theDeferredDomNodeCouldNotBe);
-          Common.Console.Console.instance().warn(msg);
-          reject(new Error(msg));
+          reject(new Platform.UserVisibleError.UserVisibleError(msg));
           return;
         }
         onNodeResolved(resolvedNode);

package/front_end/panels/elements/StylesSidebarPane.ts CHANGED Viewed

@@ -39,9 +39,11 @@ 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 Bindings from '../../models/bindings/bindings.js';
+import * as Formatter from '../../models/formatter/formatter.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as WorkspaceDiff from '../../models/workspace_diff/workspace_diff.js';
+import type * as Diff from '../../third_party/diff/diff.js';
 import * as DiffView from '../../ui/components/diff_view/diff_view.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
 import * as InlineEditor from '../../ui/legacy/components/inline_editor/inline_editor.js';
@@ -177,6 +179,14 @@ const UIStrings = {
   *@description Text that is announced by the screen reader when the user focuses on an input field for editing the name of a CSS selector in the Styles panel
   */
   cssSelector: '`CSS` selector',
+  /**
+  *@description Tooltip text that appears when hovering over the css changes button in the Styles Sidebar Pane of the Elements panel
+  */
+  copyAllCSSChanges: 'Copy all the CSS changes',
+  /**
+  *@description Tooltip text that appears after clicking on the copy CSS changes button
+  */
+  copiedToClipboard: 'Copied to clipboard',
 };
 const str_ = i18n.i18n.registerUIStrings('panels/elements/StylesSidebarPane.ts', UIStrings);
@@ -236,8 +246,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
   private readonly resizeThrottler: Common.Throttler.Throttler;
   private readonly imagePreviewPopover: ImagePreviewPopover;
   activeCSSAngle: InlineEditor.CSSAngle.CSSAngle|null;
-  #changedLinesByURLs: Map<string, Set<number>> = new Map();
-  #uiSourceCodeToDiffCallbacks: Map<Workspace.UISourceCode.UISourceCode, () => void> = new Map();
+  #urlToChangeTracker: Map<string, ChangeTracker> = new Map();
   static instance(): StylesSidebarPane {
     if (!_stylesSidebarPaneInstance) {
@@ -609,6 +618,9 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     await this.innerRebuildUpdate(matchedStyles);
     if (!this.initialUpdateCompleted) {
       this.initialUpdateCompleted = true;
+      if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)) {
+        this.appendToolbarItem(this.createCopyAllChangesButton());
+      }
       this.dispatchEventToListeners(Events.InitialUpdateCompleted);
     }
@@ -841,12 +853,14 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     const blocks = [new SectionBlock(null)];
     let sectionIdx = 0;
     let lastParentNode: SDK.DOMModel.DOMNode|null = null;
-    if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)) {
-      this.resetChangedLinesTracking();
-    }
+    const refreshedURLs = new Set<string>();
     for (const style of matchedStyles.nodeStyles()) {
       if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES) && style.parentRule) {
-        await this.trackChangedLines(style.parentRule.resourceURL());
+        const url = style.parentRule.resourceURL();
+        if (url && !refreshedURLs.has(url)) {
+          await this.trackURLForChanges(url);
+          refreshedURLs.add(url);
+        }
       }
       const parentNode = matchedStyles.isInherited(style) ? matchedStyles.nodeForStyle(style) : null;
@@ -1001,25 +1015,27 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     return sections;
   }
-  resetChangedLinesTracking(): void {
-    this.#changedLinesByURLs.clear();
-    for (const [uiSourceCode, callback] of this.#uiSourceCodeToDiffCallbacks) {
-      WorkspaceDiff.WorkspaceDiff.workspaceDiff().unsubscribeFromDiffChange(uiSourceCode, callback);
+  async trackURLForChanges(url: string): Promise<void> {
+    const currentTracker = this.#urlToChangeTracker.get(url);
+    if (currentTracker) {
+      WorkspaceDiff.WorkspaceDiff.workspaceDiff().unsubscribeFromDiffChange(
+          currentTracker.uiSourceCode, currentTracker.diffChangeCallback);
     }
-    this.#uiSourceCodeToDiffCallbacks.clear();
-  }
-  async trackChangedLines(url: string): Promise<void> {
-    if (!url || this.#changedLinesByURLs.has(url)) {
-      return;
-    }
+    // We get a refreshed uiSourceCode each time because the underlying instance may be recreated.
     const uiSourceCode = Workspace.Workspace.WorkspaceImpl.instance().uiSourceCodeForURL(url);
-    if (uiSourceCode) {
-      await this.refreshChangedLines(uiSourceCode);
-      const callback = this.refreshChangedLines.bind(this, uiSourceCode);
-      WorkspaceDiff.WorkspaceDiff.workspaceDiff().subscribeToDiffChange(uiSourceCode, callback);
-      this.#uiSourceCodeToDiffCallbacks.set(uiSourceCode, callback);
+    if (!uiSourceCode) {
+      return;
     }
+    const diffChangeCallback = this.refreshChangedLines.bind(this, uiSourceCode);
+    WorkspaceDiff.WorkspaceDiff.workspaceDiff().subscribeToDiffChange(uiSourceCode, diffChangeCallback);
+    const newTracker = {
+      uiSourceCode,
+      changedLines: new Set<number>(),
+      diffChangeCallback,
+    };
+    this.#urlToChangeTracker.set(url, newTracker);
+    await this.refreshChangedLines(newTracker.uiSourceCode);
   }
   isPropertyChanged(property: SDK.CSSProperty.CSSProperty): boolean {
@@ -1027,7 +1043,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     if (!url) {
       return false;
     }
-    const changedLines = this.#changedLinesByURLs.get(url);
+    const changedLines = this.#urlToChangeTracker.get(url)?.changedLines;
     if (!changedLines) {
       return false;
     }
@@ -1040,6 +1056,10 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
   }
   private async refreshChangedLines(uiSourceCode: Workspace.UISourceCode.UISourceCode): Promise<void> {
+    const changeTracker = this.#urlToChangeTracker.get(uiSourceCode.url());
+    if (!changeTracker) {
+      return;
+    }
     const diff = await WorkspaceDiff.WorkspaceDiff.workspaceDiff().requestDiff(uiSourceCode, {shouldFormatDiff: true});
     const changedLines = new Set<number>();
     if (diff && diff.length > 0) {
@@ -1050,7 +1070,24 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
         }
       }
     }
-    this.#changedLinesByURLs.set(uiSourceCode.url(), changedLines);
+    changeTracker.changedLines = changedLines;
+  }
+  private async getFormattedChanges(): Promise<string> {
+    let allChanges = '';
+    for (const [url, {uiSourceCode}] of this.#urlToChangeTracker) {
+      const diff =
+          await WorkspaceDiff.WorkspaceDiff.workspaceDiff().requestDiff(uiSourceCode, {shouldFormatDiff: true});
+      if (!diff || diff.length < 2) {
+        continue;
+      }
+      const changes = await formatCSSChangesFromDiff(diff);
+      if (changes.length > 0) {
+        allChanges += `/* ${escapeUrlAsCssComment(url)} */\n\n${changes}\n\n`;
+      }
+    }
+    return allChanges;
   }
   private clipboardCopy(_event: Event): void {
@@ -1146,6 +1183,34 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
       }
     }
   }
+  private createCopyAllChangesButton(): UI.Toolbar.ToolbarButton {
+    const copyAllIcon = new IconButton.Icon.Icon();
+    copyAllIcon.data = {
+      iconName: 'ic_changes',
+      color: 'var(--color-text-secondary)',
+      width: '18px',
+      height: '18px',
+    };
+    const copyAllChangesButton = new UI.Toolbar.ToolbarButton(i18nString(UIStrings.copyAllCSSChanges), copyAllIcon);
+    // TODO(1296947): implement a dedicated component to share between all copy buttons
+    copyAllChangesButton.element.setAttribute('data-content', i18nString(UIStrings.copiedToClipboard));
+    let timeout: number|undefined;
+    copyAllChangesButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click, async () => {
+      const allChanges = await this.getFormattedChanges();
+      Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(allChanges);
+      if (timeout) {
+        clearTimeout(timeout);
+        timeout = undefined;
+      }
+      copyAllChangesButton.element.classList.add('copied-to-clipboard');
+      timeout = window.setTimeout(() => {
+        copyAllChangesButton.element.classList.remove('copied-to-clipboard');
+        timeout = undefined;
+      }, 2000);
+    });
+    return copyAllChangesButton;
+  }
 }
 export const enum Events {
@@ -1162,6 +1227,108 @@ export type EventTypes = {
   [Events.StylesUpdateCompleted]: StylesUpdateCompletedEvent,
 };
+type ChangeTracker = {
+  uiSourceCode: Workspace.UISourceCode.UISourceCode,
+  changedLines: Set<number>,
+  diffChangeCallback: () => Promise<void>,
+};
+export async function formatCSSChangesFromDiff(diff: Diff.Diff.DiffArray): Promise<string> {
+  const {originalLines, currentLines, rows} = DiffView.DiffView.buildDiffRows(diff);
+  const {propertyToSelector: originalPropertyToSelector, ruleToSelector: originalRuleToSelector} =
+      await buildPropertyRuleMaps(originalLines.join('\n'));
+  const {propertyToSelector: currentPropertyToSelector, ruleToSelector: currentRuleToSelector} =
+      await buildPropertyRuleMaps(currentLines.join('\n'));
+  let changes = '';
+  let recordedOriginalSelector, recordedCurrentSelector;
+  for (const {currentLineNumber, originalLineNumber, type} of rows) {
+    // diff line arrays starts at 0, but line numbers start at 1.
+    const currentLineIndex = currentLineNumber - 1;
+    const originalLineIndex = originalLineNumber - 1;
+    switch (type) {
+      case DiffView.DiffView.RowType.Deletion: {
+        const originalLine = originalLines[originalLineIndex].trim();
+        if (originalRuleToSelector.has(originalLineIndex)) {
+          changes += `/* ${originalLine} { */\n`;
+          recordedOriginalSelector = originalLine;
+          continue;
+        }
+        const originalSelector = originalPropertyToSelector.get(originalLineIndex);
+        if (!originalSelector) {
+          continue;
+        }
+        if (originalSelector !== recordedOriginalSelector && originalSelector !== recordedCurrentSelector) {
+          if (recordedOriginalSelector || recordedCurrentSelector) {
+            changes += '}\n\n';
+          }
+          changes += `${originalSelector} {\n`;
+        }
+        recordedOriginalSelector = originalSelector;
+        changes += `  /* ${originalLine} */\n`;
+        break;
+      }
+      case DiffView.DiffView.RowType.Addition: {
+        const currentLine = currentLines[currentLineIndex].trim();
+        if (currentRuleToSelector.has(currentLineIndex)) {
+          changes += `${currentLine} {\n`;
+          recordedCurrentSelector = currentLine;
+          continue;
+        }
+        const currentSelector = currentPropertyToSelector.get(currentLineIndex);
+        if (!currentSelector) {
+          continue;
+        }
+        if (currentSelector !== recordedOriginalSelector && currentSelector !== recordedCurrentSelector) {
+          if (recordedOriginalSelector || recordedCurrentSelector) {
+            changes += '}\n\n';
+          }
+          changes += `${currentSelector} {\n`;
+        }
+        recordedCurrentSelector = currentSelector;
+        changes += `  ${currentLine}\n`;
+        break;
+      }
+      default:
+        break;
+    }
+  }
+  if (changes.length > 0) {
+    changes += '}';
+  }
+  return changes;
+}
+async function buildPropertyRuleMaps(content: string):
+    Promise<{propertyToSelector: Map<number, string>, ruleToSelector: Map<number, string>}> {
+  const rules = await new Promise<Formatter.FormatterWorkerPool.CSSRule[]>(res => {
+    const rules: Formatter.FormatterWorkerPool.CSSRule[] = [];
+    Formatter.FormatterWorkerPool.formatterWorkerPool().parseCSS(content, (isLastChunk, currentRules) => {
+      rules.push(...currentRules);
+      if (isLastChunk) {
+        res(rules);
+      }
+    });
+  });
+  const propertyToSelector = new Map<number, string>();
+  const ruleToSelector = new Map<number, string>();
+  for (const rule of rules) {
+    if ('styleRange' in rule) {
+      const selector = rule.selectorText.split('\n').pop()?.trim();
+      if (!selector) {
+        continue;
+      }
+      ruleToSelector.set(rule.styleRange.startLine, selector);
+      for (const property of rule.properties) {
+        propertyToSelector.set(property.range.startLine, selector);
+      }
+    }
+  }
+  return {propertyToSelector, ruleToSelector};
+}
 // TODO(crbug.com/1172300) Ignored during the jsdoc to ts migration
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export const _maxLinkLength = 23;
@@ -3052,6 +3219,14 @@ export function unescapeCssString(input: string): string {
   });
 }
+export function escapeUrlAsCssComment(urlText: string): string {
+  const url = new URL(urlText);
+  if (url.search) {
+    return `${url.origin}${url.pathname}${url.search.replaceAll('*/', '*%2F')}${url.hash}`;
+  }
+  return url.toString();
+}
 export class StylesSidebarPropertyRenderer {
   private rule: SDK.CSSRule.CSSRule|null;
   private node: SDK.DOMModel.DOMNode|null;

package/front_end/panels/elements/elementsTreeOutline.css CHANGED Viewed

@@ -144,7 +144,6 @@
 .elements-disclosure > ol {
   position: relative;
   margin: 0;
-  cursor: default;
   min-width: 100%;
   min-height: 100%;
   padding-left: 2px;

package/front_end/panels/lighthouse/LighthouseController.ts CHANGED Viewed

@@ -104,6 +104,22 @@ const UIStrings = {
   *@description Tooltip text of checkbox to emulate mobile device behavior when running audits in Lighthouse
   */
   applyMobileEmulationDuring: 'Apply mobile emulation during auditing',
+  /**
+   * @description ARIA label for a radio button input to select the Lighthouse mode.
+   */
+  lighthouseMode: 'Lighthouse mode',
+  /**
+   * @description Tooltip text of a radio button to select the Lighthouse mode.
+   */
+  runLighthouseInMode: 'Run Lighthouse in navigation, timespan, or snapshot mode',
+  /**
+   * @description Text for Lighthouse navigation mode.
+   */
+  navigation: 'Navigation',
+  /**
+   * @description Text for Lighthouse snapshot mode.
+   */
+  snapshot: 'Snapshot',
   /**
   *@description Text for the mobile platform, as opposed to desktop
   */
@@ -421,6 +437,20 @@ export const RuntimeSettings: RuntimeSetting[] = [
     ],
     learnMore: undefined,
   },
+  {
+    setting: Common.Settings.Settings.instance().createSetting(
+        'lighthouse.mode', 'navigation', Common.Settings.SettingStorageType.Synced),
+    title: i18nLazyString(UIStrings.lighthouseMode),
+    description: i18nLazyString(UIStrings.runLighthouseInMode),
+    setFlags: (flags: Flags, value: string|boolean): void => {
+      flags.mode = value;
+    },
+    options: [
+      {label: i18nLazyString(UIStrings.navigation), value: 'navigation'},
+      {label: i18nLazyString(UIStrings.snapshot), value: 'snapshot'},
+    ],
+    learnMore: undefined,
+  },
   {
     // This setting is disabled, but we keep it around to show in the UI.
     setting: Common.Settings.Settings.instance().createSetting(

package/front_end/panels/lighthouse/LighthousePanel.ts CHANGED Viewed

@@ -5,6 +5,7 @@
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
+import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as EmulationModel from '../../models/emulation/emulation.js';
 import * as UI from '../../ui/legacy/legacy.js';
@@ -20,6 +21,7 @@ import * as LighthouseReport from '../../third_party/lighthouse/report/report.js
 import {LighthouseReportRenderer, LighthouseReportUIFeatures} from './LighthouseReportRenderer.js';
 import {Item, ReportSelector} from './LighthouseReportSelector.js';
 import {StartView} from './LighthouseStartView.js';
+import {StartViewFR} from './LighthouseStartViewFR.js';
 import {StatusView} from './LighthouseStatusView.js';
 const UIStrings = {
@@ -85,7 +87,11 @@ export class LighthousePanel extends UI.Panel.Panel {
     this.protocolService = new ProtocolService();
     this.controller = new LighthouseController(this.protocolService);
-    this.startView = new StartView(this.controller);
+    if (Root.Runtime.experiments.isEnabled('lighthousePanelFR')) {
+      this.startView = new StartViewFR(this.controller);
+    } else {
+      this.startView = new StartView(this.controller);
+    }
     this.statusView = new StatusView(this.controller);
     this.warningText = null;

package/front_end/panels/lighthouse/LighthouseProtocolService.ts CHANGED Viewed

@@ -63,7 +63,12 @@ export class ProtocolService {
     if (!this.targetInfo) {
       throw new Error('Unable to get target info required for Lighthouse');
     }
-    const mode = flags.legacyNavigation ? 'start' : 'navigate';
+    let mode = flags.mode as string;
+    if (mode === 'navigation' && flags.legacyNavigation) {
+      mode = 'legacyNavigation';
+    }
     return this.sendWithResponse(mode, {
       url: auditURL,
       categoryIDs,

package/front_end/panels/lighthouse/LighthouseStartView.ts CHANGED Viewed

@@ -60,7 +60,7 @@ export class StartView extends UI.Widget.Widget {
     return this.settingsToolbarInternal;
   }
-  private populateRuntimeSettingAsRadio(settingName: string, label: string, parentElement: Element): void {
+  protected populateRuntimeSettingAsRadio(settingName: string, label: string, parentElement: Element): void {
     const runtimeSetting = RuntimeSettings.find(item => item.setting.name === settingName);
     if (!runtimeSetting || !runtimeSetting.options) {
       throw new Error(`${settingName} is not a setting with options`);
@@ -112,7 +112,7 @@ export class StartView extends UI.Widget.Widget {
     UI.ARIAUtils.setAccessibleName(pluginFormElements, i18nString(UIStrings.communityPluginsBeta));
   }
-  private render(): void {
+  protected render(): void {
     this.populateRuntimeSettingAsToolbarCheckbox('lighthouse.legacy_navigation', this.settingsToolbarInternal);
     this.populateRuntimeSettingAsToolbarCheckbox('lighthouse.clear_storage', this.settingsToolbarInternal);
     this.populateRuntimeSettingAsToolbarCheckbox('lighthouse.throttling', this.settingsToolbarInternal);

package/front_end/panels/lighthouse/LighthouseStartViewFR.ts ADDED Viewed

@@ -0,0 +1,39 @@
+// Copyright 2022 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 i18n from '../../core/i18n/i18n.js';
+import * as UI from '../../ui/legacy/legacy.js';
+import {StartView} from './LighthouseStartView.js';
+const UIStrings = {
+  /**
+   * @description Text that refers to the Lighthouse mode
+   */
+  mode: 'Mode',
+};
+const str_ = i18n.i18n.registerUIStrings('panels/lighthouse/LighthouseStartViewFR.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+export class StartViewFR extends StartView {
+  protected render(): void {
+    super.render();
+    const fragment = UI.Fragment.Fragment.build`
+  <div class="lighthouse-form-section">
+  <div class="lighthouse-form-section-label">
+  ${i18nString(UIStrings.mode)}
+  </div>
+  <div class="lighthouse-form-elements" $="mode-form-elements"></div>
+  </div>
+    `;
+    // Populate the Lighthouse mode
+    const modeFormElements = fragment.$('mode-form-elements');
+    this.populateRuntimeSettingAsRadio('lighthouse.mode', i18nString(UIStrings.mode), modeFormElements);
+    const form = this.contentElement.querySelector('form');
+    form?.appendChild(fragment.element());
+  }
+}

package/front_end/panels/sensors/sensors.css CHANGED Viewed

@@ -107,7 +107,6 @@
 .orientation-stage.disabled {
   filter: grayscale();
   opacity: 50%;
-  cursor: default !important; /* stylelint-disable-line declaration-no-important */
 }
 .orientation-element,

package/front_end/panels/sources/NavigatorView.ts CHANGED Viewed

@@ -428,9 +428,12 @@ export class NavigatorView extends UI.Widget.VBox implements SDK.TargetManager.O
     const isFromSourceMap = uiSourceCode.contentType().isFromSourceMap();
     let path;
     if (uiSourceCode.project().type() === Workspace.Workspace.projectTypes.FileSystem) {
-      path = Persistence.FileSystemWorkspaceBinding.FileSystemWorkspaceBinding.relativePath(uiSourceCode).slice(0, -1);
+      path =
+          Persistence.FileSystemWorkspaceBinding.FileSystemWorkspaceBinding.relativePath(uiSourceCode).slice(0, -1) as
+          Platform.DevToolsPath.EncodedPathString[];
     } else {
-      path = Common.ParsedURL.ParsedURL.extractPath(uiSourceCode.url()).split('/').slice(1, -1);
+      path = Common.ParsedURL.ParsedURL.extractPath(uiSourceCode.url()).split('/').slice(1, -1) as
+          Platform.DevToolsPath.EncodedPathString[];
     }
     const project = uiSourceCode.project();
@@ -503,7 +506,8 @@ export class NavigatorView extends UI.Widget.VBox implements SDK.TargetManager.O
       const commonPrefix = reversedIndex.longestPrefix(reversedPath, false /* fullWordOnly */);
       reversedIndex.add(reversedPath);
       const prefixPath = reversedPath.substring(0, commonPrefix.length + 1);
-      const path = encoder.decode(Platform.StringUtilities.reverse(prefixPath));
+      const path = Common.ParsedURL.ParsedURL.encodedPathToRawPathString(
+          encoder.decode(Platform.StringUtilities.reverse(prefixPath)) as Platform.DevToolsPath.EncodedPathString);
       const fileSystemNode = this.rootNode.child(project.id());
       if (fileSystemNode) {
@@ -539,7 +543,7 @@ export class NavigatorView extends UI.Widget.VBox implements SDK.TargetManager.O
   private folderNode(
       uiSourceCode: Workspace.UISourceCode.UISourceCode, project: Workspace.Workspace.Project,
       target: SDK.Target.Target|null, frame: SDK.ResourceTreeModel.ResourceTreeFrame|null, projectOrigin: string,
-      path: string[], fromSourceMap: boolean): NavigatorTreeNode {
+      path: Platform.DevToolsPath.EncodedPathString[], fromSourceMap: boolean): NavigatorTreeNode {
     if (Snippets.ScriptSnippetFileSystem.isSnippetsUISourceCode(uiSourceCode)) {
       return this.rootNode;
     }
@@ -568,7 +572,7 @@ export class NavigatorView extends UI.Widget.VBox implements SDK.TargetManager.O
     if (project.type() === Workspace.Workspace.projectTypes.FileSystem) {
       type = Types.FileSystemFolder;
     }
-    const name = path[path.length - 1];
+    const name = Common.ParsedURL.ParsedURL.encodedPathToRawPathString(path[path.length - 1]);
     folderNode = new NavigatorFolderTreeNode(this, project, folderId, type, folderPath, name);
     this.subfolderNodes.set(folderId, folderNode);

package/front_end/panels/sources/sources-legacy.ts CHANGED Viewed

@@ -139,26 +139,13 @@ Sources.SnippetsPlugin = SourcesModule.SnippetsPlugin.SnippetsPlugin;
 Sources.SourceMapNamesResolver = {};
-Sources.SourceMapNamesResolver.setScopeResolvedForTest = SourcesModule.SourceMapNamesResolver.setScopeResolvedForTest;
 // Tests can override this global symbol and therefore can't be exported
 Object.defineProperty(Sources.SourceMapNamesResolver, '_scopeResolvedForTest', {
   get: SourcesModule.SourceMapNamesResolver.getScopeResolvedForTest,
   set: SourcesModule.SourceMapNamesResolver.setScopeResolvedForTest,
 });
-Sources.SourceMapNamesResolver._scopeIdentifiers = SourcesModule.SourceMapNamesResolver.scopeIdentifiers;
-Sources.SourceMapNamesResolver._resolveScope = SourcesModule.SourceMapNamesResolver.resolveScope;
-Sources.SourceMapNamesResolver._allVariablesInCallFrame = SourcesModule.SourceMapNamesResolver.allVariablesInCallFrame;
 Sources.SourceMapNamesResolver.resolveExpression = SourcesModule.SourceMapNamesResolver.resolveExpression;
-Sources.SourceMapNamesResolver.resolveThisObject = SourcesModule.SourceMapNamesResolver.resolveThisObject;
-Sources.SourceMapNamesResolver.resolveScopeInObject = SourcesModule.SourceMapNamesResolver.resolveScopeInObject;
-/** @constructor */
-Sources.SourceMapNamesResolver.Identifier = SourcesModule.SourceMapNamesResolver.Identifier;
-/** @constructor */
-Sources.SourceMapNamesResolver.RemoteObject = SourcesModule.SourceMapNamesResolver.RemoteObject;
 /** @constructor */
 Sources.NetworkNavigatorView = SourcesModule.SourcesNavigator.NetworkNavigatorView;

package/front_end/panels/sources/sourcesView.css CHANGED Viewed

@@ -45,10 +45,6 @@
   z-index: 0;
 }
-.sources-toolbar .toolbar {
-  cursor: default;
-}
 .source-frame-debugger-script {
   --override-debugger-background-tint: rgb(255 255 194 / 50%);

package/front_end/ui/legacy/closeButton.css CHANGED Viewed

@@ -7,7 +7,6 @@
 .close-button {
   width: 14px;
   height: 14px;
-  cursor: default;
   display: flex;
   align-items: center;
   justify-content: center;

package/front_end/ui/legacy/tabbedPane.css CHANGED Viewed

@@ -117,7 +117,6 @@
   height: 26px;
   line-height: 16px;
   white-space: nowrap;
-  cursor: default;
   display: flex;
   align-items: center;
   color: var(--color-text-secondary);
@@ -194,7 +193,6 @@
 .tabbed-pane-header-tabs-drop-down-container {
   float: left;
   opacity: 80%;
-  cursor: pointer;
   display: flex;
   align-items: center;
   height: 100%;
@@ -347,7 +345,6 @@
   width: 14px;
   height: 14px;
-  cursor: default;
   display: flex;
   align-items: center;
   justify-content: center;

package/front_end/ui/legacy/toolbar.css CHANGED Viewed

@@ -7,12 +7,14 @@
 :host {
   flex: none;
   padding: 0 2px;
+  --toolbar-height: 26px;
 }
 .toolbar-shadow {
   position: relative;
   white-space: nowrap;
-  height: 26px;
+  height: var(--toolbar-height);
   overflow: hidden;
   z-index: 12;
   display: flex;
@@ -43,7 +45,7 @@
   align-items: center;
   justify-content: center;
   padding: 0;
-  height: 26px;
+  height: var(--toolbar-height);
   border: none;
   white-space: pre;
 }
@@ -55,7 +57,7 @@
 .toolbar-shadow.vertical .toolbar-item {
   height: auto;
-  min-height: 26px;
+  min-height: var(--toolbar-height);
   white-space: normal;
 }
@@ -175,6 +177,29 @@ it. */
   margin-inline-end: 28px;
 }
+.toolbar-button.copied-to-clipboard::after {
+  content: attr(data-content);
+  position: fixed;
+  top: var(--toolbar-height);
+  padding: 3px 5px;
+  color: var(--color-text-secondary);
+  background: var(--color-background-elevation-1);
+  animation: 2s fade-out;
+  font-weight: normal;
+  border: 1px solid var(--color-details-hairline);
+  border-radius: 3px;
+}
+@keyframes fade-out {
+  from {
+    opacity: 100%;
+  }
+  to {
+    opacity: 0%;
+  }
+}
 .toolbar-button.toolbar-state-on .toolbar-glyph {
   background-color: var(--color-primary);
 }

package/package.json CHANGED Viewed

@@ -54,5 +54,5 @@
     "unittest": "scripts/test/run_unittests.py --no-text-coverage",
     "watch": "third_party/node/node.py --output scripts/watch_build.js"
   },
-  "version": "1.0.970539"
+  "version": "1.0.971140"
 }

package/scripts/npm_test.js CHANGED Viewed

@@ -91,7 +91,7 @@ function runTests(buildDirectoryPath, useDebugDevtools) {
   if (IS_DEBUG_ENABLED) {
     testArgs.push('--additional-driver-flag=--remote-debugging-port=9222');
-    testArgs.push('--time-out-ms=6000000');
+    testArgs.push('--timeout-ms=6000000');
     console.log('\n=============================================');
     const unitTest = testArgs.find(arg => arg.includes('http/tests/devtools/unit/'));
     if (unitTest) {