Bug 1511717 - Pausing should jump to the first non-blackboxed frame. r=bhackett
☠☠ backed out by 4976cba52e47 ☠ ☠
authorJason Laster <jlaster@mozilla.com>
Thu, 29 Nov 2018 18:40:16 -0500
changeset 505640 d0fb1493b28bd765b60b5a34c72f3b6f1a493aee
parent 505639 b40559c21959c884c4ef1a23d036cfafed890606
child 505641 c758d2a5b8cb04b1b5e5188a309d2994ad430d80
push id10290
push userffxbld-merge
push dateMon, 03 Dec 2018 16:23:23 +0000
treeherdermozilla-beta@700bed2445e6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbhackett
bugs1511717
milestone65.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1511717 - Pausing should jump to the first non-blackboxed frame. r=bhackett Tags: Bug #: 1511717 Differential Revision: https://phabricator.services.mozilla.com/D13648
devtools/client/debugger/new/src/actions/pause/mapFrames.js
devtools/client/debugger/new/src/actions/sources/blackbox.js
devtools/client/debugger/new/src/components/Editor/EditorMenu.js
devtools/client/debugger/new/src/components/Editor/Footer.js
devtools/client/debugger/new/src/reducers/pause.js
devtools/client/debugger/new/src/utils/prefs.js
devtools/client/debugger/new/src/utils/source.js
devtools/client/preferences/debugger.js
devtools/client/themes/toolbox.css
--- a/devtools/client/debugger/new/src/actions/pause/mapFrames.js
+++ b/devtools/client/debugger/new/src/actions/pause/mapFrames.js
@@ -9,16 +9,28 @@ import assert from "../../utils/assert";
 import { findClosestFunction } from "../../utils/ast";
 
 import type { Frame } from "../../types";
 import type { State } from "../../reducers/types";
 import type { ThunkArgs } from "../types";
 
 import { isGeneratedId } from "devtools-source-map";
 
+function getSelectedFrameId(state, frames) {
+  if (frames.length == 0) {
+    return null;
+  }
+
+  const selectedFrame =  frames.find(frame => 
+    !getSource(state, frame.location.sourceId).isBlackBoxed
+  )
+
+  return selectedFrame && selectedFrame.id
+}
+
 export function updateFrameLocation(frame: Frame, sourceMaps: any) {
   if (frame.isOriginal) {
     return Promise.resolve(frame);
   }
   return sourceMaps.getOriginalLocation(frame.location).then(loc => ({
     ...frame,
     location: loc,
     generatedLocation: frame.generatedLocation || frame.location
@@ -144,14 +156,16 @@ export function mapFrames() {
     if (!frames) {
       return;
     }
 
     let mappedFrames = await updateFrameLocations(frames, sourceMaps);
     mappedFrames = await expandFrames(mappedFrames, sourceMaps, getState);
     mappedFrames = mapDisplayNames(mappedFrames, getState);
 
+    const selectedFrameId = getSelectedFrameId(getState(), mappedFrames)
     dispatch({
       type: "MAP_FRAMES",
-      frames: mappedFrames
+      frames: mappedFrames,
+      selectedFrameId
     });
   };
 }
--- a/devtools/client/debugger/new/src/actions/sources/blackbox.js
+++ b/devtools/client/debugger/new/src/actions/sources/blackbox.js
@@ -4,29 +4,38 @@
 
 // @flow
 
 /**
  * Redux actions for the sources state
  * @module actions/sources
  */
 
+import { isOriginalId } from "devtools-source-map";
 import { recordEvent } from "../../utils/telemetry";
+import { features } from "../../utils/prefs";
 
 import { PROMISE } from "../utils/middleware/promise";
 import type { Source } from "../../types";
 import type { ThunkArgs } from "../types";
 
 export function toggleBlackBox(source: Source) {
   return async ({ dispatch, getState, client, sourceMaps }: ThunkArgs) => {
     const { isBlackBoxed, id } = source;
 
     if (!isBlackBoxed) {
       recordEvent("blackbox");
     }
 
+    let promise;
+    if (features.originalBlackbox && isOriginalId(id)) {
+      promise = Promise.resolve({isBlackBoxed: !isBlackBoxed})
+    } else {
+      promise = client.blackBox(id, isBlackBoxed)
+    }
+
     return dispatch({
       type: "BLACKBOX",
       source,
-      [PROMISE]: client.blackBox(id, isBlackBoxed)
+      [PROMISE]: promise
     });
   };
 }
--- a/devtools/client/debugger/new/src/components/Editor/EditorMenu.js
+++ b/devtools/client/debugger/new/src/components/Editor/EditorMenu.js
@@ -9,17 +9,17 @@ import { isOriginalId } from "devtools-s
 
 import { copyToTheClipboard } from "../../utils/clipboard";
 import { findFunctionText } from "../../utils/function";
 import { findClosestFunction } from "../../utils/ast";
 import {
   getSourceLocationFromMouseEvent,
   toSourceLine
 } from "../../utils/editor";
-import { isPretty, getRawSourceURL } from "../../utils/source";
+import { isPretty, getRawSourceURL, shouldBlackbox } from "../../utils/source";
 import {
   getContextMenu,
   getPrettySource,
   getSelectedLocation,
   getSelectedSource,
   getSymbols
 } from "../../selectors";
 
@@ -157,18 +157,17 @@ function getMenuItems(
     disabled: !selectedSource.url,
     click: () => showSource(sourceId)
   };
 
   const blackBoxMenuItem = {
     id: "node-menu-blackbox",
     label: toggleBlackBoxLabel,
     accesskey: blackboxKey,
-    disabled:
-      isOriginal || isPrettyPrinted || hasSourceMap || !selectedSource.url,
+    disabled: !shouldBlackbox(selectedSource),
     click: () => toggleBlackBox(selectedSource)
   };
 
   const watchExpressionItem = {
     id: "node-menu-add-watch-expression",
     label: watchExpressionLabel,
     accesskey: watchExpressionKey,
     click: () => addExpression(editor.codeMirror.getSelection())
--- a/devtools/client/debugger/new/src/components/Editor/Footer.js
+++ b/devtools/client/debugger/new/src/components/Editor/Footer.js
@@ -14,17 +14,18 @@ import {
   getPaneCollapse
 } from "../../selectors";
 
 import {
   isPretty,
   isLoaded,
   getFilename,
   isOriginal,
-  isLoading
+  isLoading,
+  shouldBlackbox
 } from "../../utils/source";
 import { getGeneratedSource } from "../../reducers/sources";
 import { shouldShowFooter, shouldShowPrettyPrint } from "../../utils/editor";
 
 import { PaneToggleButton } from "../shared/Button";
 
 import type { Source } from "../../types";
 
@@ -102,17 +103,17 @@ class SourceFooter extends PureComponent
       </button>
     );
   }
 
   blackBoxButton() {
     const { selectedSource, toggleBlackBox } = this.props;
     const sourceLoaded = selectedSource && isLoaded(selectedSource);
 
-    if (!sourceLoaded || selectedSource.isPrettyPrinted) {
+    if (!shouldBlackbox(selectedSource)) {
       return;
     }
 
     const blackboxed = selectedSource.isBlackBoxed;
 
     const tooltip = L10N.getStr("sourceFooter.blackbox");
     const type = "black-box";
 
--- a/devtools/client/debugger/new/src/reducers/pause.js
+++ b/devtools/client/debugger/new/src/reducers/pause.js
@@ -8,17 +8,17 @@
 /**
  * Pause reducer
  * @module reducers/pause
  */
 
 import { createSelector } from "reselect";
 import { isGeneratedId } from "devtools-source-map";
 import { prefs } from "../utils/prefs";
-import { getSelectedSource } from "./sources";
+import { getSelectedSource, getSource } from "./sources";
 
 import type { OriginalScope } from "../utils/pause/mapScopes";
 import type { Action } from "../actions/types";
 import type { State } from "./types";
 import type { Why, Scope, SourceId, FrameId, MappedLocation } from "../types";
 
 export type Command =
   | null
@@ -113,17 +113,21 @@ function update(
         frames,
         frameScopes: { ...emptyPauseState.frameScopes },
         loadedObjects: objectMap,
         why
       };
     }
 
     case "MAP_FRAMES": {
-      return { ...state, frames: action.frames };
+      return {
+        ...state,
+        frames: action.frames,
+        selectedFrameId: action.selectedFrameId
+      };
     }
 
     case "ADD_EXTRA": {
       return { ...state, extra: action.extra };
     }
 
     case "ADD_SCOPES": {
       const { frame, status, value } = action;
--- a/devtools/client/debugger/new/src/utils/prefs.js
+++ b/devtools/client/debugger/new/src/utils/prefs.js
@@ -56,16 +56,17 @@ if (isDevelopment()) {
   pref("devtools.debugger.features.column-breakpoints", false);
   pref("devtools.debugger.features.pause-points", true);
   pref("devtools.debugger.features.skip-pausing", true);
   pref("devtools.debugger.features.component-pane", false);
   pref("devtools.debugger.features.autocomplete-expressions", false);
   pref("devtools.debugger.features.map-expression-bindings", true);
   pref("devtools.debugger.features.map-await-expression", true);
   pref("devtools.debugger.features.xhr-breakpoints", true);
+  pref("devtools.debugger.features.origial-blackbox", false);
 }
 
 export const prefs = new PrefsHelper("devtools", {
   logging: ["Bool", "debugger.alphabetize-outline"],
   alphabetizeOutline: ["Bool", "debugger.alphabetize-outline"],
   autoPrettyPrint: ["Bool", "debugger.auto-pretty-print"],
   clientSourceMapsEnabled: ["Bool", "source-map.client-service.enabled"],
   pauseOnExceptions: ["Bool", "debugger.pause-on-exceptions"],
@@ -108,17 +109,18 @@ export const features = new PrefsHelper(
   outline: ["Bool", "outline"],
   codeFolding: ["Bool", "code-folding"],
   pausePoints: ["Bool", "pause-points"],
   skipPausing: ["Bool", "skip-pausing"],
   autocompleteExpression: ["Bool", "autocomplete-expressions"],
   mapExpressionBindings: ["Bool", "map-expression-bindings"],
   mapAwaitExpression: ["Bool", "map-await-expression"],
   componentPane: ["Bool", "component-pane"],
-  xhrBreakpoints: ["Bool", "xhr-breakpoints"]
+  xhrBreakpoints: ["Bool", "xhr-breakpoints"],
+  originalBlackbox: ["Bool", "origial-blackbox"],
 });
 
 export const asyncStore = asyncStoreHelper("debugger", {
   pendingBreakpoints: ["pending-breakpoints", {}],
   tabs: ["tabs", []],
   xhrBreakpoints: ["xhr-breakpoints", []]
 });
 
--- a/devtools/client/debugger/new/src/utils/source.js
+++ b/devtools/client/debugger/new/src/utils/source.js
@@ -14,17 +14,17 @@ import { getUnicodeUrl } from "devtools-
 
 import { endTruncateStr } from "./utils";
 import { truncateMiddleText } from "../utils/text";
 import { parse as parseURL } from "../utils/url";
 import { renderWasmText } from "./wasm";
 import { toEditorPosition } from "./editor";
 export { isMinified } from "./isMinified";
 import { getURL, getFileExtension } from "./sources-tree";
-import { prefs } from "./prefs";
+import { prefs, features } from "./prefs";
 
 import type { Source, SourceLocation, JsSource } from "../types";
 import type { SourceMetaDataType } from "../reducers/ast";
 import type { SymbolDeclarations } from "../workers/parser";
 
 type transformUrlCallback = string => string;
 
 export const sourceTypes = {
@@ -50,16 +50,32 @@ function trimUrlQuery(url: string): stri
     q1 != -1 ? q1 : length,
     q2 != -1 ? q2 : length,
     q3 != -1 ? q3 : length
   );
 
   return url.slice(0, q);
 }
 
+export function shouldBlackbox(source: ?Source) {
+  if (!source) {
+    return false;
+  }
+
+  if (!isLoaded(source) || !source.url) {
+    return false;
+  }
+
+  if (isOriginalId(source.id) && !features.originalBlackbox) {
+    return false;
+  }
+
+  return true;
+}
+
 export function shouldPrettyPrint(source: Source) {
   if (
     !source ||
     isPretty(source) ||
     !isJavaScript(source) ||
     isOriginal(source) ||
     (prefs.clientSourceMapsEnabled && source.sourceMapURL)
   ) {
--- a/devtools/client/preferences/debugger.js
+++ b/devtools/client/preferences/debugger.js
@@ -62,8 +62,9 @@ pref("devtools.debugger.features.code-fo
 pref("devtools.debugger.features.outline", true);
 pref("devtools.debugger.features.pause-points", true);
 pref("devtools.debugger.features.component-pane", false);
 pref("devtools.debugger.features.async-stepping", true);
 pref("devtools.debugger.features.skip-pausing", true);
 pref("devtools.debugger.features.autocomplete-expressions", false);
 pref("devtools.debugger.features.map-expression-bindings", true);
 pref("devtools.debugger.features.xhr-breakpoints", true);
+pref("devtools.debugger.features.origial-blackbox", false);
\ No newline at end of file
--- a/devtools/client/themes/toolbox.css
+++ b/devtools/client/themes/toolbox.css
@@ -629,17 +629,16 @@
 .webreplay-player .recording .progress-line {
   background: #d0021b;
   opacity: 0.3;
 }
 
 .webreplay-player .tick {
   position: absolute;
   height: 100%;
-  transition-duration: var(--progress-bar-transition);
 }
 
 .webreplay-player .tick::before,
 .webreplay-player .tick::after {
   height: 1.5px;
   width: 1px;
   right: 0;
   position: absolute;