Split Source into Source/SourceActor, and Breakpoint into Breakpoint/BreakpointActor (firefox-devtools#7796)

Author: bhackett1024

src/actions/ast/setPausePoints.js

@@ -4,7 +4,7 @@
 
 // @flow
 
-import { getSourceFromId } from "../../selectors";
+import { getSourceFromId, getSourceActors } from "../../selectors";
 import * as parser from "../../workers/parser";
 import { isGenerated } from "../../utils/source";
 import { convertToList } from "../../utils/pause/pausePoints";
@@ -62,7 +62,9 @@ export function setPausePoints(sourceId: SourceId) {
 
     if (isGenerated(source)) {
       const compressed = compressPausePoints(pausePoints);
-      await client.setPausePoints(sourceId, compressed);
+      for (const sourceActor of getSourceActors(getState(), sourceId)) {
+        await client.setPausePoints(sourceActor, compressed);
+      }
     }
 
     pausePoints = await mapLocations(

src/actions/breakpoints/addBreakpoint.js

@@ -11,11 +11,14 @@ import {
   assertBreakpoint,
   createBreakpoint,
   getASTLocation,
-  assertLocation
+  assertLocation,
+  makeLocationId,
+  makeSourceActorLocation
 } from "../../utils/breakpoint";
 import { PROMISE } from "../utils/middleware/promise";
 import {
   getSource,
+  getSourceActors,
   getSymbols,
   getFirstPausePointLocation
 } from "../../selectors";
@@ -54,6 +57,12 @@ async function addBreakpointPromise(getState, client, sourceMaps, breakpoint) {
 
   const generatedSource = getSource(state, generatedLocation.sourceId);
 
+  if (!generatedSource) {
+    throw new Error(
+      `Unable to find generated source: ${generatedLocation.sourceId}`
+    );
+  }
+
   assertLocation(location);
   assertLocation(generatedLocation);
 
@@ -63,13 +72,23 @@ async function addBreakpointPromise(getState, client, sourceMaps, breakpoint) {
     return { breakpoint: newBreakpoint };
   }
 
-  const { id, actualLocation } = await client.setBreakpoint(
-    generatedLocation,
-    breakpoint.options,
-    isOriginalId(location.sourceId)
-  );
+  const sourceActors = getSourceActors(state, generatedSource.id);
+  const newGeneratedLocation = { ...generatedLocation };
+
+  for (const sourceActor of sourceActors) {
+    const sourceActorLocation = makeSourceActorLocation(
+      sourceActor,
+      generatedLocation
+    );
+    const { actualLocation } = await client.setBreakpoint(
+      sourceActorLocation,
+      breakpoint.options,
+      isOriginalId(location.sourceId)
+    );
+    newGeneratedLocation.line = actualLocation.line;
+    newGeneratedLocation.column = actualLocation.column;
+  }
 
-  const newGeneratedLocation = actualLocation || generatedLocation;
   const newLocation = await sourceMaps.getOriginalLocation(
     newGeneratedLocation
   );
@@ -78,10 +97,10 @@ async function addBreakpointPromise(getState, client, sourceMaps, breakpoint) {
   const astLocation = await getASTLocation(source, symbols, newLocation);
 
   const originalText = getTextAtPosition(source, location);
-  const text = getTextAtPosition(generatedSource, actualLocation);
+  const text = getTextAtPosition(generatedSource, newGeneratedLocation);
 
   const newBreakpoint = {
-    id,
+    id: makeLocationId(generatedLocation),
     disabled: false,
     loading: false,
     options: breakpoint.options,

src/actions/breakpoints/index.js

@@ -17,9 +17,14 @@ import {
   getSelectedSource,
   getBreakpointAtLocation,
   getConditionalPanelLocation,
-  getBreakpointsForSource
+  getBreakpointsForSource,
+  getSourceActors
 } from "../../selectors";
-import { assertBreakpoint, createXHRBreakpoint } from "../../utils/breakpoint";
+import {
+  assertBreakpoint,
+  createXHRBreakpoint,
+  makeSourceActorLocation
+} from "../../utils/breakpoint";
 import {
   addBreakpoint,
   addHiddenBreakpoint,
@@ -43,6 +48,22 @@ import type {
 
 import { recordEvent } from "../../utils/telemetry";
 
+async function removeBreakpointsPromise(client, state, breakpoint) {
+  const sourceActors = getSourceActors(
+    state,
+    breakpoint.generatedLocation.sourceId
+  );
+  for (const sourceActor of sourceActors) {
+    const sourceActorLocation = makeSourceActorLocation(
+      sourceActor,
+      breakpoint.generatedLocation
+    );
+    if (client.getBreakpointByLocation(sourceActorLocation)) {
+      await client.removeBreakpoint(sourceActorLocation);
+    }
+  }
+}
+
 /**
  * Remove a single breakpoint
  *
@@ -70,7 +91,7 @@ export function removeBreakpoint(breakpoint: Breakpoint) {
       type: "REMOVE_BREAKPOINT",
       breakpoint,
       disabled: false,
-      [PROMISE]: client.removeBreakpoint(breakpoint.generatedLocation)
+      [PROMISE]: removeBreakpointsPromise(client, getState(), breakpoint)
     });
   };
 }
@@ -87,7 +108,8 @@ export function disableBreakpoint(breakpoint: Breakpoint) {
       return;
     }
 
-    await client.removeBreakpoint(breakpoint.generatedLocation);
+    await removeBreakpointsPromise(client, getState(), breakpoint);
+
     const newBreakpoint: Breakpoint = { ...breakpoint, disabled: true };
 
     return dispatch(
@@ -144,7 +166,7 @@ export function toggleAllBreakpoints(shouldDisableBreakpoints: boolean) {
 
     for (const breakpoint of breakpoints) {
       if (shouldDisableBreakpoints) {
-        await client.removeBreakpoint(breakpoint.generatedLocation);
+        await removeBreakpointsPromise(client, getState(), breakpoint);
         const newBreakpoint: Breakpoint = { ...breakpoint, disabled: true };
         modifiedBreakpoints.push(newBreakpoint);
       } else {
@@ -282,7 +304,19 @@ export function setBreakpointOptions(
       await dispatch(enableBreakpoint(bp));
     }
 
-    await client.setBreakpointOptions(bp.id, location, options);
+    const sourceActors = getSourceActors(
+      getState(),
+      bp.generatedLocation.sourceId
+    );
+    for (const sourceActor of sourceActors) {
+      const sourceActorLocation = makeSourceActorLocation(
+        sourceActor,
+        bp.generatedLocation
+      );
+      if (client.getBreakpointByLocation(sourceActorLocation)) {
+        await client.setBreakpointOptions(sourceActorLocation, options);
+      }
+    }
 
     const newBreakpoint = { ...bp, disabled: false, options };
 

src/actions/breakpoints/syncBreakpoint.js

@@ -8,13 +8,14 @@ import {
   createBreakpoint,
   assertBreakpoint,
   assertPendingBreakpoint,
-  findScopeByName
+  findScopeByName,
+  makeSourceActorLocation
 } from "../../utils/breakpoint";
 
 import { getGeneratedLocation } from "../../utils/source-maps";
 import { getTextAtPosition } from "../../utils/source";
 import { originalToGeneratedId, isOriginalId } from "devtools-source-map";
-import { getSource } from "../../selectors";
+import { getSource, getSourceActors } from "../../selectors";
 import type { ThunkArgs, Action } from "../types";
 
 import type {
@@ -49,7 +50,6 @@ async function makeScopedLocation(
 }
 
 function createSyncData(
-  id: SourceId,
   pendingBreakpoint: PendingBreakpoint,
   location: SourceLocation,
   generatedLocation: SourceLocation,
@@ -60,7 +60,6 @@ function createSyncData(
   const overrides = {
     ...pendingBreakpoint,
     generatedLocation,
-    id,
     text,
     originalText
   };
@@ -121,18 +120,32 @@ export async function syncBreakpointPromise(
     scopedGeneratedLocation
   );
 
-  const existingClient = client.getBreakpointByLocation(generatedLocation);
+  const sourceActors = getSourceActors(getState(), sourceId);
 
   /** ******* CASE 1: No server change ***********/
   // early return if breakpoint is disabled or we are in the sameLocation
-  // send update only to redux
-  if (pendingBreakpoint.disabled || (existingClient && isSameLocation)) {
-    const id = pendingBreakpoint.disabled ? "" : existingClient.id;
+  if (pendingBreakpoint.disabled || isSameLocation) {
+    // Make sure the breakpoint is installed on all source actors.
+    if (!pendingBreakpoint.disabled) {
+      for (const sourceActor of sourceActors) {
+        const sourceActorLocation = makeSourceActorLocation(
+          sourceActor,
+          generatedLocation
+        );
+        if (!client.getBreakpointByLocation(sourceActorLocation)) {
+          await client.setBreakpoint(
+            sourceActorLocation,
+            pendingBreakpoint.options,
+            isOriginalId(sourceId)
+          );
+        }
+      }
+    }
+
     const originalText = getTextAtPosition(source, previousLocation);
     const text = getTextAtPosition(generatedSource, generatedLocation);
 
     return createSyncData(
-      id,
       pendingBreakpoint,
       scopedLocation,
       scopedGeneratedLocation,
@@ -143,8 +156,14 @@ export async function syncBreakpointPromise(
   }
 
   // clear server breakpoints if they exist and we have moved
-  if (existingClient) {
-    await client.removeBreakpoint(generatedLocation);
+  for (const sourceActor of sourceActors) {
+    const sourceActorLocation = makeSourceActorLocation(
+      sourceActor,
+      generatedLocation
+    );
+    if (client.getBreakpointByLocation(sourceActorLocation)) {
+      await client.removeBreakpoint(sourceActorLocation);
+    }
   }
 
   /** ******* Case 2: Add New Breakpoint ***********/
@@ -155,15 +174,23 @@ export async function syncBreakpointPromise(
     return { previousLocation, breakpoint: null };
   }
 
-  const { id, actualLocation } = await client.setBreakpoint(
-    scopedGeneratedLocation,
-    isOriginalId(sourceId),
-    pendingBreakpoint.options
-  );
+  const newGeneratedLocation = { ...scopedGeneratedLocation };
+  for (const sourceActor of sourceActors) {
+    const sourceActorLocation = makeSourceActorLocation(
+      sourceActor,
+      scopedGeneratedLocation
+    );
+    const { actualLocation } = await client.setBreakpoint(
+      sourceActorLocation,
+      pendingBreakpoint.options,
+      isOriginalId(sourceId)
+    );
+    newGeneratedLocation.line = actualLocation.line;
+    newGeneratedLocation.column = actualLocation.column;
+  }
 
   // the breakpoint might have slid server side, so we want to get the location
   // based on the server's return value
-  const newGeneratedLocation = actualLocation;
   const newLocation = await sourceMaps.getOriginalLocation(
     newGeneratedLocation
   );
@@ -172,7 +199,6 @@ export async function syncBreakpointPromise(
   const text = getTextAtPosition(generatedSource, newGeneratedLocation);
 
   return createSyncData(
-    id,
     pendingBreakpoint,
     newLocation,
     newGeneratedLocation,

src/actions/breakpoints/tests/__snapshots__/breakpoints.spec.js.snap

@@ -13,6 +13,7 @@ Object {
   },
   "disabled": false,
   "generatedLocation": Object {
+    "column": undefined,
     "line": 7,
     "sourceId": "a",
     "sourceUrl": "http://localhost:8000/examples/a",
@@ -50,11 +51,12 @@ Array [
         },
         "disabled": false,
         "generatedLocation": Object {
+          "column": undefined,
           "line": 2,
           "sourceId": "a",
           "sourceUrl": "http://localhost:8000/examples/a",
         },
-        "id": "hi",
+        "id": "a:2:",
         "loading": false,
         "location": Object {
           "line": 2,
@@ -104,11 +106,12 @@ Object {
   },
   "disabled": false,
   "generatedLocation": Object {
+    "column": undefined,
     "line": 1,
     "sourceId": "a.js",
     "sourceUrl": "http://localhost:8000/examples/a.js",
   },
-  "id": "hi",
+  "id": "a.js:1:",
   "loading": false,
   "location": Object {
     "column": 0,
@@ -142,11 +145,12 @@ Array [
         },
         "disabled": true,
         "generatedLocation": Object {
+          "column": undefined,
           "line": 5,
           "sourceId": "a",
           "sourceUrl": "http://localhost:8000/examples/a",
         },
-        "id": "hi",
+        "id": "a:5:",
         "loading": false,
         "location": Object {
           "line": 5,

src/actions/breakpoints/tests/__snapshots__/syncing.spec.js.snap

@@ -16,7 +16,7 @@ Object {
       "sourceId": "gen.js",
       "sourceUrl": "http://localhost:8000/gen.js",
     },
-    "id": "foo",
+    "id": "magic.js:3:",
     "loading": false,
     "location": Object {
       "column": undefined,
@@ -57,7 +57,7 @@ Object {
       "sourceId": "gen.js",
       "sourceUrl": "http://localhost:8000/gen.js",
     },
-    "id": "foo",
+    "id": "magic.js:12:",
     "loading": false,
     "location": Object {
       "column": undefined,
@@ -127,7 +127,7 @@ Object {
       "sourceId": "gen.js",
       "sourceUrl": "http://localhost:8000/gen.js",
     },
-    "id": "foo",
+    "id": "magic.js:3:",
     "loading": false,
     "location": Object {
       "column": undefined,
@@ -168,7 +168,7 @@ Object {
       "sourceId": "gen.js",
       "sourceUrl": "http://localhost:8000/gen.js",
     },
-    "id": "gen.js:5:",
+    "id": "magic.js:3:",
     "loading": false,
     "location": Object {
       "column": undefined,