Bug 1841041 - [devtools] Stop using context for selectSourceURL, setPendingSelectedLocation and clearSelectedLocation. r=devtools-reviewers,bomsy

All these three actions aren't related to any thread/source and shouldn't be cancelled.

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

devtools/client/debugger/panel.js

@@ -222,8 +222,7 @@ class DebuggerPanel {
   }
 
   selectSourceURL(url, line, column) {
-    const cx = this._selectors.getContext(this._getState());
-    return this._actions.selectSourceURL(cx, url, { line, column });
+    return this._actions.selectSourceURL(url, { line, column });
   }
 
   /**

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

@@ -33,6 +33,7 @@ import {
   getIsCurrentThreadPaused,
   getSourceTextContent,
   tabExists,
+  getContext,
 } from "../../selectors";
 
 // This is only used by jest tests (and within this module)
@@ -48,18 +49,16 @@ export const setSelectedLocation = (
 });
 
 // This is only used by jest tests (and within this module)
-export const setPendingSelectedLocation = (cx, url, options) => ({
+export const setPendingSelectedLocation = (url, options) => ({
   type: "SET_PENDING_SELECTED_LOCATION",
-  cx,
   url,
   line: options?.line,
   column: options?.column,
 });
 
 // This is only used by jest tests (and within this module)
-export const clearSelectedLocation = cx => ({
+export const clearSelectedLocation = () => ({
   type: "CLEAR_SELECTED_LOCATION",
-  cx,
 });
 
 /**
@@ -70,13 +69,14 @@ export const clearSelectedLocation = cx => ({
  * This exists mostly for external things to interact with the
  * debugger.
  */
-export function selectSourceURL(cx, url, options) {
+export function selectSourceURL(url, options) {
   return async ({ dispatch, getState }) => {
     const source = getSourceByURL(getState(), url);
     if (!source) {
-      return dispatch(setPendingSelectedLocation(cx, url, options));
+      return dispatch(setPendingSelectedLocation(url, options));
     }
 
+    const cx = getContext(getState());
     const location = createLocation({ ...options, source });
     return dispatch(selectLocation(cx, location));
   };
@@ -135,7 +135,7 @@ export function selectLocation(cx, location, { keepContext = true } = {}) {
 
     if (!source) {
       // If there is no source we deselect the current selected source
-      dispatch(clearSelectedLocation(cx));
+      dispatch(clearSelectedLocation());
       return;
     }
 

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

@@ -54,9 +54,9 @@ describe("sources - new sources", () => {
   });
 
   it("should automatically select a pending source", async () => {
-    const { dispatch, getState, cx } = createStore(mockCommandClient);
+    const { dispatch, getState } = createStore(mockCommandClient);
     const baseSourceURL = makeSourceURL("base.js");
-    await dispatch(actions.selectSourceURL(cx, baseSourceURL));
+    await dispatch(actions.selectSourceURL(baseSourceURL));
 
     expect(getSelectedSource(getState())).toBe(undefined);
     const baseSource = await dispatch(

devtools/client/debugger/src/actions/sources/tests/select.spec.js

@@ -187,17 +187,17 @@ describe("sources", () => {
     });
 
     // clear value
-    dispatch(actions.clearSelectedLocation(cx));
+    dispatch(actions.clearSelectedLocation());
     expect(getSelectedLocation(getState())).toEqual(null);
   });
 
   it("sets and clears pending selected location correctly", () => {
-    const { dispatch, getState, cx } = createStore(mockCommandClient);
+    const { dispatch, getState } = createStore(mockCommandClient);
     const url = "testURL";
     const options = { line: "testLine", column: "testColumn" };
 
     // set value
-    dispatch(actions.setPendingSelectedLocation(cx, url, options));
+    dispatch(actions.setPendingSelectedLocation(url, options));
     const setResult = getState().sources.pendingSelectedLocation;
     expect(setResult).toEqual({
       url,
@@ -206,7 +206,7 @@ describe("sources", () => {
     });
 
     // clear value
-    dispatch(actions.clearSelectedLocation(cx));
+    dispatch(actions.clearSelectedLocation());
     const clearResult = getState().sources.pendingSelectedLocation;
     expect(clearResult).toEqual({ url: "" });
   });
@@ -271,9 +271,9 @@ describe("sources", () => {
 
   describe("selectSourceURL", () => {
     it("should automatically select a pending source", async () => {
-      const { dispatch, getState, cx } = createStore(mockCommandClient);
+      const { dispatch, getState } = createStore(mockCommandClient);
       const baseSourceURL = makeSourceURL("base.js");
-      await dispatch(actions.selectSourceURL(cx, baseSourceURL));
+      await dispatch(actions.selectSourceURL(baseSourceURL));
 
       expect(getSelectedSource(getState())).toBe(undefined);
       const baseSource = await dispatch(

devtools/client/debugger/src/components/Editor/Preview/ExceptionPopup.js

@@ -79,14 +79,15 @@ class ExceptionPopup extends Component {
   }
 
   buildStackFrame(frame) {
-    const { cx, selectSourceURL } = this.props;
     const { filename, lineNumber } = frame;
     const functionName = frame.functionName || ANONYMOUS_FN_NAME;
 
     return (
       <div
         className="frame"
-        onClick={() => selectSourceURL(cx, filename, { line: lineNumber })}
+        onClick={() =>
+          this.props.selectSourceURL(filename, { line: lineNumber })
+        }
       >
         <span className="title">{functionName}</span>
         <span className="location">

devtools/client/debugger/src/components/Editor/Preview/Popup.js

@@ -22,7 +22,6 @@ const {
 import ExceptionPopup from "./ExceptionPopup";
 
 import actions from "../../../actions";
-import { getThreadContext } from "../../../selectors";
 import Popover from "../../shared/Popover";
 import PreviewFunction from "../../shared/PreviewFunction";
 
@@ -36,7 +35,6 @@ export class Popup extends Component {
   static get propTypes() {
     return {
       clearPreview: PropTypes.func.isRequired,
-      cx: PropTypes.object.isRequired,
       editorRef: PropTypes.object.isRequired,
       highlightDomElement: PropTypes.func.isRequired,
       openElementInInspector: PropTypes.func.isRequired,
@@ -92,7 +90,6 @@ export class Popup extends Component {
 
   renderFunctionPreview() {
     const {
-      cx,
       selectSourceURL,
       preview: { resultGrip },
     } = this.props;
@@ -108,7 +105,7 @@ export class Popup extends Component {
         className="preview-popup"
         onClick={() =>
           location &&
-          selectSourceURL(cx, location.url, {
+          selectSourceURL(location.url, {
             line: location.line,
           })
         }
@@ -351,10 +348,6 @@ export function removeHighlightForTargetSiblings(target) {
   }
 }
 
-const mapStateToProps = state => ({
-  cx: getThreadContext(state),
-});
-
 const {
   addExpression,
   selectSourceURL,
@@ -373,4 +366,4 @@ const mapDispatchToProps = {
   unHighlightDomElement,
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(Popup);
+export default connect(null, mapDispatchToProps)(Popup);