Strip browser-loader part in frames url for the Error rep stacktrace.

Fixes #971.

Author: nchevobbe

packages/devtools-reps/src/reps/error.js

@@ -97,7 +97,11 @@ function getStacktraceElements(preview) {
         functionName = line;
       } else {
         functionName = result[1];
-        location = ` (${result[2]})`;
+
+        // If the resource was loaded by base-loader.js, the location looks like:
+        // resource://devtools/shared/base-loader.js -> resource://path/to/file.js .
+        // What's needed is only the last part after " -> ".
+        location = result[2].split(" -> ").pop();
       }
 
       stack.push(
@@ -108,7 +112,7 @@ function getStacktraceElements(preview) {
         span({
           key: "location" + index,
           className: "objectBox-stackTrace-location"
-        }, location)
+        }, ` (${location})`)
       );
     });
 

packages/devtools-reps/src/reps/stubs/error.js

@@ -189,4 +189,24 @@ stubs.set("DOMException", {
   }
 });
 
+stubs.set("base-loader Error", {
+  "type": "object",
+  "actor": "server1.conn1.child1/obj1020",
+  "class": "Error",
+  "ownPropertyLength": 4,
+  "preview": {
+    "kind": "Error",
+    "name": "Error",
+    "message": "Error message",
+    "stack":
+      "onPacket@resource://devtools/shared/base-loader.js -> resource://devtools/shared/client/debugger-client.js:856:9\n" +
+      "send/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/transport/transport.js:569:13\n" +
+      "exports.makeInfallible/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14\n" +
+      "exports.makeInfallible/<@resource://devtools/shared/base-loader.js -> resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14\n",
+    "fileName": "debugger-client.js",
+    "lineNumber": 859,
+    "columnNumber": 9
+  }
+});
+
 module.exports = stubs;

packages/devtools-reps/src/reps/tests/__snapshots__/error.js.snap

@@ -257,3 +257,76 @@ exports[`Error - URI error renders with expected text for URIError 1`] = `
   </span>
 </span>
 `;
+
+exports[`Error - base-loader.js renders as expected in tiny mode 1`] = `
+<span
+  className="objectBox-stackTrace"
+  data-link-actor-id="server1.conn1.child1/obj1020"
+>
+  Error
+</span>
+`;
+
+exports[`Error - base-loader.js renders as expected without mode 1`] = `
+<span
+  className="objectBox-stackTrace"
+  data-link-actor-id="server1.conn1.child1/obj1020"
+>
+  Error: "Error message"
+  
+
+  <span
+    className="objectBox-stackTrace-grid"
+    key="stack"
+  >
+    <span
+      className="objectBox-stackTrace-fn"
+      key="fn0"
+    >
+      onPacket
+    </span>
+    <span
+      className="objectBox-stackTrace-location"
+      key="location0"
+    >
+       (resource://devtools/shared/client/debugger-client.js:856:9)
+    </span>
+    <span
+      className="objectBox-stackTrace-fn"
+      key="fn1"
+    >
+      send/&lt;
+    </span>
+    <span
+      className="objectBox-stackTrace-location"
+      key="location1"
+    >
+       (resource://devtools/shared/transport/transport.js:569:13)
+    </span>
+    <span
+      className="objectBox-stackTrace-fn"
+      key="fn2"
+    >
+      exports.makeInfallible/&lt;
+    </span>
+    <span
+      className="objectBox-stackTrace-location"
+      key="location2"
+    >
+       (resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14)
+    </span>
+    <span
+      className="objectBox-stackTrace-fn"
+      key="fn3"
+    >
+      exports.makeInfallible/&lt;
+    </span>
+    <span
+      className="objectBox-stackTrace-location"
+      key="location3"
+    >
+       (resource://devtools/shared/ThreadSafeDevToolsUtils.js:109:14)
+    </span>
+  </span>
+</span>
+`;

packages/devtools-reps/src/reps/tests/error.js

@@ -311,3 +311,24 @@ describe("Error - DOMException", () => {
     expect(renderedComponent.text()).toEqual("DOMException");
   });
 });
+
+describe("Error - base-loader.js", () => {
+  const stub = stubs.get("base-loader Error");
+
+  it("renders as expected without mode", () => {
+    const renderedComponent = shallow(ErrorRep.rep({
+      object: stub
+    }));
+
+    expect(renderedComponent).toMatchSnapshot();
+  });
+
+  it("renders as expected in tiny mode", () => {
+    const renderedComponent = shallow(ErrorRep.rep({
+      object: stub,
+      mode: MODE.TINY
+    }));
+
+    expect(renderedComponent).toMatchSnapshot();
+  });
+});