[sdk] Wire up scope info from AST into the source map

This CL wires up the fallback AST-based scope information into the
source map.

It is slightly awkward: SourceMap and SourceMapManager were on
a generic "client" which in reality is either a SDK.Script or
an SDK.CSSStyleHeader. To be able to pass the SDK.Script to
the SourceMap, we allow creators of the SourceMapManager to
pass a SourceMap factory function. This way, the DebuggerModel
can pass the SDK.Script.

Drive-by: Hide new scope view also behind experiment, since we
now have SourceMapScopesInfo objects without proposal scopes.

[email protected]

Bug: 449575926
Change-Id: I26ba583e36102af293dd487eeb759766e456fce5
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/7021137
Reviewed-by: Philip Pfaffe <[email protected]>
Commit-Queue: Simon Zünd <[email protected]>

Author: szuend

front_end/core/sdk/DebuggerModel.ts

@@ -16,6 +16,7 @@ import {Events as ResourceTreeModelEvents, ResourceTreeModel} from './ResourceTr
 import {type EvaluationOptions, type EvaluationResult, type ExecutionContext, RuntimeModel} from './RuntimeModel.js';
 import {Script} from './Script.js';
 import {SDKModel} from './SDKModel.js';
+import {SourceMap} from './SourceMap.js';
 import {SourceMapManager} from './SourceMapManager.js';
 import {Capability, type Target, Type} from './Target.js';
 
@@ -169,7 +170,10 @@ export class DebuggerModel extends SDKModel<EventTypes> {
     this.agent = target.debuggerAgent();
     this.#runtimeModel = (target.model(RuntimeModel) as RuntimeModel);
 
-    this.#sourceMapManager = new SourceMapManager(target);
+    this.#sourceMapManager = new SourceMapManager(
+        target,
+        (compiledURL, sourceMappingURL, payload, script) =>
+            new SourceMap(compiledURL, sourceMappingURL, payload, script));
 
     Common.Settings.Settings.instance()
         .moduleSetting('pause-on-exception-enabled')

front_end/core/sdk/SourceMap.test.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Formatter from '../../models/formatter/formatter.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
 import {describeWithEnvironment} from '../../testing/EnvironmentHelpers.js';
 import {encodeSourceMap} from '../../testing/SourceMapEncoder.js';
@@ -1347,4 +1348,30 @@ describeWithEnvironment('SourceMap', () => {
 
     assert.doesNotThrow(() => sourceMap.mappings());
   });
+
+  it('builds scopes fallback when the source map does not have any scope information', async () => {
+    const scopeTreeStub = sinon.stub(Formatter.FormatterWorkerPool.formatterWorkerPool(), 'javaScriptScopeTree')
+                              .returns(Promise.resolve({start: 0, end: 10, variables: [], kind: 1, children: []}));
+    const script = sinon.createStubInstance(SDK.Script.Script, {
+      requestContentData: Promise.resolve(
+          new TextUtils.ContentData.ContentData('function f() { console.log("hello"); }', false, 'text/javascript'))
+    });
+    const sourceMap = new SDK.SourceMap.SourceMap(
+        compiledUrl, sourceMapJsonUrl, {
+          version: 3,
+          mappings: 'ACAA',  // [0, 1, 0, 0]
+          sources: [],
+          names: [],
+        },
+        script);
+
+    sinon.assert.notCalled(scopeTreeStub);
+
+    // Trigger processing.
+    assert.isNotNull(sourceMap.findEntry(0, 0));
+    await new Promise(r => setTimeout(r, 0));  // Wait one event loop tick.
+
+    assert.isTrue(sourceMap.hasScopeInfo());
+    sinon.assert.calledOnceWithExactly(scopeTreeStub, 'function f() { console.log("hello"); }', 'script');
+  });
 });

front_end/core/sdk/SourceMap.ts

@@ -9,6 +9,8 @@ import * as Platform from '../platform/platform.js';
 import * as Root from '../root/root.js';
 
 import type {CallFrame, ScopeChainEntry} from './DebuggerModel.js';
+import {scopeTreeForScript} from './ScopeTreeCache.js';
+import type {Script} from './Script.js';
 import {buildOriginalScopes, decodePastaRanges, type NamedFunctionRange} from './SourceMapFunctionRanges.js';
 import {SourceMapScopesInfo} from './SourceMapScopesInfo.js';
 
@@ -131,18 +133,22 @@ export class SourceMap {
   readonly #sourceInfos: SourceInfo[] = [];
   readonly #sourceInfoByURL = new Map<Platform.DevToolsPath.UrlString, SourceInfo>();
 
+  readonly #script?: Script;
   #scopesInfo: SourceMapScopesInfo|null = null;
 
   readonly #debugId?: DebugId;
 
+  scopesFallbackPromiseForTest?: Promise<unknown>;
+
   /**
    * Implements Source Map V3 model. See https://github.com/google/closure-compiler/wiki/Source-Maps
    * for format description.
    */
   constructor(
       compiledURL: Platform.DevToolsPath.UrlString, sourceMappingURL: Platform.DevToolsPath.UrlString,
-      payload: SourceMapV3) {
+      payload: SourceMapV3, script?: Script) {
     this.#json = payload;
+    this.#script = script;
     this.#compiledURL = compiledURL;
     this.#sourceMappingURL = sourceMappingURL;
     this.#baseURL = (Common.ParsedURL.schemeIs(sourceMappingURL, 'data:')) ? compiledURL : sourceMappingURL;
@@ -163,7 +169,7 @@ export class SourceMap {
   }
 
   augmentWithScopes(scriptUrl: Platform.DevToolsPath.UrlString, ranges: NamedFunctionRange[]): void {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     if (this.#json && this.#json.version > 3) {
       throw new Error('Only support augmenting source maps up to version 3.');
     }
@@ -212,12 +218,12 @@ export class SourceMap {
   }
 
   hasScopeInfo(): boolean {
-    this.#ensureMappingsProcessed();
-    return this.#scopesInfo !== null;
+    this.#ensureSourceMapProcessed();
+    return this.#scopesInfo !== null && !this.#scopesInfo.isEmpty();
   }
 
   findEntry(lineNumber: number, columnNumber: number, inlineFrameIndex?: number): SourceMapEntry|null {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     if (inlineFrameIndex && this.#scopesInfo !== null) {
       // For inlineFrameIndex != 0 we use the callsite info for the corresponding inlining site.
       // Note that the callsite for "inlineFrameIndex" is actually in the previous frame.
@@ -372,20 +378,40 @@ export class SourceMap {
   }
 
   mappings(): SourceMapEntry[] {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     return this.#mappings ?? [];
   }
 
+  /**
+   * If the source map does not contain scope information by itself (e.g. "scopes proposal"
+   * or "pasta" scopes), then we'll use this getter to calculate basic function name information from
+   * the AST and mappings.
+   */
+  async #buildScopesFallback(): Promise<SourceMapScopesInfo|null> {
+    const scopeTreeAndText = this.#script ? await scopeTreeForScript(this.#script) : null;
+    if (!scopeTreeAndText) {
+      return null;
+    }
+
+    const {scopeTree, text} = scopeTreeAndText;
+    return SourceMapScopesInfo.createFromAst(this, scopeTree, text);
+  }
+
   private reversedMappings(sourceURL: Platform.DevToolsPath.UrlString): number[] {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     return this.#sourceInfoByURL.get(sourceURL)?.reverseMappings ?? [];
   }
 
-  #ensureMappingsProcessed(): void {
+  #ensureSourceMapProcessed(): void {
     if (this.#mappings === null) {
       this.#mappings = [];
       try {
         this.eachSection(this.parseMap.bind(this));
+        if (!this.hasScopeInfo()) {
+          this.scopesFallbackPromiseForTest = this.#buildScopesFallback().then(info => {
+            this.#scopesInfo = info;
+          });
+        }
       } catch (e) {
         console.error('Failed to parse source map', e);
         this.#mappings = [];
@@ -728,7 +754,7 @@ export class SourceMap {
   }
 
   expandCallFrame(frame: CallFrame): CallFrame[] {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     if (this.#scopesInfo === null) {
       return [frame];
     }
@@ -737,7 +763,7 @@ export class SourceMap {
   }
 
   resolveScopeChain(frame: CallFrame): ScopeChainEntry[]|null {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     if (this.#scopesInfo === null) {
       return null;
     }
@@ -746,7 +772,7 @@ export class SourceMap {
   }
 
   findOriginalFunctionName(position: ScopesCodec.Position): string|null {
-    this.#ensureMappingsProcessed();
+    this.#ensureSourceMapProcessed();
     return this.#scopesInfo?.findOriginalFunctionName(position) ?? null;
   }
 }

front_end/core/sdk/SourceMapManager.ts

@@ -11,17 +11,24 @@ import {type DebugId, parseSourceMap, SourceMap, type SourceMapV3} from './Sourc
 import {SourceMapCache} from './SourceMapCache.js';
 import {type Target, Type} from './Target.js';
 
+export type SourceMapFactory<T> =
+    (compiledURL: Platform.DevToolsPath.UrlString, sourceMappingURL: Platform.DevToolsPath.UrlString,
+     payload: SourceMapV3, client: T) => SourceMap;
+
 export class SourceMapManager<T extends FrameAssociated> extends Common.ObjectWrapper.ObjectWrapper<EventTypes<T>> {
   readonly #target: Target;
+  readonly #factory: SourceMapFactory<T>;
   #isEnabled = true;
   readonly #clientData = new Map<T, ClientData>();
   readonly #sourceMaps = new Map<SourceMap, T>();
   #attachingClient: T|null = null;
 
-  constructor(target: Target) {
+  constructor(target: Target, factory?: SourceMapFactory<T>) {
     super();
 
     this.#target = target;
+    this.#factory =
+        factory ?? ((compiledURL, sourceMappingURL, payload) => new SourceMap(compiledURL, sourceMappingURL, payload));
   }
 
   setEnabled(isEnabled: boolean): void {
@@ -109,7 +116,7 @@ export class SourceMapManager<T extends FrameAssociated> extends Common.ObjectWr
               loadSourceMap(sourceMapURL, client.debugId(), initiator)
                   .then(
                       payload => {
-                        const sourceMap = new SourceMap(sourceURL, sourceMapURL, payload);
+                        const sourceMap = this.#factory(sourceURL, sourceMapURL, payload, client);
                         if (this.#clientData.get(client) === clientData) {
                           clientData.sourceMap = sourceMap;
                           this.#sourceMaps.set(sourceMap, client);
@@ -167,6 +174,10 @@ export class SourceMapManager<T extends FrameAssociated> extends Common.ObjectWr
       this.dispatchEventToListeners(Events.SourceMapFailedToAttach, {client});
     }
   }
+
+  waitForSourceMapsProcessedForTest(): Promise<unknown> {
+    return Promise.all(this.#sourceMaps.keys().map(sourceMap => sourceMap.scopesFallbackPromiseForTest));
+  }
 }
 
 export async function loadSourceMap(

front_end/core/sdk/SourceMapScopesInfo.ts

@@ -95,6 +95,10 @@ export class SourceMapScopesInfo {
     return Boolean(this.#originalScopes[sourceIdx]);
   }
 
+  isEmpty(): boolean {
+    return !this.#originalScopes.length && !this.#generatedRanges.length;
+  }
+
   addOriginalScopesAtIndex(sourceIdx: number, scope: ScopesCodec.OriginalScope): void {
     if (!this.#originalScopes[sourceIdx]) {
       this.#originalScopes[sourceIdx] = scope;

front_end/models/bindings/CompilerScriptMapping.test.ts

@@ -8,7 +8,7 @@ import type * as Protocol from '../../generated/protocol.js';
 import {createTarget} from '../../testing/EnvironmentHelpers.js';
 import {describeWithMockConnection} from '../../testing/MockConnection.js';
 import {MockProtocolBackend} from '../../testing/MockScopeChain.js';
-import {encodeSourceMap} from '../../testing/SourceMapEncoder.js';
+import {encodeSourceMap, waitForAllSourceMapsProcessed} from '../../testing/SourceMapEncoder.js';
 import * as TextUtils from '../text_utils/text_utils.js';
 import * as Workspace from '../workspace/workspace.js';
 
@@ -35,6 +35,10 @@ describeWithMockConnection('CompilerScriptMapping', () => {
     backend = new MockProtocolBackend();
   });
 
+  afterEach(async () => {
+    await waitForAllSourceMapsProcessed();
+  });
+
   const waitForUISourceCodeAdded =
       (url: string, target: SDK.Target.Target): Promise<Workspace.UISourceCode.UISourceCode> =>
           debuggerWorkspaceBinding.waitForUISourceCodeAdded(urlString`${url}`, target);

front_end/models/source_map_scopes/NamesResolver.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Protocol from '../../generated/protocol.js';
 import * as Bindings from '../bindings/bindings.js';
@@ -370,7 +371,9 @@ export const resolveScopeChain =
     return scopeChain;
   }
 
-  scopeChain = callFrame.script.sourceMap()?.resolveScopeChain(callFrame);
+  scopeChain = Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.USE_SOURCE_MAP_SCOPES) ?
+      callFrame.script.sourceMap()?.resolveScopeChain(callFrame) :
+      null;
   if (scopeChain) {
     return scopeChain;
   }

front_end/testing/SourceMapEncoder.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import type * as SDK from '../core/sdk/sdk.js';
+import * as SDK from '../core/sdk/sdk.js';
 
 const base64Digits = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
 
@@ -130,3 +130,10 @@ export function encodeSourceMap(textMap: string[], sourceRoot?: string): SDK.Sou
     return array.length - 1;
   }
 }
+
+export function waitForAllSourceMapsProcessed(): Promise<unknown> {
+  return Promise.all(SDK.TargetManager.TargetManager.instance().targets().map(target => {
+    const model = target.model(SDK.DebuggerModel.DebuggerModel) as SDK.DebuggerModel.DebuggerModel;
+    return model.sourceMapManager().waitForSourceMapsProcessedForTest();
+  }));
+}