Bug 1737970 - [devtools] Refactor getBabelFrameIndexes so it does not use lodash. r=jdescottes.

The function was slightly simplified and shouldn't
iterate on frames as much as before.

Differential Revision: https://phabricator.services.mozilla.com/D134612

devtools/client/debugger/src/utils/pause/frames/annotateFrames.js

@@ -2,8 +2,6 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
 
-import { flatMap, zip, range } from "lodash";
-
 import { getFrameUrl } from "./getFrameUrl";
 import { getLibraryFromUrl } from "./getLibraryFromUrl";
 
@@ -30,40 +28,46 @@ function annotateBabelAsyncFrames(frames) {
   );
 }
 
-// Receives an array of frames and looks for babel async
-// call stack groups.
+/**
+ * Returns all the indexes that are part of a babel async call stack.
+ *
+ * @param {Array<Object>} frames
+ * @returns Array<Integer>
+ */
 function getBabelFrameIndexes(frames) {
-  const startIndexes = frames.reduce((accumulator, frame, index) => {
+  const startIndexes = [];
+  const endIndexes = [];
+
+  frames.forEach((frame, index) => {
+    const frameUrl = getFrameUrl(frame);
+
     if (
-      getFrameUrl(frame).match(/regenerator-runtime/i) &&
+      frameUrl.match(/regenerator-runtime/i) &&
       frame.displayName === "tryCatch"
     ) {
-      return [...accumulator, index];
+      startIndexes.push(index);
     }
-    return accumulator;
-  }, []);
-
-  const endIndexes = frames.reduce((accumulator, frame, index) => {
-    if (
-      getFrameUrl(frame).match(/_microtask/i) &&
-      frame.displayName === "flush"
-    ) {
-      return [...accumulator, index];
+    if (frame.displayName === "flush" && frameUrl.match(/_microtask/i)) {
+      endIndexes.push(index);
     }
     if (frame.displayName === "_asyncToGenerator/<") {
-      return [...accumulator, index + 1];
+      endIndexes.push(index + 1);
     }
-    return accumulator;
-  }, []);
+  });
 
   if (startIndexes.length != endIndexes.length || startIndexes.length === 0) {
-    return frames;
+    return [];
   }
 
-  // Receives an array of start and end index tuples and returns
-  // an array of async call stack index ranges.
-  // e.g. [[1,3], [5,7]] => [[1,2,3], [5,6,7]]
-  return flatMap(zip(startIndexes, endIndexes), ([startIndex, endIndex]) =>
-    range(startIndex, endIndex + 1)
-  );
+  const babelFrameIndexes = [];
+  // We have the same number of start and end indexes, we can loop through one of them to
+  // build our async call stack index ranges
+  // e.g. if we have startIndexes: [1,5] and endIndexes: [3,8], we want to return [1,2,3,5,6,7,8]
+  startIndexes.forEach((startIndex, index) => {
+    const matchingEndIndex = endIndexes[index];
+    for (let i = startIndex; i <= matchingEndIndex; i++) {
+      babelFrameIndexes.push(i);
+    }
+  });
+  return babelFrameIndexes;
 }