Add initial mochitest for original scope work and fix disabled tests (firefox-devtools#5317)

Author: loganfsmyth

.prettierignore

@@ -1 +1,3 @@
 src/workers/parser/tests/fixtures/functionNames.js
+src/test/mochitest/examples/babel/fixtures/*/output.js
+src/test/mochitest/examples/babel/fixtures/*/output.js.map

src/actions/pause/mapScopes.js

@@ -227,10 +227,20 @@ async function findGeneratedBinding(
         return null;
       }
 
-      return generatedAstBindings.find(
-        val =>
-          val.loc.start.line === gen.line && val.loc.start.column === gen.column
-      );
+      return generatedAstBindings.find(val => {
+        if (val.loc.start.line !== gen.line) {
+          return false;
+        }
+
+        // Allow the mapping to point anywhere within the generated binding
+        // location to allow for less than perfect sourcemaps. Since you also
+        // need at least one character between identifiers, we also give one
+        // characters of space at the front the generated binding in order
+        // to increase the probability of finding the right mapping.
+        const start = val.loc.start.column - 1;
+        const end = val.loc.end.column;
+        return gen.column >= start && gen.column <= end;
+      });
     }, null);
 
   if (genContent && genContent.desc) {

src/components/ShortcutsModal.js

@@ -86,10 +86,10 @@ export class ShortcutsModal extends Component<Props> {
           L10N.getStr("shortcuts.functionSearch"),
           formatKeyShortcut(L10N.getStr("functionSearch.key"))
         )}
-         {this.renderShorcutItem(
-           L10N.getStr("shortcuts.gotoLine"),
-           formatKeyShortcut(L10N.getStr("gotoLineModal.key"))
-         )}
+        {this.renderShorcutItem(
+          L10N.getStr("shortcuts.gotoLine"),
+          formatKeyShortcut(L10N.getStr("gotoLineModal.key"))
+        )}
       </ul>
     );
   }

src/components/shared/ManagedTree.css

@@ -16,7 +16,6 @@
   display: grid;
   grid-template-columns: 1fr;
   align-content: start;
-
 }
 
 .managed-tree .tree button {

src/test/mochitest/browser.ini

@@ -6,6 +6,8 @@ support-files =
   head.js
   !/devtools/client/commandline/test/helpers.js
   !/devtools/client/framework/test/shared-head.js
+  examples/babel/fixtures/for-of/output.js
+  examples/babel/fixtures/for-of/output.js.map
   examples/sourcemaps/bundle.js
   examples/sourcemaps/bundle.js.map
   examples/sourcemaps2/main.min.js
@@ -37,6 +39,7 @@ support-files =
   examples/reload/sjs_code_reload.sjs
   examples/doc-async.html
   examples/doc-asm.html
+  examples/doc-babel.html
   examples/doc-content-script-sources.html
   examples/doc-scripts.html
   examples/doc-script-mutate.html
@@ -75,6 +78,7 @@ support-files =
 
 [browser_dbg-asm.js]
 [browser_dbg-async-stepping.js]
+[browser_dbg-babel-for-of.js]
 [browser_dbg-breaking.js]
 [browser_dbg-breaking-from-console.js]
 [browser_dbg-breakpoints.js]
@@ -108,7 +112,6 @@ skip-if = os == "linux" # bug 1351952
 skip-if = os == "win"
 [browser_dbg-navigation.js]
 [browser_dbg-minified.js]
-skip-if = true
 [browser_dbg-pretty-print.js]
 [browser_dbg-pretty-print-console.js]
 [browser_dbg-pretty-print-paused.js]
@@ -128,7 +131,6 @@ skip-if = true # regular failures during release in Bug 1415300
 [browser_dbg-sourcemaps-reloading.js]
 [browser_dbg-sourcemaps2.js]
 [browser_dbg-sourcemaps3.js]
-skip-if = true
 [browser_dbg-sourcemaps-bogus.js]
 [browser_dbg-sources.js]
 [browser_dbg-sources-named-eval.js]

src/test/mochitest/browser_dbg-babel-for-of.js

@@ -0,0 +1,49 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+// Tests loading sourcemapped sources for Babel's compile for..of output.
+
+add_task(async function() {
+  await pushPref("devtools.debugger.features.map-scopes", true);
+
+  const dbg = await initDebugger("doc-babel.html");
+  const { selectors: { getBreakpoint, getBreakpoints }, getState } = dbg;
+
+  await waitForSources(dbg, "fixtures/for-of/input.js");
+
+  ok(true, "Original sources exist");
+  const sortedSrc = findSource(dbg, "fixtures/for-of/input.js");
+
+  await selectSource(dbg, sortedSrc);
+
+  // Test that breakpoint is not off by a line.
+  await addBreakpoint(dbg, sortedSrc, 5);
+  is(getBreakpoints(getState()).size, 1, "One breakpoint exists");
+  ok(
+    getBreakpoint(getState(), { sourceId: sortedSrc.id, line: 5, column: 4 }),
+    "Breakpoint has correct line"
+  );
+
+  invokeInTab("forOf");
+
+  await waitForPaused(dbg);
+
+  assertPausedLocation(dbg);
+
+  is(getScopeLabel(dbg, 1), "For");
+  is(getScopeLabel(dbg, 2), "x");
+  is(getScopeValue(dbg, 2), "1");
+
+  is(getScopeLabel(dbg, 3), "forOf");
+
+  await toggleScopeNode(dbg, 3);
+
+  is(getScopeLabel(dbg, 4), "doThing()");
+
+  is(getScopeLabel(dbg, 5), "Module");
+
+  await toggleScopeNode(dbg, 5);
+
+  is(getScopeLabel(dbg, 6), "forOf");
+  is(getScopeLabel(dbg, 7), "mod");
+});

src/test/mochitest/browser_dbg-minified.js

@@ -23,14 +23,11 @@ add_task(async function() {
 
   invokeInTab("test");
   await waitForPaused(dbg);
-  await waitForMappedScopes(dbg);
 
   is(getScopeNodeLabel(dbg, 1), "sum", "check scope label");
-  is(getScopeNodeLabel(dbg, 2), "<this>", "check scope label");
-  is(getScopeNodeLabel(dbg, 3), "arguments", "check scope label");
-
-  is(getScopeNodeLabel(dbg, 4), "first", "check scope label");
-  is(getScopeNodeValue(dbg, 4), "40", "check scope value");
-  is(getScopeNodeLabel(dbg, 5), "second", "check scope label");
-  is(getScopeNodeValue(dbg, 5), "2", "check scope value");
+  is(getScopeNodeLabel(dbg, 2), "first", "check scope label");
+  is(getScopeNodeValue(dbg, 2), "40", "check scope value");
+  is(getScopeNodeLabel(dbg, 3), "second", "check scope label");
+  is(getScopeNodeValue(dbg, 3), "2", "check scope value");
+  is(getScopeNodeLabel(dbg, 4), "Window", "check scope label");
 });

src/test/mochitest/browser_dbg-sourcemaps3.js

@@ -4,23 +4,6 @@
 // Tests loading sourcemapped sources, setting breakpoints, and
 // inspecting restored scopes.
 
-function toggleNode(dbg, index) {
-  clickElement(dbg, "scopeNode", index);
-}
-
-function getLabel(dbg, index) {
-  return findElement(dbg, "scopeNode", index).innerText;
-}
-
-function hasScopeNode(dbg, index) {
-  return !!findElement(dbg, "scopeNode", index);
-}
-
-async function waitForScopeNode(dbg, index) {
-  const selector = getSelector("scopeNode", index);
-  return waitForElementWithSelector(dbg, selector);
-}
-
 // This source map does not have source contents, so it's fetched separately
 add_task(async function() {
   // NOTE: the CORS call makes the test run times inconsistent
@@ -50,36 +33,27 @@ add_task(async function() {
   await waitForPaused(dbg);
   assertPausedLocation(dbg);
 
-  await waitForDispatch(dbg, "MAP_SCOPES");
+  is(getScopeLabel(dbg, 1), "Block");
+  is(getScopeLabel(dbg, 2), "na");
+  is(getScopeLabel(dbg, 3), "nb");
 
-  is(getLabel(dbg, 1), "Block");
-  is(getLabel(dbg, 2), "<this>");
-  is(getLabel(dbg, 3), "na");
-  is(getLabel(dbg, 4), "nb");
+  is(getScopeLabel(dbg, 4), "Block");
 
-  is(getLabel(dbg, 5), "Block");
-  is(
-    hasScopeNode(dbg, 8) && !hasScopeNode(dbg, 9),
-    true,
-    "scope count before expand"
-  );
-  toggleNode(dbg, 5);
+  await toggleScopeNode(dbg, 4);
 
-  await waitForScopeNode(dbg, 9);
+  is(getScopeLabel(dbg, 5), "ma");
+  is(getScopeLabel(dbg, 6), "mb");
 
-  is(getLabel(dbg, 6), "ma");
-  is(getLabel(dbg, 7), "mb");
+  await toggleScopeNode(dbg, 7);
 
-  is(
-    hasScopeNode(dbg, 10) && !hasScopeNode(dbg, 11),
-    true,
-    "scope count before expand"
-  );
-  toggleNode(dbg, 8);
+  is(getScopeLabel(dbg, 8), "a");
+  is(getScopeLabel(dbg, 9), "b");
+
+  is(getScopeLabel(dbg, 10), "Module");
 
-  await waitForScopeNode(dbg, 11);
+  await toggleScopeNode(dbg, 10);
 
-  is(getLabel(dbg, 9), "a");
-  is(getLabel(dbg, 10), "arguments");
-  is(getLabel(dbg, 11), "b");
+  is(getScopeLabel(dbg, 11), "binaryLookup:o()");
+  is(getScopeLabel(dbg, 12), "comparer:t()");
+  is(getScopeLabel(dbg, 13), "fancySort");
 });

src/test/mochitest/examples/babel/fixtures/for-of/input.js

@@ -0,0 +1,9 @@
+const mod = "module scoped";
+
+export default function forOf() {
+  for (const x of [1]) {
+    doThing(x);
+  }
+
+  function doThing(arg) {}
+}