chrome-devtools-frontend 1.0.1556696 → 1.0.1558690

package/front_end/models/stack_trace/StackTraceModel.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 Common from '../../core/common/common.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 
@@ -32,6 +33,7 @@ export type TranslateRawFrames = (frames: readonly RawFrame[], target: SDK.Targe
  */
 export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   readonly #trie = new Trie();
+  readonly #mutex = new Common.Mutex.Mutex();
 
   /** @returns the {@link StackTraceModel} for the target, or the model for the primaryPageTarget when passing null/undefined */
   static #modelForTarget(target: SDK.Target.Target|null|undefined): StackTraceModel {
@@ -45,7 +47,7 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
   async createFromProtocolRuntime(stackTrace: Protocol.Runtime.StackTrace, rawFramesToUIFrames: TranslateRawFrames):
       Promise<StackTrace.StackTrace.StackTrace> {
     const [syncFragment, asyncFragments] = await Promise.all([
-      this.#createSyncFragment(stackTrace, rawFramesToUIFrames),
+      this.#createFragment(stackTrace.callFrames, rawFramesToUIFrames),
       this.#createAsyncFragments(stackTrace, rawFramesToUIFrames),
     ]);
 
@@ -65,53 +67,51 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
 
   /** Trigger re-translation of all fragments with the provide script in their call stack */
   async scriptInfoChanged(script: SDK.Script.Script, translateRawFrames: TranslateRawFrames): Promise<void> {
-    const translatePromises: Array<Promise<unknown>> = [];
-    let stackTracesToUpdate = new Set<AnyStackTraceImpl>();
-
-    for (const fragment of this.#affectedFragments(script)) {
-      // We trigger re-translation only for fragments of leaf-nodes. Any fragment along the ancestor-chain
-      // is re-translated as a side-effect.
-      // We just need to remember the stack traces of the skipped over fragments, so we can send the
-      // UPDATED event also to them.
-      if (fragment.node.children.length === 0) {
-        translatePromises.push(this.#translateFragment(fragment, translateRawFrames));
+    const release = await this.#mutex.acquire();
+    try {
+      const translatePromises: Array<Promise<unknown>> = [];
+      let stackTracesToUpdate = new Set<AnyStackTraceImpl>();
+
+      for (const fragment of this.#affectedFragments(script)) {
+        // We trigger re-translation only for fragments of leaf-nodes. Any fragment along the ancestor-chain
+        // is re-translated as a side-effect.
+        // We just need to remember the stack traces of the skipped over fragments, so we can send the
+        // UPDATED event also to them.
+        if (fragment.node.children.length === 0) {
+          translatePromises.push(this.#translateFragment(fragment, translateRawFrames));
+        }
+        stackTracesToUpdate = stackTracesToUpdate.union(fragment.stackTraces);
       }
-      stackTracesToUpdate = stackTracesToUpdate.union(fragment.stackTraces);
-    }
 
-    await Promise.all(translatePromises);
+      await Promise.all(translatePromises);
 
-    for (const stackTrace of stackTracesToUpdate) {
-      stackTrace.dispatchEventToListeners(StackTrace.StackTrace.Events.UPDATED);
+      for (const stackTrace of stackTracesToUpdate) {
+        stackTrace.dispatchEventToListeners(StackTrace.StackTrace.Events.UPDATED);
+      }
+    } finally {
+      release();
     }
   }
 
-  async #createSyncFragment(stackTrace: Protocol.Runtime.StackTrace, rawFramesToUIFrames: TranslateRawFrames):
-      Promise<FragmentImpl> {
-    const fragment = this.#createFragment(stackTrace.callFrames);
-    await this.#translateFragment(fragment, rawFramesToUIFrames);
-    return fragment;
-  }
-
   async #createDebuggableFragment(
       pausedDetails: SDK.DebuggerModel.DebuggerPausedDetails,
       rawFramesToUIFrames: TranslateRawFrames): Promise<DebuggableFragmentImpl> {
-    const fragment = this.#createFragment(pausedDetails.callFrames.map(frame => ({
-                                                                         scriptId: frame.script.scriptId,
-                                                                         url: frame.script.sourceURL,
-                                                                         functionName: frame.functionName,
-                                                                         lineNumber: frame.location().lineNumber,
-                                                                         columnNumber: frame.location().columnNumber,
-                                                                       })));
-    await this.#translateFragment(fragment, rawFramesToUIFrames);
+    const fragment = await this.#createFragment(
+        pausedDetails.callFrames.map(frame => ({
+                                       scriptId: frame.script.scriptId,
+                                       url: frame.script.sourceURL,
+                                       functionName: frame.functionName,
+                                       lineNumber: frame.location().lineNumber,
+                                       columnNumber: frame.location().columnNumber,
+                                     })),
+        rawFramesToUIFrames);
     return new DebuggableFragmentImpl(fragment, pausedDetails.callFrames);
   }
 
   async #createAsyncFragments(
       stackTraceOrPausedEvent: Protocol.Runtime.StackTrace|SDK.DebuggerModel.DebuggerPausedDetails,
       rawFramesToUIFrames: TranslateRawFrames): Promise<AsyncFragmentImpl[]> {
-    const asyncFragments: AsyncFragmentImpl[] = [];
-    const translatePromises: Array<Promise<unknown>> = [];
+    const asyncFragments: Array<Promise<AsyncFragmentImpl>> = [];
 
     const debuggerModel = this.target().model(SDK.DebuggerModel.DebuggerModel);
     if (debuggerModel) {
@@ -122,18 +122,31 @@ export class StackTraceModel extends SDK.SDKModel.SDKModel<unknown> {
           continue;
         }
         const model = StackTraceModel.#modelForTarget(target);
-        const fragment = model.#createFragment(asyncStackTrace.callFrames);
-        translatePromises.push(model.#translateFragment(fragment, rawFramesToUIFrames));
-        asyncFragments.push(new AsyncFragmentImpl(asyncStackTrace.description ?? '', fragment));
+        const asyncFragmentPromise =
+            model.#createFragment(asyncStackTrace.callFrames, rawFramesToUIFrames)
+                .then(fragment => new AsyncFragmentImpl(asyncStackTrace.description ?? '', fragment));
+        asyncFragments.push(asyncFragmentPromise);
       }
     }
 
-    await Promise.all(translatePromises);
-    return asyncFragments;
+    return await Promise.all(asyncFragments);
   }
 
-  #createFragment(frames: RawFrame[]): FragmentImpl {
-    return FragmentImpl.getOrCreate(this.#trie.insert(frames));
+  async #createFragment(frames: RawFrame[], rawFramesToUIFrames: TranslateRawFrames): Promise<FragmentImpl> {
+    const release = await this.#mutex.acquire();
+    try {
+      const node = this.#trie.insert(frames);
+      const requiresTranslation = !Boolean(node.fragment);
+      const fragment = FragmentImpl.getOrCreate(node);
+
+      if (requiresTranslation) {
+        await this.#translateFragment(fragment, rawFramesToUIFrames);
+      }
+
+      return fragment;
+    } finally {
+      release();
+    }
   }
 
   async #translateFragment(fragment: FragmentImpl, rawFramesToUIFrames: TranslateRawFrames): Promise<void> {

package/front_end/models/trace/EventsSerializer.ts

@@ -20,9 +20,15 @@ export class EventsSerializer {
     }
 
     const rawEvents = Helpers.SyntheticEvents.SyntheticEventsManager.getActiveManager().getRawTraceEvents();
+    const isSynthetic = Types.Events.isSyntheticBased(event);
+    const index = rawEvents.indexOf(isSynthetic ? event.rawSourceEvent : event);
+    if (index === -1) {
+      throw new Error(`Unknown trace event: ${event.name}`);
+    }
+
     const key: Types.File.SyntheticEventKey|Types.File.RawEventKey = Types.Events.isSyntheticBased(event) ?
-        `${Types.File.EventKeyType.SYNTHETIC_EVENT}-${rawEvents.indexOf(event.rawSourceEvent)}` :
-        `${Types.File.EventKeyType.RAW_EVENT}-${rawEvents.indexOf(event)}`;
+        `${Types.File.EventKeyType.SYNTHETIC_EVENT}-${index}` :
+        `${Types.File.EventKeyType.RAW_EVENT}-${index}`;
     if (key.length < 3) {
       return null;
     }

package/front_end/models/trace/handlers/LayoutShiftsHandler.ts

@@ -443,7 +443,7 @@ async function buildLayoutShiftsClusters(): Promise<void> {
     }
 
     let largestScore = 0;
-    let worstShiftEvent: Types.Events.Event|null = null;
+    let worstShiftEvent: Types.Events.SyntheticLayoutShift|null = null;
 
     for (const shift of cluster.events) {
       weightedScore += shift.args.data ? shift.args.data.weighted_score_delta : 0;
@@ -504,7 +504,7 @@ async function buildLayoutShiftsClusters(): Promise<void> {
     // Update the cluster's worst layout shift.
     if (worstShiftEvent) {
       cluster.worstShiftEvent = worstShiftEvent;
-      cluster.rawSourceEvent = worstShiftEvent;
+      cluster.rawSourceEvent = worstShiftEvent.rawSourceEvent;
     }
 
     // layout shifts are already sorted by time ascending.