Adds option to execute selected text in editor right-click menu (#4934)

Author: Łukasz Sobek

assets/panel/debugger.properties

@@ -48,6 +48,10 @@ copyStackTrace.accesskey=c
 # that expands the left and right panes in the debugger UI.
 expandPanes=Expand panes
 
+# LOCALIZATION NOTE (executeInConsole): Editor right-click menu item
+# to execute selected text in browser console.
+evaluateInConsole.label=Evaluate in console
+
 # LOCALIZATION NOTE (pauseButtonTooltip): The tooltip that is displayed for the pause
 # button when the debugger is in a running state.
 pauseButtonTooltip=Pause %S

src/actions/pause/commands.js

@@ -164,7 +164,7 @@ function hasAwait(source, pauseLocation) {
 
   return source.text
     .split("\n")
-    [line - 1].slice(column, column + 200)
+    [line - 1].slice(column - 200, column + 200)
     .match(/(yield|await)/);
 }
 

src/actions/pause/paused.js

@@ -34,6 +34,15 @@ export function paused(pauseInfo: Pause) {
   return async function({ dispatch, getState, client, sourceMaps }: ThunkArgs) {
     const { frames, why, loadedObjects } = pauseInfo;
 
+    const location = isGeneratedId(visibleFrame.location.sourceId);
+    if (
+      isEqual(previousPauseLocation, pauseLocation) ||
+      (isOriginalFile() && parser.atBadLocation(pauseLcation))
+    ) {
+      dispatch(stepOver());
+      return;
+    }
+
     dispatch({
       type: "PAUSED",
       why,
@@ -56,10 +65,10 @@ export function paused(pauseInfo: Pause) {
 
     if (selectedFrame) {
       const visibleFrame = getVisibleSelectedFrame(getState());
-      const location = isGeneratedId(visibleFrame.location.sourceId)
-        ? selectedFrame.generatedLocation
-        : selectedFrame.location;
-      await dispatch(selectLocation(location));
+      // const location = isGeneratedId(visibleFrame.location.sourceId)
+      //   ? selectedFrame.generatedLocation
+      //   : selectedFrame.location;
+      await dispatch(selectLocation(selectedFrame.location));
     }
 
     dispatch(togglePaneCollapse("end", false));

src/actions/tests/toolbox.spec.js

@@ -0,0 +1,18 @@
+import { actions, createStore } from "../../utils/test-head";
+const threadClient = {
+  evaluate: jest.fn()
+};
+
+describe("toolbox", () => {
+  describe("evaluate in console", () => {
+    it("variable", () => {
+      const { dispatch } = createStore(threadClient);
+      dispatch(actions.evaluateInConsole("foo"));
+
+      expect(threadClient.evaluate).toBeCalledWith(
+        'console.log("foo"); console.log(foo)',
+        { frameId: undefined }
+      );
+    });
+  });
+});

src/actions/toolbox.js

@@ -5,6 +5,7 @@
 // @flow
 
 const { isDevelopment } = require("devtools-config");
+const { getSelectedFrameId } = require("../selectors");
 
 import type { ThunkArgs } from "./types";
 import type { Worker } from "../types";
@@ -36,3 +37,13 @@ export function openWorkerToolbox(worker: Worker) {
     }
   };
 }
+
+export function evaluateInConsole(inputString: string) {
+  return async ({ client, getState }: ThunkArgs) => {
+    const frameId = getSelectedFrameId(getState());
+    client.evaluate(
+      `console.log("${inputString}"); console.log(${inputString})`,
+      { frameId }
+    );
+  };
+}

src/components/Editor/EditorMenu.js

@@ -34,6 +34,7 @@ function getMenuItems(
   {
     addExpression,
     editor,
+    evaluateInConsole,
     flashLineRange,
     getFunctionLocation,
     getFunctionText,
@@ -62,7 +63,7 @@ function getMenuItems(
     selectedLocation,
     event
   );
-  const textSelected = editor.codeMirror.somethingSelected();
+  const isTextSelected = editor.codeMirror.somethingSelected();
 
   // localizations
   const blackboxKey = L10N.getStr("sourceFooter.blackbox.accesskey");
@@ -77,6 +78,7 @@ function getMenuItems(
   const copySourceLabel = L10N.getStr("copySource");
   const copySourceUri2Key = L10N.getStr("copySourceUri2.accesskey");
   const copySourceUri2Label = L10N.getStr("copySourceUri2");
+  const evaluateInConsoleLabel = L10N.getStr("evaluateInConsole.label");
   const jumpToMappedLocKey = L10N.getStr(
     "editor.jumpToMappedLocation1.accesskey"
   );
@@ -157,6 +159,12 @@ function getMenuItems(
     click: () => addExpression(editor.codeMirror.getSelection())
   };
 
+  const evaluateInConsoleItem = {
+    id: "node-menu-evaluate-in-console",
+    label: evaluateInConsoleLabel,
+    click: () => evaluateInConsole(selectionText)
+  };
+
   // construct menu
   const menuItems = [
     copySourceItem,
@@ -170,8 +178,8 @@ function getMenuItems(
 
   // conditionally added items
   // TODO: Find a new way to only add this for mapped sources?
-  if (textSelected) {
-    menuItems.push(watchExpressionItem);
+  if (isTextSelected) {
+    menuItems.push(watchExpressionItem, evaluateInConsoleItem);
   }
 
   return menuItems;
@@ -207,6 +215,7 @@ class EditorMenu extends PureComponent {
 
 const {
   addExpression,
+  evaluateInConsole,
   flashLineRange,
   jumpToMappedLocation,
   setContextMenu,
@@ -237,6 +246,7 @@ export default connect(
   },
   {
     addExpression,
+    evaluateInConsole,
     flashLineRange,
     jumpToMappedLocation,
     setContextMenu,

src/reducers/pause.js

@@ -19,6 +19,7 @@ import type { OriginalScope } from "../actions/pause/mapScopes";
 import type { Action } from "../actions/types";
 import type { Why, Scope, SourceId, FrameId } from "../types";
 
+type Command = "StepIn" | "StepOver";
 export type PauseState = {
   why: ?Why,
   isWaitingOnBreak: boolean,
@@ -60,7 +61,10 @@ export const createPauseState = (): PauseState => ({
   shouldIgnoreCaughtExceptions: prefs.ignoreCaughtExceptions,
   canRewind: false,
   debuggeeUrl: "",
-  command: ""
+  command: "",
+  pauseLocation: {
+    pauseLocation: {}
+  }
 });
 
 const emptyPauseState = {

yarn.lock

@@ -3850,7 +3850,7 @@ eslint-plugin-jest@^21.5.0:
   version "21.7.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-21.7.0.tgz#651f1c6ce999af3ac59ab8bf8a376d742fd0fc23"
 
-[email protected]:
+eslint-plugin-mozilla@^0.8.1:
   version "0.8.1"
   resolved "https://registry.yarnpkg.com/eslint-plugin-mozilla/-/eslint-plugin-mozilla-0.8.1.tgz#623b031b14e901999110c60ce17d0aad67cbba83"
   dependencies: