Bug 1824705 - [devtools] Add support for sourcemaps ignore list r=dev…

…tools-reviewers,nchevobbe

Also there is a patch to add support for ignoreList to the sourcemap library
mozilla/source-map#481

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

devtools/client/debugger/src/actions/breakpoints/modify.js

@@ -16,6 +16,8 @@ import {
   getPendingBreakpointList,
   isMapScopesEnabled,
   getBlackBoxRanges,
+  isSourceMapIgnoreListEnabled,
+  isSourceOnSourceMapIgnoreList,
 } from "../../selectors";
 
 import { setBreakpointPositions } from "./breakpointPositions";
@@ -81,14 +83,19 @@ function clientRemoveBreakpoint(client, state, generatedLocation) {
 export function enableBreakpoint(cx, initialBreakpoint) {
   return thunkArgs => {
     const { dispatch, getState, client } = thunkArgs;
-    const breakpoint = getBreakpoint(getState(), initialBreakpoint.location);
-    const blackboxedRanges = getBlackBoxRanges(getState());
+    const state = getState();
+    const breakpoint = getBreakpoint(state, initialBreakpoint.location);
+    const blackboxedRanges = getBlackBoxRanges(state);
+    const isSourceOnIgnoreList =
+      isSourceMapIgnoreListEnabled(state) &&
+      isSourceOnSourceMapIgnoreList(state, breakpoint.location.source);
     if (
       !breakpoint ||
       !breakpoint.disabled ||
       isLineBlackboxed(
         blackboxedRanges[breakpoint.location.source.url],
-        breakpoint.location.line
+        breakpoint.location.line,
+        isSourceOnIgnoreList
       )
     ) {
       return null;

devtools/client/debugger/src/actions/sources/blackbox.js

@@ -20,7 +20,7 @@ import {
   getBreakpointsForSource,
 } from "../../selectors";
 
-async function _blackboxSourceActorsForSource(
+export async function blackboxSourceActorsForSource(
   thunkArgs,
   source,
   shouldBlackBox,
@@ -82,7 +82,7 @@ export function toggleBlackBox(cx, source, shouldBlackBox, ranges = []) {
         ? shouldBlackBox
         : !isSourceBlackBoxed(getState(), source);
 
-    await _blackboxSourceActorsForSource(
+    await blackboxSourceActorsForSource(
       thunkArgs,
       source,
       shouldBlackBox,
@@ -200,7 +200,7 @@ export function blackBoxSources(cx, sourcesToBlackBox, shouldBlackBox) {
     }
 
     for (const source of sources) {
-      await _blackboxSourceActorsForSource(thunkArgs, source, shouldBlackBox);
+      await blackboxSourceActorsForSource(thunkArgs, source, shouldBlackBox);
     }
 
     if (shouldBlackBox) {

devtools/client/debugger/src/actions/sources/newSources.js

@@ -6,7 +6,7 @@
  * Redux actions for the sources state
  * @module actions/sources
  */
-
+import { PROMISE } from "../utils/middleware/promise";
 import { insertSourceActors } from "../../actions/source-actors";
 import {
   makeSourceId,
@@ -18,6 +18,7 @@ import { toggleBlackBox } from "./blackbox";
 import { syncBreakpoint } from "../breakpoints";
 import { loadSourceText } from "./loadSourceText";
 import { togglePrettyPrint } from "./prettyPrint";
+import { toggleSourceMapIgnoreList } from "../ui";
 import { selectLocation, setBreakableLines } from "../sources";
 
 import { getRawSourceURL, isPrettyURL } from "../../utils/source";
@@ -54,14 +55,12 @@ function loadSourceMaps(cx, sources) {
       );
 
       await sourceQueue.flush();
-
       return sourceList.flat();
     } catch (error) {
       if (!(error instanceof ContextError)) {
         throw error;
       }
     }
-
     return [];
   };
 }
@@ -91,6 +90,10 @@ function loadSourceMap(cx, sourceActor) {
           sourceMapURL: sourceActor.sourceMapURL || "",
           isWasm: sourceActor.introductionType === "wasm",
         });
+        dispatch({
+          type: "ADD_SOURCEMAP_IGNORE_LIST_SOURCES",
+          [PROMISE]: sourceMapLoader.getSourceMapIgnoreList(source.id),
+        });
       }
     } catch (e) {
       console.error(e);
@@ -194,6 +197,10 @@ function restoreBlackBoxedSources(cx, sources) {
         await dispatch(toggleBlackBox(cx, source, true, ranges));
       }
     }
+
+    if (prefs.sourceMapIgnoreListEnabled) {
+      await dispatch(toggleSourceMapIgnoreList(cx, true));
+    }
   };
 }
 

devtools/client/debugger/src/actions/ui.js

@@ -9,13 +9,18 @@ import {
   getSource,
   getSourceContent,
   getMainThread,
+  getIgnoreListSourceUrls,
+  getSourceByURL,
+  getBreakpointsForSource,
 } from "../selectors";
 import { selectSource } from "../actions/sources/select";
 import {
   getEditor,
   getLocationsInViewport,
   updateDocuments,
 } from "../utils/editor";
+import { blackboxSourceActorsForSource } from "./sources/blackbox";
+import { toggleBreakpoints } from "./breakpoints";
 import { copyToTheClipboard } from "../utils/clipboard";
 import { isFulfilled } from "../utils/async-value";
 
@@ -242,3 +247,22 @@ export function setHideOrShowIgnoredSources(shouldHide) {
     dispatch({ type: "HIDE_IGNORED_SOURCES", shouldHide });
   };
 }
+
+export function toggleSourceMapIgnoreList(cx, shouldEnable) {
+  return async thunkArgs => {
+    const { dispatch, getState } = thunkArgs;
+    const ignoreListSourceUrls = getIgnoreListSourceUrls(getState());
+    // Blackbox the source actors on the server
+    for (const url of ignoreListSourceUrls) {
+      const source = getSourceByURL(getState(), url);
+      await blackboxSourceActorsForSource(thunkArgs, source, shouldEnable);
+      // Disable breakpoints in sources on the ignore list
+      const breakpoints = getBreakpointsForSource(getState(), source.id);
+      await dispatch(toggleBreakpoints(cx, shouldEnable, breakpoints));
+    }
+    await dispatch({
+      type: "ENABLE_SOURCEMAP_IGNORELIST",
+      shouldEnable,
+    });
+  };
+}

devtools/client/debugger/src/components/Editor/BlackboxLines.js

@@ -7,7 +7,12 @@ import PropTypes from "prop-types";
 import { Component } from "react";
 import { toEditorLine, fromEditorLine } from "../../utils/editor";
 import { isLineBlackboxed } from "../../utils/source";
-import { getBlackBoxRanges, getSelectedSource } from "../../selectors";
+import {
+  getBlackBoxRanges,
+  getSelectedSource,
+  isSourceMapIgnoreListEnabled,
+  isSourceOnSourceMapIgnoreList,
+} from "../../selectors";
 import { isWasm } from "../../utils/wasm";
 
 // This renders blackbox line highlighting in the editor
@@ -17,13 +22,19 @@ class BlackboxLines extends Component {
       editor: PropTypes.object,
       selectedSource: PropTypes.object,
       blackboxedRangesForSelectedSource: PropTypes.object,
+      isSourceOnIgnoreList: PropTypes.bool,
     };
   }
 
   componentDidMount() {
     const { selectedSource, blackboxedRangesForSelectedSource, editor } =
       this.props;
 
+    if (this.props.isSourceOnIgnoreList) {
+      this.setAllBlackboxLines(editor);
+      return;
+    }
+
     // When `blackboxedRangesForSelectedSource` is undefined, the source isn't blackboxed
     if (!blackboxedRangesForSelectedSource) {
       return;
@@ -47,8 +58,17 @@ class BlackboxLines extends Component {
   }
 
   componentDidUpdate() {
-    const { selectedSource, blackboxedRangesForSelectedSource, editor } =
-      this.props;
+    const {
+      selectedSource,
+      blackboxedRangesForSelectedSource,
+      editor,
+      isSourceOnIgnoreList,
+    } = this.props;
+
+    if (this.props.isSourceOnIgnoreList) {
+      this.setAllBlackboxLines(editor);
+      return;
+    }
 
     // when unblackboxed
     if (!blackboxedRangesForSelectedSource) {
@@ -75,7 +95,13 @@ class BlackboxLines extends Component {
           sourceIsWasm
         );
 
-        if (isLineBlackboxed(blackboxedRangesForSelectedSource, line)) {
+        if (
+          isLineBlackboxed(
+            blackboxedRangesForSelectedSource,
+            line,
+            isSourceOnIgnoreList
+          )
+        ) {
           this.setBlackboxLine(editor, lineHandle);
         } else {
           this.clearBlackboxLine(editor, lineHandle);
@@ -128,6 +154,9 @@ const mapStateToProps = state => {
     blackboxedRangesForSelectedSource: selectedSource
       ? getBlackBoxRanges(state)[selectedSource.url]
       : undefined,
+    isSourceOnIgnoreList:
+      isSourceMapIgnoreListEnabled(state) &&
+      isSourceOnSourceMapIgnoreList(state, selectedSource),
   };
 };
 

devtools/client/debugger/src/components/Editor/Breakpoint.js

@@ -26,6 +26,7 @@ class Breakpoint extends PureComponent {
       editorActions: PropTypes.object.isRequired,
       selectedSource: PropTypes.object,
       blackboxedRangesForSelectedSource: PropTypes.array,
+      isSelectedSourceOnIgnoreList: PropTypes.bool.isRequired,
     };
   }
 
@@ -97,6 +98,7 @@ class Breakpoint extends PureComponent {
       selectedSource,
       breakpointActions,
       blackboxedRangesForSelectedSource,
+      isSelectedSourceOnIgnoreList,
     } = this.props;
     event.stopPropagation();
     event.preventDefault();
@@ -109,7 +111,8 @@ class Breakpoint extends PureComponent {
         breakpoint,
         selectedLocation,
         breakpointActions,
-        blackboxedRangesForSelectedSource
+        blackboxedRangesForSelectedSource,
+        isSelectedSourceOnIgnoreList
       )
     );
   };

devtools/client/debugger/src/components/Editor/Breakpoints.js

@@ -10,6 +10,8 @@ import {
   getSelectedSource,
   getFirstVisibleBreakpoints,
   getBlackBoxRanges,
+  isSourceMapIgnoreListEnabled,
+  isSourceOnSourceMapIgnoreList,
 } from "../../selectors";
 import { makeBreakpointId } from "../../utils/breakpoint";
 import { connect } from "../../utils/connect";
@@ -26,6 +28,8 @@ class Breakpoints extends Component {
       editorActions: PropTypes.object,
       selectedSource: PropTypes.object,
       blackboxedRanges: PropTypes.object,
+      isSelectedSourceOnIgnoreList: PropTypes.bool,
+      blackboxedRangesForSelectedSource: PropTypes.array,
     };
   }
   render() {
@@ -36,7 +40,8 @@ class Breakpoints extends Component {
       editor,
       breakpointActions,
       editorActions,
-      blackboxedRanges,
+      blackboxedRangesForSelectedSource,
+      isSelectedSourceOnIgnoreList,
     } = this.props;
 
     if (!selectedSource || !breakpoints) {
@@ -53,8 +58,9 @@ class Breakpoints extends Component {
               breakpoint={bp}
               selectedSource={selectedSource}
               blackboxedRangesForSelectedSource={
-                blackboxedRanges[selectedSource.url]
+                blackboxedRangesForSelectedSource
               }
+              isSelectedSourceOnIgnoreList={isSelectedSourceOnIgnoreList}
               editor={editor}
               breakpointActions={breakpointActions}
               editorActions={editorActions}
@@ -67,13 +73,22 @@ class Breakpoints extends Component {
 }
 
 export default connect(
-  state => ({
-    // Retrieves only the first breakpoint per line so that the
-    // breakpoint marker represents only the first breakpoint
-    breakpoints: getFirstVisibleBreakpoints(state),
-    selectedSource: getSelectedSource(state),
-    blackboxedRanges: getBlackBoxRanges(state),
-  }),
+  state => {
+    const selectedSource = getSelectedSource(state);
+    const blackboxedRanges = getBlackBoxRanges(state);
+    return {
+      // Retrieves only the first breakpoint per line so that the
+      // breakpoint marker represents only the first breakpoint
+      breakpoints: getFirstVisibleBreakpoints(state),
+      selectedSource,
+      blackboxedRangesForSelectedSource:
+        selectedSource && blackboxedRanges[selectedSource.url],
+      isSelectedSourceOnIgnoreList:
+        selectedSource &&
+        isSourceMapIgnoreListEnabled(state) &&
+        isSourceOnSourceMapIgnoreList(state, selectedSource),
+    };
+  },
   dispatch => ({
     breakpointActions: breakpointItemActions(dispatch),
     editorActions: editorItemActions(dispatch),

devtools/client/debugger/src/components/Editor/EditorMenu.js

@@ -16,6 +16,8 @@ import {
   getThreadContext,
   isSourceWithMap,
   getBlackBoxRanges,
+  isSourceOnSourceMapIgnoreList,
+  isSourceMapIgnoreListEnabled,
 } from "../../selectors";
 
 import { editorMenuItems, editorItemActions } from "./menus/editor";
@@ -25,6 +27,7 @@ class EditorMenu extends Component {
     return {
       clearContextMenu: PropTypes.func.isRequired,
       contextMenu: PropTypes.object,
+      isSourceOnIgnoreList: PropTypes.bool,
     };
   }
 
@@ -47,6 +50,7 @@ class EditorMenu extends Component {
       isPaused,
       editorWrappingEnabled,
       contextMenu: event,
+      isSourceOnIgnoreList,
     } = props;
 
     const location = getSourceLocationFromMouseEvent(
@@ -70,6 +74,7 @@ class EditorMenu extends Component {
         selectionText: editor.codeMirror.getSelection().trim(),
         isTextSelected: editor.codeMirror.somethingSelected(),
         editor,
+        isSourceOnIgnoreList,
       })
     );
   }
@@ -93,6 +98,9 @@ const mapStateToProps = (state, props) => {
         isSourceWithMap(state, props.selectedSource.id) ||
         isPretty(props.selectedSource)) &&
       !getPrettySource(state, props.selectedSource.id),
+    isSourceOnIgnoreList:
+      isSourceMapIgnoreListEnabled(state) &&
+      isSourceOnSourceMapIgnoreList(state, props.selectedSource),
   };
 };