chrome-devtools-frontend 1.0.970391 → 1.0.972361

package/front_end/models/workspace/UISourceCode.ts

@@ -36,7 +36,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as TextUtils from '../text_utils/text_utils.js';
 
 import type {Project} from './WorkspaceImpl.js';
-import {Events as WorkspaceImplEvents, projectTypes} from './WorkspaceImpl.js';
+import {Events as WorkspaceImplEvents} from './WorkspaceImpl.js';
 
 const UIStrings = {
   /**
@@ -56,7 +56,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   private projectInternal: Project;
   private urlInternal: string;
   private readonly originInternal: string;
-  private readonly parentURLInternal: string;
+  private readonly parentURLInternal: Platform.DevToolsPath.UrlString;
   private nameInternal: string;
   private contentTypeInternal: Common.ResourceType.ResourceType;
   private requestContentPromise: Promise<TextUtils.ContentProvider.DeferredContent>|null;
@@ -81,14 +81,18 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     const parsedURL = Common.ParsedURL.ParsedURL.fromString(url);
     if (parsedURL) {
       this.originInternal = parsedURL.securityOrigin();
-      this.parentURLInternal = this.originInternal + parsedURL.folderPathComponents;
-      this.nameInternal = parsedURL.lastPathComponent;
+      this.parentURLInternal = this.originInternal + parsedURL.folderPathComponents as Platform.DevToolsPath.UrlString;
       if (parsedURL.queryParams) {
-        this.nameInternal += '?' + parsedURL.queryParams;
+        // in case file name contains query params, it doesn't look like a normal file name anymore
+        // so it can as well remain encoded
+        this.nameInternal = parsedURL.lastPathComponent + '?' + parsedURL.queryParams;
+      } else {
+        // file name looks best decoded
+        this.nameInternal = decodeURIComponent(parsedURL.lastPathComponent);
       }
     } else {
       this.originInternal = '';
-      this.parentURLInternal = '';
+      this.parentURLInternal = '' as Platform.DevToolsPath.UrlString;
       this.nameInternal = url;
     }
 
@@ -118,11 +122,11 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     return this.projectInternal.mimeType(this);
   }
 
-  url(): string {
-    return this.urlInternal;
+  url(): Platform.DevToolsPath.UrlString {
+    return this.urlInternal as Platform.DevToolsPath.UrlString;
   }
 
-  parentURL(): string {
+  parentURL(): Platform.DevToolsPath.UrlString {
     return this.parentURLInternal;
   }
 
@@ -138,15 +142,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     if (!this.nameInternal) {
       return i18nString(UIStrings.index);
     }
-    let name: string = this.nameInternal;
-    try {
-      if (this.project().type() === projectTypes.FileSystem) {
-        name = unescape(name);
-      } else {
-        name = decodeURI(name);
-      }
-    } catch (error) {
-    }
+    const name = this.nameInternal;
     return skipTrim ? name : Platform.StringUtilities.trimEndWithMaxLength(name, 100);
   }
 
@@ -178,10 +174,12 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
 
   private updateName(name: string, url: string, contentType?: Common.ResourceType.ResourceType): void {
     const oldURL = this.urlInternal;
-    this.urlInternal = this.urlInternal.substring(0, this.urlInternal.length - this.nameInternal.length) + name;
     this.nameInternal = name;
     if (url) {
       this.urlInternal = url;
+    } else {
+      this.urlInternal = Common.ParsedURL.ParsedURL.relativePathToUrlString(
+          name as Platform.DevToolsPath.RawPathString, oldURL as Platform.DevToolsPath.UrlString);
     }
     if (contentType) {
       this.contentTypeInternal = contentType;
@@ -191,8 +189,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
         WorkspaceImplEvents.UISourceCodeRenamed, {oldURL: oldURL, uiSourceCode: this});
   }
 
-  // TODO(crbug.com/1253323): Cast to RawPathString will be removed when migration to branded types is complete.
-  contentURL(): string {
+  contentURL(): Platform.DevToolsPath.UrlString {
     return this.url();
   }
 

package/front_end/models/workspace/WorkspaceImpl.ts

@@ -175,7 +175,9 @@ export abstract class ProjectStore implements Project {
 
   renameUISourceCode(uiSourceCode: UISourceCode, newName: string): void {
     const oldPath = uiSourceCode.url();
-    const newPath = uiSourceCode.parentURL() ? uiSourceCode.parentURL() + '/' + newName : newName;
+    const newPath = uiSourceCode.parentURL() ?
+        Common.ParsedURL.ParsedURL.urlFromParentUrlAndName(uiSourceCode.parentURL(), newName) :
+        encodeURIComponent(newName);
     const value = this.uiSourceCodesMap.get(oldPath) as {
       uiSourceCode: UISourceCode,
       index: number,

package/front_end/models/workspace_diff/WorkspaceDiff.ts

@@ -13,6 +13,11 @@ interface DiffRequestOptions {
   shouldFormatDiff: boolean;
 }
 
+interface DiffResponse {
+  diff: Diff.Diff.DiffArray;
+  formattedCurrentMapping?: FormatterModule.ScriptFormatter.FormatterSourceMapping;
+}
+
 export class WorkspaceDiffImpl extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   private readonly uiSourceCodeDiffs: WeakMap<Workspace.UISourceCode.UISourceCode, UISourceCodeDiff>;
   private readonly loadingUISourceCodes:
@@ -35,7 +40,7 @@ export class WorkspaceDiffImpl extends Common.ObjectWrapper.ObjectWrapper<EventT
   }
 
   requestDiff(uiSourceCode: Workspace.UISourceCode.UISourceCode, diffRequestOptions: DiffRequestOptions):
-      Promise<Diff.Diff.DiffArray|null> {
+      Promise<DiffResponse|null> {
     return this.uiSourceCodeDiff(uiSourceCode).requestDiff(diffRequestOptions);
   }
 
@@ -185,7 +190,7 @@ export type EventTypes = {
 
 export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourceCodeDiffEventTypes> {
   private uiSourceCode: Workspace.UISourceCode.UISourceCode;
-  private requestDiffPromise: Promise<Diff.Diff.DiffArray|null>|null;
+  private requestDiffPromise: Promise<DiffResponse|null>|null;
   private pendingChanges: number|null;
   dispose: boolean;
   constructor(uiSourceCode: Workspace.UISourceCode.UISourceCode) {
@@ -218,7 +223,7 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     }
   }
 
-  requestDiff(diffRequestOptions: DiffRequestOptions): Promise<Diff.Diff.DiffArray|null> {
+  requestDiff(diffRequestOptions: DiffRequestOptions): Promise<DiffResponse|null> {
     if (!this.requestDiffPromise) {
       this.requestDiffPromise = this.innerRequestDiff(diffRequestOptions);
     }
@@ -237,7 +242,7 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     return content.content || ('error' in content && content.error) || '';
   }
 
-  private async innerRequestDiff({shouldFormatDiff}: DiffRequestOptions): Promise<Diff.Diff.DiffArray|null> {
+  private async innerRequestDiff({shouldFormatDiff}: DiffRequestOptions): Promise<DiffResponse|null> {
     if (this.dispose) {
       return null;
     }
@@ -270,15 +275,22 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     if (current === null || baseline === null) {
       return null;
     }
+    let formattedCurrentMapping;
     if (shouldFormatDiff) {
       baseline = (await FormatterModule.ScriptFormatter.format(
                       this.uiSourceCode.contentType(), this.uiSourceCode.mimeType(), baseline))
                      .formattedContent;
-      current = (await FormatterModule.ScriptFormatter.format(
-                     this.uiSourceCode.contentType(), this.uiSourceCode.mimeType(), current))
-                    .formattedContent;
+      const formatCurrentResult = await FormatterModule.ScriptFormatter.format(
+          this.uiSourceCode.contentType(), this.uiSourceCode.mimeType(), current);
+      current = formatCurrentResult.formattedContent;
+      formattedCurrentMapping = formatCurrentResult.formattedMapping;
     }
-    return Diff.Diff.DiffWrapper.lineDiff(baseline.split(/\r\n|\n|\r/), current.split(/\r\n|\n|\r/));
+    const reNewline = /\r\n?|\n/;
+    const diff = Diff.Diff.DiffWrapper.lineDiff(baseline.split(reNewline), current.split(reNewline));
+    return {
+      diff,
+      formattedCurrentMapping,
+    };
   }
 }
 

package/front_end/panels/application/ServiceWorkerCacheViews.ts

@@ -454,7 +454,7 @@ export class DataGridNode extends DataGrid.DataGrid.DataGridNode<DataGridNode> {
   createCell(columnId: string): HTMLElement {
     const cell = this.createTD(columnId);
     let value;
-    let tooltip = this.request.url();
+    let tooltip = this.request.url() as string;
     if (columnId === 'number') {
       value = String(this.number);
     } else if (columnId === 'name') {

package/front_end/panels/browser_debugger/categorizedBreakpointsSidebarPane.css

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

package/front_end/panels/changes/ChangesView.ts

@@ -173,7 +173,7 @@ export class ChangesView extends UI.Widget.VBox {
     }
 
     if (!this.selectedUISourceCode) {
-      this.renderDiffRows(null);
+      this.renderDiffRows();
       return;
     }
     const uiSourceCode = this.selectedUISourceCode;
@@ -181,12 +181,12 @@ export class ChangesView extends UI.Widget.VBox {
       this.hideDiff(i18nString(UIStrings.binaryData));
       return;
     }
-    const diff = await this.workspaceDiff.requestDiff(
+    const diffResponse = await this.workspaceDiff.requestDiff(
         uiSourceCode, {shouldFormatDiff: Root.Runtime.experiments.isEnabled('preciseChanges')});
     if (this.selectedUISourceCode !== uiSourceCode) {
       return;
     }
-    this.renderDiffRows(diff);
+    this.renderDiffRows(diffResponse?.diff);
   }
 
   private hideDiff(message: string): void {
@@ -197,7 +197,7 @@ export class ChangesView extends UI.Widget.VBox {
     this.emptyWidget.showWidget();
   }
 
-  private renderDiffRows(diff: Diff.Diff.DiffArray|null): void {
+  private renderDiffRows(diff?: Diff.Diff.DiffArray): void {
     if (!diff || (diff.length === 1 && diff[0][0] === Diff.Diff.Operation.Equal)) {
       this.hideDiff(i18nString(UIStrings.noChanges));
     } else {

package/front_end/panels/console/ConsolePrompt.ts

@@ -5,7 +5,9 @@
 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 SourceMapScopes from '../../models/source_map_scopes/source_map_scopes.js';
 import * as CodeMirror from '../../third_party/codemirror.next/codemirror.next.js';
 import * as TextEditor from '../../ui/components/text_editor/text_editor.js';
 import * as ObjectUI from '../../ui/legacy/components/object_ui/object_ui.js';
@@ -280,14 +282,35 @@ export class ConsolePrompt extends Common.ObjectWrapper.eventMixin<EventTypes, t
       const executionContext = currentExecutionContext;
       const message = SDK.ConsoleModel.ConsoleModel.instance().addCommandMessage(executionContext, text);
       const expression = ObjectUI.JavaScriptREPL.JavaScriptREPL.preprocessExpression(text);
-      void SDK.ConsoleModel.ConsoleModel.instance().evaluateCommandInConsole(
-          executionContext, message, expression, useCommandLineAPI);
+      void this.evaluateCommandInConsole(executionContext, message, expression, useCommandLineAPI);
       if (ConsolePanel.instance().isShowing()) {
         Host.userMetrics.actionTaken(Host.UserMetrics.Action.CommandEvaluatedInConsolePanel);
       }
     }
   }
 
+  private async evaluateCommandInConsole(
+      executionContext: SDK.RuntimeModel.ExecutionContext, message: SDK.ConsoleModel.ConsoleMessage, expression: string,
+      useCommandLineAPI: boolean): Promise<void> {
+    if (Root.Runtime.experiments.isEnabled('evaluateExpressionsWithSourceMaps')) {
+      const callFrame = executionContext.debuggerModel.selectedCallFrame();
+      if (callFrame) {
+        const nameMap = await SourceMapScopes.NamesResolver.allVariablesInCallFrame(callFrame);
+        expression = this.substituteNames(expression, nameMap);
+      }
+    }
+
+    await SDK.ConsoleModel.ConsoleModel.instance().evaluateCommandInConsole(
+        executionContext, message, expression, useCommandLineAPI);
+  }
+
+  private substituteNames(expression: string, mapping: Map<string, string>): string {
+    // TODO(jarin) Build a more reliable replacer, based on the parsed AST.
+    // Here, we just replace exact occurrences.
+    const replacement = mapping.get(expression);
+    return replacement ?? expression;
+  }
+
   private editorUpdate(update: CodeMirror.ViewUpdate): void {
     if (update.docChanged ||
         CodeMirror.selectedCompletion(update.state) !== CodeMirror.selectedCompletion(update.startState)) {

package/front_end/panels/console/ConsoleViewMessage.ts

@@ -548,8 +548,7 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
       return null;
     }
     return this.linkifier.linkifyScriptLocation(
-        runtimeModel.target(), /* scriptId */ null, url, lineNumber,
-        {columnNumber, className: undefined, tabStop: undefined, inlineFrameIndex: 0});
+        runtimeModel.target(), /* scriptId */ null, url, lineNumber, {columnNumber, inlineFrameIndex: 0});
   }
 
   private linkifyStackTraceTopFrame(stackTrace: Protocol.Runtime.StackTrace): HTMLElement|null {
@@ -567,8 +566,7 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
       return null;
     }
     return this.linkifier.linkifyScriptLocation(
-        runtimeModel.target(), scriptId, url, lineNumber,
-        {columnNumber, className: undefined, tabStop: undefined, inlineFrameIndex: 0});
+        runtimeModel.target(), scriptId, url, lineNumber, {columnNumber, inlineFrameIndex: 0});
   }
 
   private format(rawParameters: (string|SDK.RemoteObject.RemoteObject|Protocol.Runtime.RemoteObject|undefined)[]):
@@ -1435,8 +1433,7 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
       const formattedLine = document.createElement('span');
       formattedLine.appendChild(this.linkifyStringAsFragment(`${prefix} ${name} (`));
       const scriptLocationLink = this.linkifier.linkifyScriptLocation(
-          debuggerModel.target(), null, url, lineNumber,
-          {columnNumber, className: undefined, tabStop: undefined, inlineFrameIndex: f});
+          debuggerModel.target(), null, url, lineNumber, {columnNumber, inlineFrameIndex: f});
       scriptLocationLink.tabIndex = -1;
       this.selectableChildren.push({element: scriptLocationLink, forceSelect: (): void => scriptLocationLink.focus()});
       formattedLine.appendChild(scriptLocationLink);
@@ -1446,6 +1443,30 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     return true;
   }
 
+  private createScriptLocationLinkForSyntaxError(
+      debuggerModel: SDK.DebuggerModel.DebuggerModel, exceptionDetails: Protocol.Runtime.ExceptionDetails): HTMLElement
+      |undefined {
+    const {scriptId, lineNumber, columnNumber} = exceptionDetails;
+    if (!scriptId) {
+      return;
+    }
+
+    // SyntaxErrors might not populate the URL field. Try to resolve it via scriptId.
+    const url = exceptionDetails.url || debuggerModel.scriptForId(scriptId)?.sourceURL;
+    if (!url) {
+      return;
+    }
+
+    const scriptLocationLink = this.linkifier.linkifyScriptLocation(
+        debuggerModel.target(), exceptionDetails.scriptId || null, url, lineNumber, {
+          columnNumber,
+          inlineFrameIndex: 0,
+          showColumnNumber: true,
+        });
+    scriptLocationLink.tabIndex = -1;
+    return scriptLocationLink;
+  }
+
   private tryFormatAsError(string: string, exceptionDetails?: Protocol.Runtime.ExceptionDetails): HTMLElement|null {
     const runtimeModel = this.message.runtimeModel();
     if (!runtimeModel) {
@@ -1465,6 +1486,20 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
     for (let i = 0; i < linkInfos.length; ++i) {
       const newline = i < linkInfos.length - 1 ? '\n' : '';
       const {line, link} = linkInfos[i];
+      // Syntax errors don't have a stack frame that points to the source position
+      // where the error occurred. We use the source location from the
+      // exceptionDetails and append it to the end of the message instead.
+      if (!link && exceptionDetails && line.startsWith('SyntaxError')) {
+        formattedResult.appendChild(this.linkifyStringAsFragment(line));
+        const maybeScriptLocation = this.createScriptLocationLinkForSyntaxError(debuggerModel, exceptionDetails);
+        if (maybeScriptLocation) {
+          formattedResult.append(' (at ');
+          formattedResult.appendChild(maybeScriptLocation);
+          formattedResult.append(')');
+        }
+        formattedResult.append(newline);
+        continue;
+      }
       if (!link) {
         formattedResult.appendChild(this.linkifyStringAsFragment(`${line}${newline}`));
         continue;
@@ -1475,8 +1510,6 @@ export class ConsoleViewMessage implements ConsoleViewportElement {
       const scriptLocationLink = this.linkifier.linkifyScriptLocation(
           debuggerModel.target(), link.scriptId || null, link.url, link.lineNumber, {
             columnNumber: link.columnNumber,
-            className: undefined,
-            tabStop: undefined,
             inlineFrameIndex: 0,
             showColumnNumber: true,
           });

package/front_end/panels/coverage/CoverageModel.ts

@@ -746,7 +746,7 @@ export class CoverageInfo {
     return this.contentProvider;
   }
 
-  url(): string {
+  url(): Platform.DevToolsPath.UrlString {
     return this.contentProvider.contentURL();
   }
 

package/front_end/panels/elements/ElementsPanel.ts

@@ -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/ElementsTreeElement.ts

@@ -1514,14 +1514,8 @@ export class ElementsTreeElement extends UI.TreeOutline.TreeElement {
           Components.Linkifier.Linkifier.linkifyURL(rewrittenHref, {
             text: value,
             preventClick: true,
-            className: undefined,
-            lineNumber: undefined,
-            columnNumber: undefined,
             showColumnNumber: false,
             inlineFrameIndex: 0,
-            maxLength: undefined,
-            tabStop: undefined,
-            bypassURLTrimming: undefined,
           });
       return ImagePreviewPopover.setImageUrl(link, rewrittenHref);
     }