chrome-devtools-frontend 1.0.1014346 → 1.0.1015658

package/front_end/core/sdk/DOMModel.ts

@@ -64,6 +64,7 @@ export class DOMNode {
   #localNameInternal!: string;
   nodeValueInternal!: string;
   #pseudoTypeInternal!: Protocol.DOM.PseudoType|undefined;
+  #pseudoIdentifier?: string;
   #shadowRootTypeInternal!: Protocol.DOM.ShadowRootType|undefined;
   #frameOwnerFrameIdInternal!: Protocol.Page.FrameId|null;
   #xmlVersion!: string|undefined;
@@ -135,6 +136,7 @@ export class DOMNode {
     this.#localNameInternal = payload.localName;
     this.nodeValueInternal = payload.nodeValue;
     this.#pseudoTypeInternal = payload.pseudoType;
+    this.#pseudoIdentifier = payload.pseudoIdentifier;
     this.#shadowRootTypeInternal = payload.shadowRootType;
     this.#frameOwnerFrameIdInternal = payload.frameId || null;
     this.#xmlVersion = payload.xmlVersion;
@@ -318,6 +320,10 @@ export class DOMNode {
     return this.#pseudoTypeInternal;
   }
 
+  pseudoIdentifier(): string|undefined {
+    return this.#pseudoIdentifier;
+  }
+
   hasPseudoElements(): boolean {
     return this.#pseudoElements.size > 0;
   }
@@ -1644,6 +1650,9 @@ class DOMDispatcher implements ProtocolProxyApi.DOMDispatcher {
   distributedNodesUpdated({insertionPointId, distributedNodes}: Protocol.DOM.DistributedNodesUpdatedEvent): void {
     this.#domModel.distributedNodesUpdated(insertionPointId, distributedNodes);
   }
+
+  topLayerElementsUpdated(): void {
+  }
 }
 
 // TODO(crbug.com/1172300) Ignored during the jsdoc to ts migration

package/front_end/core/sdk/DebuggerModel.ts

@@ -580,34 +580,6 @@ export class DebuggerModel extends SDKModel<EventTypes> {
     return result;
   }
 
-  setScriptSource(
-      scriptId: string, newSource: string,
-      callback: (error: string|null, arg1?: Protocol.Runtime.ExceptionDetails|undefined) => void): void {
-    const script = this.#scriptsInternal.get(scriptId);
-    if (script) {
-      void script.editSource(newSource, this.didEditScriptSource.bind(this, scriptId, newSource, callback));
-    }
-  }
-
-  private didEditScriptSource(
-      scriptId: string, newSource: string,
-      callback: (error: string|null, arg1?: Protocol.Runtime.ExceptionDetails|undefined) => void, error: string|null,
-      exceptionDetails?: Protocol.Runtime.ExceptionDetails, callFrames?: Protocol.Debugger.CallFrame[],
-      asyncStackTrace?: Protocol.Runtime.StackTrace, asyncStackTraceId?: Protocol.Runtime.StackTraceId,
-      needsStepIn?: boolean): void {
-    callback(error, exceptionDetails);
-    if (needsStepIn) {
-      void this.stepInto();
-      return;
-    }
-
-    if (!error && callFrames && callFrames.length && this.#debuggerPausedDetailsInternal) {
-      void this.pausedScript(
-          callFrames, this.#debuggerPausedDetailsInternal.reason, this.#debuggerPausedDetailsInternal.auxData,
-          this.#debuggerPausedDetailsInternal.breakpointIds, asyncStackTrace, asyncStackTraceId);
-    }
-  }
-
   get callFrames(): CallFrame[]|null {
     return this.#debuggerPausedDetailsInternal ? this.#debuggerPausedDetailsInternal.callFrames : null;
   }

package/front_end/core/sdk/Script.ts

@@ -257,25 +257,19 @@ export class Script implements TextUtils.ContentProvider.ContentProvider, FrameA
     return source + '\n //# sourceURL=' + this.sourceURL;
   }
 
-  async editSource(
-      newSource: string,
-      callback:
-          (error: string|null, arg1?: Protocol.Runtime.ExceptionDetails|undefined,
-           arg2?: Array<Protocol.Debugger.CallFrame>|undefined, arg3?: Protocol.Runtime.StackTrace|undefined,
-           arg4?: Protocol.Runtime.StackTraceId|undefined, arg5?: boolean|undefined) => void): Promise<void> {
+  async editSource(newSource: string):
+      Promise<{error: string | null, exceptionDetails?: Protocol.Runtime.ExceptionDetails}> {
     newSource = Script.trimSourceURLComment(newSource);
     // We append correct #sourceURL to script for consistency only. It's not actually needed for things to work correctly.
     newSource = this.appendSourceURLCommentIfNeeded(newSource);
 
     if (!this.scriptId) {
-      callback('Script failed to parse');
-      return;
+      return {error: 'Script failed to parse'};
     }
 
     const {content: oldSource} = await this.requestContent();
     if (oldSource === newSource) {
-      callback(null);
-      return;
+      return {error: null};
     }
     const response = await this.debuggerModel.target().debuggerAgent().invoke_setScriptSource(
         {scriptId: this.scriptId, scriptSource: newSource});
@@ -284,10 +278,7 @@ export class Script implements TextUtils.ContentProvider.ContentProvider, FrameA
       this.#contentPromise = Promise.resolve({content: newSource, isEncoded: false});
     }
 
-    const needsStepIn = Boolean(response.stackChanged);
-    callback(
-        response.getError() || null, response.exceptionDetails, response.callFrames, response.asyncStackTrace,
-        response.asyncStackTraceId, needsStepIn);
+    return {error: response.getError() || null, exceptionDetails: response.exceptionDetails};
   }
 
   rawLocation(lineNumber: number, columnNumber: number): Location|null {

package/front_end/core/sdk/SourceMap.ts

@@ -66,6 +66,11 @@ export interface SourceMap {
       TextUtils.ContentProvider.ContentProvider;
   embeddedContentByURL(sourceURL: Platform.DevToolsPath.UrlString): string|null;
   findEntry(lineNumber: number, columnNumber: number): SourceMapEntry|null;
+  findEntryRanges(lineNumber: number, columnNumber: number): {
+    range: TextUtils.TextRange.TextRange,
+    sourceRange: TextUtils.TextRange.TextRange,
+    sourceURL: Platform.DevToolsPath.UrlString,
+  }|null;
   findReverseRanges(sourceURL: Platform.DevToolsPath.UrlString, lineNumber: number, columnNumber: number):
       TextUtils.TextRange.TextRange[];
   sourceLineMapping(sourceURL: Platform.DevToolsPath.UrlString, lineNumber: number, columnNumber: number):
@@ -233,6 +238,52 @@ export class TextSourceMap implements SourceMap {
     return index ? mappings[index - 1] : null;
   }
 
+  findEntryRanges(lineNumber: number, columnNumber: number): {
+    range: TextUtils.TextRange.TextRange,
+    sourceRange: TextUtils.TextRange.TextRange,
+    sourceURL: Platform.DevToolsPath.UrlString,
+  }|null {
+    const mappings = this.mappings();
+    const index = Platform.ArrayUtilities.upperBound(
+        mappings, undefined, (unused, entry) => lineNumber - entry.lineNumber || columnNumber - entry.columnNumber);
+    if (!index) {
+      // If the line and column are preceding all the entries, then there is nothing to map.
+      return null;
+    }
+    const sourceURL = mappings[index].sourceURL;
+    if (!sourceURL) {
+      return null;
+    }
+
+    // Let us compute the range that contains the source position in the compiled code.
+    const endLine = index < mappings.length ? mappings[index].lineNumber : 2 ** 31 - 1;
+    const endColumn = index < mappings.length ? mappings[index].columnNumber : 2 ** 31 - 1;
+    const range = new TextUtils.TextRange.TextRange(
+        mappings[index - 1].lineNumber, mappings[index - 1].columnNumber, endLine, endColumn);
+
+    // Now try to find the corresponding token in the original code.
+    const reverseMappings = this.reversedMappings(sourceURL);
+    const startSourceLine = mappings[index - 1].sourceLineNumber;
+    const startSourceColumn = mappings[index - 1].sourceColumnNumber;
+    const endReverseIndex = Platform.ArrayUtilities.upperBound(
+        reverseMappings, undefined,
+        (unused, i) =>
+            startSourceLine - mappings[i].sourceLineNumber || startSourceColumn - mappings[i].sourceColumnNumber);
+    if (!endReverseIndex) {
+      return null;
+    }
+    const endSourceLine = endReverseIndex < reverseMappings.length ?
+        mappings[reverseMappings[endReverseIndex]].sourceLineNumber :
+        2 ** 31 - 1;
+    const endSourceColumn = endReverseIndex < reverseMappings.length ?
+        mappings[reverseMappings[endReverseIndex]].sourceColumnNumber :
+        2 ** 31 - 1;
+
+    const sourceRange =
+        new TextUtils.TextRange.TextRange(startSourceLine, startSourceColumn, endSourceLine, endSourceColumn);
+    return {range, sourceRange, sourceURL};
+  }
+
   sourceLineMapping(sourceURL: Platform.DevToolsPath.UrlString, lineNumber: number, columnNumber: number):
       SourceMapEntry|null {
     const mappings = this.mappings();
@@ -315,42 +366,53 @@ export class TextSourceMap implements SourceMap {
   }
 
   mappings(): SourceMapEntry[] {
+    this.#ensureMappingsProcessed();
+    return this.#mappingsInternal ?? [];
+  }
+
+  private reversedMappings(sourceURL: Platform.DevToolsPath.UrlString): number[] {
+    this.#ensureMappingsProcessed();
+    return this.#sourceInfos.get(sourceURL)?.reverseMappings ?? [];
+  }
+
+  #ensureMappingsProcessed(): void {
     if (this.#mappingsInternal === null) {
       this.#mappingsInternal = [];
       this.eachSection(this.parseMap.bind(this));
+      this.#computeReverseMappings(this.#mappingsInternal);
       this.#json = null;
     }
-    return this.#mappingsInternal;
   }
 
-  private reversedMappings(sourceURL: Platform.DevToolsPath.UrlString): number[] {
-    const info = this.#sourceInfos.get(sourceURL);
-    if (!info) {
-      return [];
-    }
-    const mappings = this.mappings();
-    if (info.reverseMappings === null) {
-      const indexes = Array(mappings.length).fill(0).map((_, i) => i);
-      info.reverseMappings = indexes.filter(i => mappings[i].sourceURL === sourceURL).sort(sourceMappingComparator);
+  #computeReverseMappings(mappings: SourceMapEntry[]): void {
+    const reverseMappingsPerUrl = new Map<Platform.DevToolsPath.UrlString, number[]>();
+    for (let i = 0; i < mappings.length; i++) {
+      const entryUrl = mappings[i].sourceURL;
+      if (!entryUrl) {
+        continue;
+      }
+      let reverseMap = reverseMappingsPerUrl.get(entryUrl);
+      if (!reverseMap) {
+        reverseMap = [];
+        reverseMappingsPerUrl.set(entryUrl, reverseMap);
+      }
+      reverseMap.push(i);
     }
 
-    return info.reverseMappings;
+    for (const [url, reverseMap] of reverseMappingsPerUrl.entries()) {
+      const info = this.#sourceInfos.get(url);
+      if (!info) {
+        continue;
+      }
+      reverseMap.sort(sourceMappingComparator);
+      info.reverseMappings = reverseMap;
+    }
 
     function sourceMappingComparator(indexA: number, indexB: number): number {
       const a = mappings[indexA];
       const b = mappings[indexB];
-      if (a.sourceLineNumber !== b.sourceLineNumber) {
-        return a.sourceLineNumber - b.sourceLineNumber;
-      }
-      if (a.sourceColumnNumber !== b.sourceColumnNumber) {
-        return a.sourceColumnNumber - b.sourceColumnNumber;
-      }
-
-      if (a.lineNumber !== b.lineNumber) {
-        return a.lineNumber - b.lineNumber;
-      }
-
-      return a.columnNumber - b.columnNumber;
+      return a.sourceLineNumber - b.sourceLineNumber || a.sourceColumnNumber - b.sourceColumnNumber ||
+          a.lineNumber - b.lineNumber || a.columnNumber - b.columnNumber;
     }
   }
 
@@ -392,7 +454,7 @@ export class TextSourceMap implements SourceMap {
       if (this.#sourceInfos.has(url)) {
         continue;
       }
-      this.#sourceInfos.set(url, new TextSourceMap.SourceInfo(source || null, null));
+      this.#sourceInfos.set(url, new TextSourceMap.SourceInfo(source ?? null));
       sourcesList.push(url);
     }
     sourceMapToSourceList.set(sourceMap, sourcesList);
@@ -560,11 +622,10 @@ export namespace TextSourceMap {
 
   export class SourceInfo {
     content: string|null;
-    reverseMappings: number[]|null;
+    reverseMappings: number[]|null = null;
 
-    constructor(content: string|null, reverseMappings: number[]|null) {
+    constructor(content: string|null) {
       this.content = content;
-      this.reverseMappings = reverseMappings;
     }
   }
 }

package/front_end/generated/InspectorBackendCommands.js

@@ -732,6 +732,7 @@ export function registerCommands(inspectorBackend) {
   inspectorBackend.registerEvent('DOM.documentUpdated', []);
   inspectorBackend.registerEvent('DOM.inlineStyleInvalidated', ['nodeIds']);
   inspectorBackend.registerEvent('DOM.pseudoElementAdded', ['parentId', 'pseudoElement']);
+  inspectorBackend.registerEvent('DOM.topLayerElementsUpdated', []);
   inspectorBackend.registerEvent('DOM.pseudoElementRemoved', ['parentId', 'pseudoElementId']);
   inspectorBackend.registerEvent('DOM.setChildNodes', ['parentId', 'nodes']);
   inspectorBackend.registerEvent('DOM.shadowRootPopped', ['hostId', 'rootId']);
@@ -875,6 +876,7 @@ export function registerCommands(inspectorBackend) {
         {'name': 'selector', 'type': 'string', 'optional': false}
       ],
       ['nodeIds']);
+  inspectorBackend.registerCommand('DOM.getTopLayerElements', [], ['nodeIds']);
   inspectorBackend.registerCommand('DOM.redo', [], []);
   inspectorBackend.registerCommand(
       'DOM.removeAttribute',
@@ -2114,6 +2116,7 @@ export function registerCommands(inspectorBackend) {
     EncryptedMedia: 'encrypted-media',
     ExecutionWhileOutOfViewport: 'execution-while-out-of-viewport',
     ExecutionWhileNotRendered: 'execution-while-not-rendered',
+    FederatedCredentials: 'federated-credentials',
     FocusWithoutUserActivation: 'focus-without-user-activation',
     Fullscreen: 'fullscreen',
     Frobulate: 'frobulate',
@@ -2378,7 +2381,7 @@ export function registerCommands(inspectorBackend) {
   inspectorBackend.registerEvent('Page.domContentEventFired', ['timestamp']);
   inspectorBackend.registerEnum(
       'Page.FileChooserOpenedEventMode', {SelectSingle: 'selectSingle', SelectMultiple: 'selectMultiple'});
-  inspectorBackend.registerEvent('Page.fileChooserOpened', ['frameId', 'backendNodeId', 'mode']);
+  inspectorBackend.registerEvent('Page.fileChooserOpened', ['frameId', 'mode', 'backendNodeId']);
   inspectorBackend.registerEvent('Page.frameAttached', ['frameId', 'parentFrameId', 'stack', 'adScriptId']);
   inspectorBackend.registerEvent('Page.frameClearedScheduledNavigation', ['frameId']);
   inspectorBackend.registerEnum('Page.FrameDetachedEventReason', {Remove: 'remove', Swap: 'swap'});
@@ -3297,9 +3300,10 @@ export function registerCommands(inspectorBackend) {
       [
         {'name': 'scriptId', 'type': 'string', 'optional': false},
         {'name': 'scriptSource', 'type': 'string', 'optional': false},
-        {'name': 'dryRun', 'type': 'boolean', 'optional': true}
+        {'name': 'dryRun', 'type': 'boolean', 'optional': true},
+        {'name': 'allowTopFrameEditing', 'type': 'boolean', 'optional': true}
       ],
-      ['callFrames', 'stackChanged', 'asyncStackTrace', 'asyncStackTraceId', 'exceptionDetails']);
+      ['callFrames', 'stackChanged', 'asyncStackTrace', 'asyncStackTraceId', 'status', 'exceptionDetails']);
   inspectorBackend.registerCommand(
       'Debugger.setSkipAllPauses', [{'name': 'skip', 'type': 'boolean', 'optional': false}], []);
   inspectorBackend.registerCommand(

package/front_end/generated/protocol-mapping.d.ts

@@ -124,6 +124,10 @@ export namespace ProtocolMapping {
      * Called when a pseudo element is added to an element.
      */
     'DOM.pseudoElementAdded': [Protocol.DOM.PseudoElementAddedEvent];
+    /**
+     * Called when top layer elements are changed.
+     */
+    'DOM.topLayerElementsUpdated': [];
     /**
      * Called when a pseudo element is removed from an element.
      */
@@ -1266,6 +1270,12 @@ export namespace ProtocolMapping {
      */
     'DOM.querySelectorAll':
         {paramsType: [Protocol.DOM.QuerySelectorAllRequest]; returnType: Protocol.DOM.QuerySelectorAllResponse;};
+    /**
+     * Returns NodeIds of current top layer elements.
+     * Top layer is rendered closest to the user within a viewport, therefore its elements always
+     * appear on top of all other content.
+     */
+    'DOM.getTopLayerElements': {paramsType: []; returnType: Protocol.DOM.GetTopLayerElementsResponse;};
     /**
      * Re-does the last undone action.
      */
@@ -2961,6 +2971,12 @@ export namespace ProtocolMapping {
     'Debugger.setReturnValue': {paramsType: [Protocol.Debugger.SetReturnValueRequest]; returnType: void;};
     /**
      * Edits JavaScript source live.
+     *
+     * In general, functions that are currently on the stack can not be edited with
+     * a single exception: If the edited function is the top-most stack frame and
+     * that is the only activation of that function on the stack. In this case
+     * the live edit will be successful and a `Debugger.restartFrame` for the
+     * top-most function is automatically triggered.
      */
     'Debugger.setScriptSource': {
       paramsType: [Protocol.Debugger.SetScriptSourceRequest]; returnType: Protocol.Debugger.SetScriptSourceResponse;

package/front_end/generated/protocol-proxy-api.d.ts

@@ -959,6 +959,13 @@ declare namespace ProtocolProxyApi {
     invoke_querySelectorAll(params: Protocol.DOM.QuerySelectorAllRequest):
         Promise<Protocol.DOM.QuerySelectorAllResponse>;
 
+    /**
+     * Returns NodeIds of current top layer elements.
+     * Top layer is rendered closest to the user within a viewport, therefore its elements always
+     * appear on top of all other content.
+     */
+    invoke_getTopLayerElements(): Promise<Protocol.DOM.GetTopLayerElementsResponse>;
+
     /**
      * Re-does the last undone action.
      */
@@ -1128,6 +1135,11 @@ declare namespace ProtocolProxyApi {
      */
     pseudoElementAdded(params: Protocol.DOM.PseudoElementAddedEvent): void;
 
+    /**
+     * Called when top layer elements are changed.
+     */
+    topLayerElementsUpdated(): void;
+
     /**
      * Called when a pseudo element is removed from an element.
      */
@@ -3785,6 +3797,12 @@ declare namespace ProtocolProxyApi {
 
     /**
      * Edits JavaScript source live.
+     *
+     * In general, functions that are currently on the stack can not be edited with
+     * a single exception: If the edited function is the top-most stack frame and
+     * that is the only activation of that function on the stack. In this case
+     * the live edit will be successful and a `Debugger.restartFrame` for the
+     * top-most function is automatically triggered.
      */
     invoke_setScriptSource(params: Protocol.Debugger.SetScriptSourceRequest):
         Promise<Protocol.Debugger.SetScriptSourceResponse>;

package/front_end/generated/protocol.ts

@@ -3783,6 +3783,13 @@ export namespace DOM {
     nodeIds: NodeId[];
   }
 
+  export interface GetTopLayerElementsResponse extends ProtocolResponseWithError {
+    /**
+     * NodeIds of top layer elements
+     */
+    nodeIds: NodeId[];
+  }
+
   export interface RemoveAttributeRequest {
     /**
      * Id of the element to remove attribute from.
@@ -10243,6 +10250,7 @@ export namespace Page {
     EncryptedMedia = 'encrypted-media',
     ExecutionWhileOutOfViewport = 'execution-while-out-of-viewport',
     ExecutionWhileNotRendered = 'execution-while-not-rendered',
+    FederatedCredentials = 'federated-credentials',
     FocusWithoutUserActivation = 'focus-without-user-activation',
     Fullscreen = 'fullscreen',
     Frobulate = 'frobulate',
@@ -11772,14 +11780,14 @@ export namespace Page {
      * Id of the frame containing input node.
      */
     frameId: FrameId;
-    /**
-     * Input node id.
-     */
-    backendNodeId: DOM.BackendNodeId;
     /**
      * Input mode.
      */
     mode: FileChooserOpenedEventMode;
+    /**
+     * Input node id. Only present for file choosers opened via an <input type="file"> element.
+     */
+    backendNodeId?: DOM.BackendNodeId;
   }
 
   /**
@@ -15298,6 +15306,13 @@ export namespace Debugger {
     newValue: Runtime.CallArgument;
   }
 
+  export const enum SetScriptSourceResponseStatus {
+    Ok = 'Ok',
+    CompileError = 'CompileError',
+    BlockedByActiveGenerator = 'BlockedByActiveGenerator',
+    BlockedByActiveFunction = 'BlockedByActiveFunction',
+  }
+
   export interface SetScriptSourceRequest {
     /**
      * Id of the script to edit.
@@ -15312,6 +15327,11 @@ export namespace Debugger {
      * description without actually modifying the code.
      */
     dryRun?: boolean;
+    /**
+     * If true, then `scriptSource` is allowed to change the function on top of the stack
+     * as long as the top-most stack frame is the only activation of that function.
+     */
+    allowTopFrameEditing?: boolean;
   }
 
   export interface SetScriptSourceResponse extends ProtocolResponseWithError {
@@ -15332,7 +15352,13 @@ export namespace Debugger {
      */
     asyncStackTraceId?: Runtime.StackTraceId;
     /**
-     * Exception details if any.
+     * Whether the operation was successful or not. Only `Ok` denotes a
+     * successful live edit while the other enum variants denote why
+     * the live edit failed.
+     */
+    status: SetScriptSourceResponseStatus;
+    /**
+     * Exception details if any. Only present when `status` is `CompileError`.
      */
     exceptionDetails?: Runtime.ExceptionDetails;
   }

package/front_end/models/bindings/ResourceScriptMapping.ts

@@ -316,12 +316,11 @@ export class ResourceScriptFile extends Common.ObjectWrapper.ObjectWrapper<Resou
     if (!this.scriptInternal) {
       return;
     }
-    const debuggerModel = this.#resourceScriptMapping.debuggerModel;
     const breakpoints = BreakpointManager.instance()
                             .breakpointLocationsForUISourceCode(this.#uiSourceCodeInternal)
                             .map(breakpointLocation => breakpointLocation.breakpoint);
     const source = this.#uiSourceCodeInternal.workingCopy();
-    debuggerModel.setScriptSource(this.scriptInternal.scriptId, source, (error, exceptionDetails) => {
+    void this.scriptInternal.editSource(source).then(({error, exceptionDetails}) => {
       void this.scriptSourceWasSet(source, breakpoints, error, exceptionDetails);
     });
   }

package/front_end/models/emulation/EmulatedDevices.ts

@@ -1554,19 +1554,6 @@ const emulatedDevices = [
         'Mozilla/5.0 (Linux; U; en-us; KFAPWI Build/JDQ39) AppleWebKit/535.19 (KHTML, like Gecko) Silk/3.13 Safari/535.19 Silk-Accelerated=true',
     'type': 'tablet',
   },
-  {
-    'show-by-default': false,
-    'title': 'iPad Mini',
-    'screen': {
-      'horizontal': {'width': 1024, 'height': 768},
-      'device-pixel-ratio': 2,
-      'vertical': {'width': 768, 'height': 1024},
-    },
-    'capabilities': ['touch', 'mobile'],
-    'user-agent':
-        'Mozilla/5.0 (iPad; CPU OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1',
-    'type': 'tablet',
-  },
   {
     'order': 140,
     'show-by-default': false,