Bug 895543 - part 2: show a "this source is black boxed" message and big "un black box" button instead of the source editor for black boxed sources; r=robcee

This commit is contained in:
Nick Fitzgerald 2013-07-30 20:36:13 -07:00
parent 75371593fa
commit 629f07cc1d
15 changed files with 199 additions and 1 deletions

View File

@ -1036,6 +1036,7 @@ SourceScripts.prototype = {
if (item) {
DebuggerView.Sources.callMethod("checkItem", item.target, !isBlackBoxed);
}
DebuggerView.Sources.maybeShowBlackBoxMessage();
},
/**

View File

@ -19,6 +19,7 @@ function SourcesView() {
this._onSourceClick = this._onSourceClick.bind(this);
this._onBreakpointRemoved = this._onBreakpointRemoved.bind(this);
this._onSourceCheck = this._onSourceCheck.bind(this);
this._onStopBlackBoxing = this._onStopBlackBoxing.bind(this);
this._onBreakpointClick = this._onBreakpointClick.bind(this);
this._onBreakpointCheckboxClick = this._onBreakpointCheckboxClick.bind(this);
this._onConditionalPopupShowing = this._onConditionalPopupShowing.bind(this);
@ -48,12 +49,15 @@ SourcesView.prototype = Heritage.extend(WidgetMethods, {
this._cmPopup = document.getElementById("sourceEditorContextMenu");
this._cbPanel = document.getElementById("conditional-breakpoint-panel");
this._cbTextbox = document.getElementById("conditional-breakpoint-panel-textbox");
this._editorDeck = document.getElementById("editor-deck");
this._stopBlackBoxButton = document.getElementById("black-boxed-message-button");
window.addEventListener("Debugger:EditorLoaded", this._onEditorLoad, false);
window.addEventListener("Debugger:EditorUnloaded", this._onEditorUnload, false);
this.widget.addEventListener("select", this._onSourceSelect, false);
this.widget.addEventListener("click", this._onSourceClick, false);
this.widget.addEventListener("check", this._onSourceCheck, false);
this._stopBlackBoxButton.addEventListener("click", this._onStopBlackBoxing, false);
this._cbPanel.addEventListener("popupshowing", this._onConditionalPopupShowing, false);
this._cbPanel.addEventListener("popupshown", this._onConditionalPopupShown, false);
this._cbPanel.addEventListener("popuphiding", this._onConditionalPopupHiding, false);
@ -77,6 +81,7 @@ SourcesView.prototype = Heritage.extend(WidgetMethods, {
this.widget.removeEventListener("select", this._onSourceSelect, false);
this.widget.removeEventListener("click", this._onSourceClick, false);
this.widget.removeEventListener("check", this._onSourceCheck, false);
this._stopBlackBoxButton.removeEventListener("click", this._onStopBlackBoxing, false);
this._cbPanel.removeEventListener("popupshowing", this._onConditionalPopupShowing, false);
this._cbPanel.removeEventListener("popupshowing", this._onConditionalPopupShown, false);
this._cbPanel.removeEventListener("popuphiding", this._onConditionalPopupHiding, false);
@ -638,6 +643,18 @@ SourcesView.prototype = Heritage.extend(WidgetMethods, {
if (DebuggerView.editorSource != selectedSource) {
DebuggerView.editorSource = selectedSource;
}
this.maybeShowBlackBoxMessage();
},
/**
* Show or hide the black box message vs. source editor depending on if the
* selected source is black boxed or not.
*/
maybeShowBlackBoxMessage: function () {
const source = DebuggerController.activeThread.source(
DebuggerView.editorSource);
this._editorDeck.selectedIndex = source.isBlackBoxed ? 1 : 0;
},
/**
@ -656,6 +673,14 @@ SourcesView.prototype = Heritage.extend(WidgetMethods, {
DebuggerController.SourceScripts.blackBox(item.attachment.source, !checked);
},
/**
* The click listener for the stop black boxing button.
*/
_onStopBlackBoxing: function() {
DebuggerController.SourceScripts.blackBox(DebuggerView.editorSource,
false);
},
/**
* The click listener for a breakpoint container.
*/

View File

@ -32,6 +32,8 @@
<commandset id="sourceEditorCommands"/>
<commandset id="debuggerCommands">
<command id="unBlackBoxButton"
oncommand="DebuggerView.Sources._onStopBlackBoxing()"/>
<command id="nextSourceCommand"
oncommand="DebuggerView.Sources.selectNextItem()"/>
<command id="prevSourceCommand"
@ -293,7 +295,19 @@
<vbox id="sources" flex="1"/>
</vbox>
<splitter class="devtools-side-splitter"/>
<vbox id="editor" flex="1"/>
<deck id="editor-deck" flex="1" selectedIndex="0">
<vbox id="editor" />
<vbox id="black-boxed-message" align="center">
<label id="black-boxed-message-label">
&debuggerUI.blackBoxMessage.label;
</label>
<button id="black-boxed-message-button"
class="devtools-toolbarbutton"
label="&debuggerUI.blackBoxMessage.unBlackBoxButton;"
image="chrome://browser/skin/devtools/blackBoxMessageEye.png"
command="unBlackBoxCommand"/>
</vbox>
</deck>
<splitter class="devtools-side-splitter"/>
<vbox id="instruments-pane" hidden="true">
<vbox id="expressions"/>

View File

@ -16,6 +16,7 @@ MOCHITEST_BROWSER_TESTS = \
browser_dbg_blackboxing-02.js \
browser_dbg_blackboxing-03.js \
browser_dbg_blackboxing-04.js \
browser_dbg_blackboxing-05.js \
browser_dbg_clean-exit.js \
browser_dbg_cmd.js \
browser_dbg_cmd_blackbox.js \

View File

@ -0,0 +1,86 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Test that we get a stack frame for each black boxed source, not a single one
* for all of them.
*/
const TAB_URL = EXAMPLE_URL + "binary_search.html";
var gPane = null;
var gTab = null;
var gDebuggee = null;
var gDebugger = null;
function test()
{
let scriptShown = false;
let framesAdded = false;
let resumed = false;
let testStarted = false;
debug_tab_pane(TAB_URL, function(aTab, aDebuggee, aPane) {
resumed = true;
gTab = aTab;
gDebuggee = aDebuggee;
gPane = aPane;
gDebugger = gPane.panelWin;
once(gDebugger, "Debugger:SourceShown", testSourceEditorShown);
});
}
function testSourceEditorShown() {
const deck = gDebugger.document.getElementById("editor-deck");
is(deck.selectedIndex, "0",
"The first item in the deck should be selected (the source editor)");
blackBoxSource();
}
function blackBoxSource() {
const { activeThread } = gDebugger.DebuggerController;
activeThread.addOneTimeListener("blackboxchange", testBlackBoxMessageShown);
getBlackBoxCheckbox().click();
}
function testBlackBoxMessageShown() {
const deck = gDebugger.document.getElementById("editor-deck");
is(deck.selectedIndex, "1",
"The second item in the deck should be selected (the black box message)");
clickStopBlackBoxingButton();
}
function clickStopBlackBoxingButton() {
const button = gDebugger.document.getElementById("black-boxed-message-button");
const { activeThread } = gDebugger.DebuggerController;
activeThread.addOneTimeListener("blackboxchange", testSourceEditorShownAgain);
button.click();
}
function testSourceEditorShownAgain() {
const deck = gDebugger.document.getElementById("editor-deck");
is(deck.selectedIndex, "0",
"The first item in the deck should be selected again (the source editor)");
closeDebuggerAndFinish();
}
function getBlackBoxCheckbox() {
return gDebugger.document.querySelector(
".side-menu-widget-item .side-menu-widget-item-checkbox");
}
function once(target, event, callback) {
target.addEventListener(event, function _listener(...args) {
target.removeEventListener(event, _listener, false);
callback.apply(null, args);
}, false);
}
registerCleanupFunction(function() {
removeTab(gTab);
gPane = null;
gTab = null;
gDebuggee = null;
gDebugger = null;
});

View File

@ -19,6 +19,16 @@
- the button that toggles the panes visible or hidden in the debugger UI. -->
<!ENTITY debuggerUI.panesButton.tooltip "Toggle panes">
<!-- LOCALIZATION NOTE (debuggerUI.blackBoxMessage.label): This is the message
- displayed to users when they select a black boxed source from the sources
- list in the debugger. -->
<!ENTITY debuggerUI.blackBoxMessage.label "This source is black boxed: its breakpoints are disabled, and stepping skips through it.">
<!-- LOCALIZATION NOTE (debuggerUI.blackBoxMessage.unBlackBoxButton): This is
- the text displayed in the button to stop black boxing the currently selected
- source. -->
<!ENTITY debuggerUI.blackBoxMessage.unBlackBoxButton "Stop black boxing this source">
<!-- LOCALIZATION NOTE (debuggerUI.optsButton.tooltip): This is the tooltip for
- the button that opens up an options context menu for the debugger UI. -->
<!ENTITY debuggerUI.optsButton.tooltip "Debugger Options">

Binary file not shown.

After

Width:  |  Height:  |  Size: 836 B

View File

@ -54,6 +54,25 @@
display: none;
}
/* Black box message */
#black-boxed-message {
padding: 100px 50px;
background-color: rgb(61, 69, 76);
color: white;
}
#black-boxed-message-label,
#black-boxed-message-button {
text-align: center;
font-size: 150%;
}
#black-boxed-message-button {
margin-top: 1em;
padding: .25em;
}
/* ListWidget items */
.list-widget-item {

View File

@ -178,6 +178,7 @@ browser.jar:
skin/classic/browser/devtools/magnifying-glass.png (devtools/magnifying-glass.png)
skin/classic/browser/devtools/option-icon.png (devtools/option-icon.png)
skin/classic/browser/devtools/itemToggle.png (devtools/itemToggle.png)
skin/classic/browser/devtools/blackBoxMessageEye.png (devtools/blackBoxMessageEye.png)
skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png)
skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)

Binary file not shown.

After

Width:  |  Height:  |  Size: 836 B

View File

@ -56,6 +56,25 @@
display: none;
}
/* Black box message */
#black-boxed-message {
padding: 100px 50px;
background-color: rgb(61, 69, 76);
color: white;
}
#black-boxed-message-label,
#black-boxed-message-button {
text-align: center;
font-size: 150%;
}
#black-boxed-message-button {
margin-top: 1em;
padding: .25em;
}
/* ListWidget items */
.list-widget-item {

View File

@ -269,6 +269,7 @@ browser.jar:
skin/classic/browser/devtools/magnifying-glass.png (devtools/magnifying-glass.png)
skin/classic/browser/devtools/option-icon.png (devtools/option-icon.png)
skin/classic/browser/devtools/itemToggle.png (devtools/itemToggle.png)
skin/classic/browser/devtools/blackBoxMessageEye.png (devtools/blackBoxMessageEye.png)
skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png)
skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)

Binary file not shown.

After

Width:  |  Height:  |  Size: 836 B

View File

@ -54,6 +54,25 @@
display: none;
}
/* Black box message */
#black-boxed-message {
padding: 100px 50px;
background-color: rgb(61, 69, 76);
color: white;
}
#black-boxed-message-label,
#black-boxed-message-button {
text-align: center;
font-size: 150%;
}
#black-boxed-message-button {
margin-top: 1em;
padding: .25em;
}
/* ListWidget items */
.list-widget-item {

View File

@ -205,6 +205,7 @@ browser.jar:
skin/classic/browser/devtools/magnifying-glass.png (devtools/magnifying-glass.png)
skin/classic/browser/devtools/option-icon.png (devtools/option-icon.png)
skin/classic/browser/devtools/itemToggle.png (devtools/itemToggle.png)
skin/classic/browser/devtools/blackBoxMessageEye.png (devtools/blackBoxMessageEye.png)
skin/classic/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png)
skin/classic/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)
skin/classic/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)
@ -460,6 +461,7 @@ browser.jar:
skin/classic/aero/browser/devtools/magnifying-glass.png (devtools/magnifying-glass.png)
skin/classic/aero/browser/devtools/option-icon.png (devtools/option-icon.png)
skin/classic/aero/browser/devtools/itemToggle.png (devtools/itemToggle.png)
skin/classic/aero/browser/devtools/blackBoxMessageEye.png (devtools/blackBoxMessageEye.png)
skin/classic/aero/browser/devtools/itemArrow-rtl.png (devtools/itemArrow-rtl.png)
skin/classic/aero/browser/devtools/background-noise-toolbar.png (devtools/background-noise-toolbar.png)
skin/classic/aero/browser/devtools/itemArrow-ltr.png (devtools/itemArrow-ltr.png)