wine/gecko
0
0
Fork 0
mirror of https://gitlab.winehq.org/wine/wine-gecko.git synced 2024-09-13 09:24:08 -07:00
Code Issues Packages Projects Releases Wiki Activity

Backed out changeset 894e40121370 (bug 917226) for mochitest-chrome failures

Browse Source
This commit is contained in:
Ed Morley 2014-03-27 16:11:59 +00:00
parent 5dcb75658d
commit a9d17b7cb7
70 changed files with 101 additions and 5759 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
browser/app/profile/firefox.js
View File

@ -1205,9 +1205,6 @@ pref("devtools.styleeditor.autocompletion-enabled", true);
// Enable the Shader Editor.
pref("devtools.shadereditor.enabled", false);
// Enable the Canvas Debugger.
pref("devtools.canvasdebugger.enabled", false);
// Enable tools for Chrome development.
pref("devtools.chrome.enabled", false);

1270
browser/devtools/canvasdebugger/canvasdebugger.js
View File

File diff suppressed because it is too large Load Diff

131
browser/devtools/canvasdebugger/canvasdebugger.xul
View File

@ -1,131 +0,0 @@
<?xml version="1.0"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<?xml-stylesheet href="chrome://browser/skin/" type="text/css"?>
<?xml-stylesheet href="chrome://browser/content/devtools/widgets.css" type="text/css"?>
<?xml-stylesheet href="chrome://browser/skin/devtools/common.css" type="text/css"?>
<?xml-stylesheet href="chrome://browser/skin/devtools/widgets.css" type="text/css"?>
<?xml-stylesheet href="chrome://browser/skin/devtools/canvasdebugger.css" type="text/css"?>
<!DOCTYPE window [
<!ENTITY % canvasDebuggerDTD SYSTEM "chrome://browser/locale/devtools/canvasdebugger.dtd">
%canvasDebuggerDTD;
]>
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script src="chrome://browser/content/devtools/theme-switching.js"/>
<script type="application/javascript" src="canvasdebugger.js"/>
<hbox class="theme-body" flex="1">
<vbox id="snapshots-pane">
<toolbar id="snapshots-toolbar"
class="devtools-toolbar">
<hbox id="snapshots-controls"
class="devtools-toolbarbutton-group">
<toolbarbutton id="record-snapshot"
class="devtools-toolbarbutton"
oncommand="SnapshotsListView._onRecordButtonClick()"
tooltiptext="&canvasDebuggerUI.recordSnapshot.tooltip;"
hidden="true"/>
<toolbarbutton id="import-snapshot"
class="devtools-toolbarbutton"
oncommand="SnapshotsListView._onImportButtonClick()"
label="&canvasDebuggerUI.importSnapshot;"/>
<toolbarbutton id="clear-snapshots"
class="devtools-toolbarbutton"
oncommand="SnapshotsListView._onClearButtonClick()"
label="&canvasDebuggerUI.clearSnapshots;"/>
</hbox>
</toolbar>
<vbox id="snapshots-list" flex="1"/>
</vbox>
<vbox id="debugging-pane" flex="1">
<hbox id="reload-notice"
class="notice-container"
align="center"
pack="center"
flex="1">
<button id="reload-notice-button"
class="devtools-toolbarbutton"
label="&canvasDebuggerUI.reloadNotice1;"
oncommand="gFront.setup({ reload: true })"/>
<label id="reload-notice-label"
class="plain"
value="&canvasDebuggerUI.reloadNotice2;"/>
</hbox>
<hbox id="empty-notice"
class="notice-container"
align="center"
pack="center"
flex="1"
hidden="true">
<label value="&canvasDebuggerUI.emptyNotice1;"/>
<button id="canvas-debugging-empty-notice-button"
class="devtools-toolbarbutton"
oncommand="SnapshotsListView._onRecordButtonClick()"/>
<label value="&canvasDebuggerUI.emptyNotice2;"/>
</hbox>
<hbox id="import-notice"
class="notice-container"
align="center"
pack="center"
flex="1"
hidden="true">
<label value="&canvasDebuggerUI.importNotice;"/>
</hbox>
<box id="debugging-pane-contents"
class="devtools-responsive-container"
flex="1"
hidden="true">
<vbox id="calls-list-container" flex="1">
<toolbar id="debugging-toolbar"
class="devtools-toolbar">
<hbox id="debugging-controls"
class="devtools-toolbarbutton-group">
<toolbarbutton id="resume"
class="devtools-toolbarbutton"
oncommand="CallsListView._onResume()"/>
<toolbarbutton id="step-over"
class="devtools-toolbarbutton"
oncommand="CallsListView._onStepOver()"/>
<toolbarbutton id="step-in"
class="devtools-toolbarbutton"
oncommand="CallsListView._onStepIn()"/>
<toolbarbutton id="step-out"
class="devtools-toolbarbutton"
oncommand="CallsListView._onStepOut()"/>
</hbox>
<toolbarbutton id="debugging-toolbar-sizer-button"
class="devtools-toolbarbutton"
label=""/>
<scale id="calls-slider"
movetoclick="true"
flex="100"/>
<textbox id="calls-searchbox"
class="devtools-searchinput"
placeholder="&canvasDebuggerUI.searchboxPlaceholder;"
type="search"
flex="1"/>
</toolbar>
<vbox id="calls-list" flex="1"/>
</vbox>
<splitter class="devtools-side-splitter"/>
<vbox id="screenshot-container"
hidden="true">
<vbox id="screenshot-image" flex="1"/>
<label id="screenshot-dimensions" class="plain"/>
</vbox>
</box>
<hbox id="snapshot-filmstrip"
hidden="true"/>
</vbox>
</hbox>
</window>

12
browser/devtools/canvasdebugger/moz.build
View File

@ -1,12 +0,0 @@
# vim: set filetype=python:
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
TEST_DIRS += ['test']
JS_MODULES_PATH = 'modules/devtools/canvasdebugger'
EXTRA_JS_MODULES += [
'panel.js'
]

72
browser/devtools/canvasdebugger/panel.js
View File

@ -1,72 +0,0 @@
/* -*- Mode: javascript; tab-width: 2; indent-tabs-mode: nil; c-basic-offset: 2 -*- */
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const { Cc, Ci, Cu, Cr } = require("chrome");
const promise = Cu.import("resource://gre/modules/Promise.jsm", {}).Promise;
const EventEmitter = require("devtools/toolkit/event-emitter");
const { CanvasFront } = require("devtools/server/actors/canvas");
const { DevToolsUtils } = Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm", {});
function CanvasDebuggerPanel(iframeWindow, toolbox) {
this.panelWin = iframeWindow;
this._toolbox = toolbox;
this._destroyer = null;
EventEmitter.decorate(this);
};
exports.CanvasDebuggerPanel = CanvasDebuggerPanel;
CanvasDebuggerPanel.prototype = {
/**
* Open is effectively an asynchronous constructor.
*
* @return object
* A promise that is resolved when the Canvas Debugger completes opening.
*/
open: function() {
let targetPromise;
// Local debugging needs to make the target remote.
if (!this.target.isRemote) {
targetPromise = this.target.makeRemote();
} else {
targetPromise = promise.resolve(this.target);
}
return targetPromise
.then(() => {
this.panelWin.gToolbox = this._toolbox;
this.panelWin.gTarget = this.target;
this.panelWin.gFront = new CanvasFront(this.target.client, this.target.form);
return this.panelWin.startupCanvasDebugger();
})
.then(() => {
this.isReady = true;
this.emit("ready");
return this;
})
.then(null, function onError(aReason) {
DevToolsUtils.reportException("CanvasDebuggerPanel.prototype.open", aReason);
});
},
// DevToolPanel API
get target() this._toolbox.target,
destroy: function() {
// Make sure this panel is not already destroyed.
if (this._destroyer) {
return this._destroyer;
}
return this._destroyer = this.panelWin.shutdownCanvasDebugger().then(() => {
this.emit("destroyed");
});
}
};

34
browser/devtools/canvasdebugger/test/browser.ini
View File

@ -1,34 +0,0 @@
[DEFAULT]
support-files =
doc_simple-canvas.html
doc_simple-canvas-deep-stack.html
doc_simple-canvas-transparent.html
head.js
[browser_canvas-actor-test-01.js]
[browser_canvas-actor-test-02.js]
[browser_canvas-actor-test-03.js]
[browser_canvas-actor-test-04.js]
[browser_canvas-actor-test-05.js]
[browser_canvas-actor-test-06.js]
[browser_canvas-actor-test-07.js]
[browser_canvas-frontend-call-highlight.js]
[browser_canvas-frontend-call-list.js]
[browser_canvas-frontend-call-search.js]
[browser_canvas-frontend-call-stack-01.js]
[browser_canvas-frontend-call-stack-02.js]
[browser_canvas-frontend-call-stack-03.js]
[browser_canvas-frontend-clear.js]
[browser_canvas-frontend-img-screenshots.js]
[browser_canvas-frontend-img-thumbnails-01.js]
[browser_canvas-frontend-img-thumbnails-02.js]
[browser_canvas-frontend-open.js]
[browser_canvas-frontend-record-01.js]
[browser_canvas-frontend-record-02.js]
[browser_canvas-frontend-record-03.js]
[browser_canvas-frontend-reload-01.js]
[browser_canvas-frontend-reload-02.js]
[browser_canvas-frontend-slider-01.js]
[browser_canvas-frontend-slider-02.js]
[browser_canvas-frontend-snapshot-select.js]
[browser_canvas-frontend-stepping.js]

18
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-01.js
View File

@ -1,18 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the canvas debugger leaks on initialization and sudden destruction.
* You can also use this initialization format as a template for other tests.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCallWatcherBackend(SIMPLE_CANVAS_URL);
ok(target, "Should have a target available.");
ok(debuggee, "Should have a debuggee available.");
ok(front, "Should have a protocol front available.");
yield removeTab(target.tab);
finish();
}

77
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-02.js
View File

@ -1,77 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if functions calls are recorded and stored for a canvas context,
* and that their stack is successfully retrieved.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCallWatcherBackend(SIMPLE_CANVAS_URL);
let navigated = once(target, "navigate");
yield front.setup({
tracedGlobals: ["CanvasRenderingContext2D", "WebGLRenderingContext"],
startRecording: true,
performReload: true
});
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
// Allow the content to execute some functions.
yield waitForTick();
let functionCalls = yield front.pauseRecording();
ok(functionCalls,
"An array of function call actors was sent after reloading.");
ok(functionCalls.length > 0,
"There's at least one function call actor available.");
is(functionCalls[0].type, CallWatcherFront.METHOD_FUNCTION,
"The called function is correctly identified as a method.");
is(functionCalls[0].name, "clearRect",
"The called function's name is correct.");
is(functionCalls[0].file, SIMPLE_CANVAS_URL,
"The called function's file is correct.");
is(functionCalls[0].line, 25,
"The called function's line is correct.");
is(functionCalls[0].callerPreview, "ctx",
"The called function's caller preview is correct.");
is(functionCalls[0].argsPreview, "0, 0, 128, 128",
"The called function's args preview is correct.");
let details = yield functionCalls[1].getDetails();
ok(details,
"The first called function has some details available.")
is(details.stack.length, 3,
"The called function's stack depth is correct.");
is(details.stack[0].name, "fillStyle",
"The called function's stack is correct (1.1).");
is(details.stack[0].file, SIMPLE_CANVAS_URL,
"The called function's stack is correct (1.2).");
is(details.stack[0].line, 20,
"The called function's stack is correct (1.3).");
is(details.stack[1].name, "drawRect",
"The called function's stack is correct (2.1).");
is(details.stack[1].file, SIMPLE_CANVAS_URL,
"The called function's stack is correct (2.2).");
is(details.stack[1].line, 26,
"The called function's stack is correct (2.3).");
is(details.stack[2].name, "drawScene",
"The called function's stack is correct (3.1).");
is(details.stack[2].file, SIMPLE_CANVAS_URL,
"The called function's stack is correct (3.2).");
is(details.stack[2].line, 33,
"The called function's stack is correct (3.3).");
yield removeTab(target.tab);
finish();
}

75
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-03.js
View File

@ -1,75 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if functions inside a single animation frame are recorded and stored
* for a canvas context.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCanavsDebuggerBackend(SIMPLE_CANVAS_URL);
let navigated = once(target, "navigate");
yield front.setup({ reload: true });
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
let snapshotActor = yield front.recordAnimationFrame();
ok(snapshotActor,
"A snapshot actor was sent after recording.");
let animationOverview = yield snapshotActor.getOverview();
ok(snapshotActor,
"An animation overview could be retrieved after recording.");
let functionCalls = animationOverview.calls;
ok(functionCalls,
"An array of function call actors was sent after recording.");
is(functionCalls.length, 8,
"The number of function call actors is correct.");
is(functionCalls[0].type, CallWatcherFront.METHOD_FUNCTION,
"The first called function is correctly identified as a method.");
is(functionCalls[0].name, "clearRect",
"The first called function's name is correct.");
is(functionCalls[0].file, SIMPLE_CANVAS_URL,
"The first called function's file is correct.");
is(functionCalls[0].line, 25,
"The first called function's line is correct.");
is(functionCalls[0].argsPreview, "0, 0, 128, 128",
"The first called function's args preview is correct.");
is(functionCalls[0].callerPreview, "ctx",
"The first called function's caller preview is correct.");
is(functionCalls[6].type, CallWatcherFront.METHOD_FUNCTION,
"The penultimate called function is correctly identified as a method.");
is(functionCalls[6].name, "fillRect",
"The penultimate called function's name is correct.");
is(functionCalls[6].file, SIMPLE_CANVAS_URL,
"The penultimate called function's file is correct.");
is(functionCalls[6].line, 21,
"The penultimate called function's line is correct.");
is(functionCalls[6].argsPreview, "10, 10, 55, 50",
"The penultimate called function's args preview is correct.");
is(functionCalls[6].callerPreview, "ctx",
"The penultimate called function's caller preview is correct.");
is(functionCalls[7].type, CallWatcherFront.METHOD_FUNCTION,
"The last called function is correctly identified as a method.");
is(functionCalls[7].name, "requestAnimationFrame",
"The last called function's name is correct.");
is(functionCalls[7].file, SIMPLE_CANVAS_URL,
"The last called function's file is correct.");
is(functionCalls[7].line, 30,
"The last called function's line is correct.");
ok(functionCalls[7].argsPreview.contains("Function"),
"The last called function's args preview is correct.");
is(functionCalls[7].callerPreview, "",
"The last called function's caller preview is correct.");
yield removeTab(target.tab);
finish();
}

80
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-04.js
View File

@ -1,80 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if draw calls inside a single animation frame generate and retrieve
* the correct thumbnails.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCanavsDebuggerBackend(SIMPLE_CANVAS_URL);
let navigated = once(target, "navigate");
yield front.setup({ reload: true });
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
let snapshotActor = yield front.recordAnimationFrame();
ok(snapshotActor,
"A snapshot actor was sent after recording.");
let animationOverview = yield snapshotActor.getOverview();
ok(snapshotActor,
"An animation overview could be retrieved after recording.");
let thumbnails = animationOverview.thumbnails;
ok(thumbnails,
"An array of thumbnails was sent after recording.");
is(thumbnails.length, 4,
"The number of thumbnails is correct.");
is(thumbnails[0].index, 0,
"The first thumbnail's index is correct.");
is(thumbnails[0].width, 50,
"The first thumbnail's width is correct.");
is(thumbnails[0].height, 50,
"The first thumbnail's height is correct.");
is(thumbnails[0].flipped, false,
"The first thumbnail's flipped flag is correct.");
is([].find.call(thumbnails[0].pixels, e => e > 0), undefined,
"The first thumbnail's pixels seem to be completely transparent.");
is(thumbnails[1].index, 2,
"The second thumbnail's index is correct.");
is(thumbnails[1].width, 50,
"The second thumbnail's width is correct.");
is(thumbnails[1].height, 50,
"The second thumbnail's height is correct.");
is(thumbnails[1].flipped, false,
"The second thumbnail's flipped flag is correct.");
is([].find.call(thumbnails[1].pixels, e => e > 0), 4290822336,
"The second thumbnail's pixels seem to not be completely transparent.");
is(thumbnails[2].index, 4,
"The third thumbnail's index is correct.");
is(thumbnails[2].width, 50,
"The third thumbnail's width is correct.");
is(thumbnails[2].height, 50,
"The third thumbnail's height is correct.");
is(thumbnails[2].flipped, false,
"The third thumbnail's flipped flag is correct.");
is([].find.call(thumbnails[2].pixels, e => e > 0), 4290822336,
"The third thumbnail's pixels seem to not be completely transparent.");
is(thumbnails[3].index, 6,
"The fourth thumbnail's index is correct.");
is(thumbnails[3].width, 50,
"The fourth thumbnail's width is correct.");
is(thumbnails[3].height, 50,
"The fourth thumbnail's height is correct.");
is(thumbnails[3].flipped, false,
"The fourth thumbnail's flipped flag is correct.");
is([].find.call(thumbnails[3].pixels, e => e > 0), 4290822336,
"The fourth thumbnail's pixels seem to not be completely transparent.");
yield removeTab(target.tab);
finish();
}

45
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-05.js
View File

@ -1,45 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if draw calls inside a single animation frame generate and retrieve
* the correct "end result" screenshot.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCanavsDebuggerBackend(SIMPLE_CANVAS_URL);
let navigated = once(target, "navigate");
yield front.setup({ reload: true });
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
let snapshotActor = yield front.recordAnimationFrame();
ok(snapshotActor,
"A snapshot actor was sent after recording.");
let animationOverview = yield snapshotActor.getOverview();
ok(snapshotActor,
"An animation overview could be retrieved after recording.");
let screenshot = animationOverview.screenshot;
ok(screenshot,
"A screenshot was sent after recording.");
is(screenshot.index, 6,
"The screenshot's index is correct.");
is(screenshot.width, 128,
"The screenshot's width is correct.");
is(screenshot.height, 128,
"The screenshot's height is correct.");
is(screenshot.flipped, false,
"The screenshot's flipped flag is correct.");
is([].find.call(screenshot.pixels, e => e > 0), 4290822336,
"The screenshot's pixels seem to not be completely transparent.");
yield removeTab(target.tab);
finish();
}

95
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-06.js
View File

@ -1,95 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if screenshots for arbitrary draw calls are generated properly.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCanavsDebuggerBackend(SIMPLE_CANVAS_TRANSPARENT_URL);
let navigated = once(target, "navigate");
yield front.setup({ reload: true });
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
let snapshotActor = yield front.recordAnimationFrame();
let animationOverview = yield snapshotActor.getOverview();
let functionCalls = animationOverview.calls;
ok(functionCalls,
"An array of function call actors was sent after recording.");
is(functionCalls.length, 8,
"The number of function call actors is correct.");
is(functionCalls[0].name, "clearRect",
"The first called function's name is correct.");
is(functionCalls[2].name, "fillRect",
"The second called function's name is correct.");
is(functionCalls[4].name, "fillRect",
"The third called function's name is correct.");
is(functionCalls[6].name, "fillRect",
"The fourth called function's name is correct.");
let firstDrawCallScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[0]);
let secondDrawCallScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[2]);
let thirdDrawCallScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[4]);
let fourthDrawCallScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[6]);
ok(firstDrawCallScreenshot,
"The first draw call has a screenshot attached.");
is(firstDrawCallScreenshot.index, 0,
"The first draw call has the correct screenshot index.");
is(firstDrawCallScreenshot.width, 128,
"The first draw call has the correct screenshot width.");
is(firstDrawCallScreenshot.height, 128,
"The first draw call has the correct screenshot height.");
is([].find.call(firstDrawCallScreenshot.pixels, e => e > 0), undefined,
"The first draw call's screenshot's pixels seems to be completely transparent.");
ok(secondDrawCallScreenshot,
"The second draw call has a screenshot attached.");
is(secondDrawCallScreenshot.index, 2,
"The second draw call has the correct screenshot index.");
is(secondDrawCallScreenshot.width, 128,
"The second draw call has the correct screenshot width.");
is(secondDrawCallScreenshot.height, 128,
"The second draw call has the correct screenshot height.");
is([].find.call(firstDrawCallScreenshot.pixels, e => e > 0), undefined,
"The second draw call's screenshot's pixels seems to be completely transparent.");
ok(thirdDrawCallScreenshot,
"The third draw call has a screenshot attached.");
is(thirdDrawCallScreenshot.index, 4,
"The third draw call has the correct screenshot index.");
is(thirdDrawCallScreenshot.width, 128,
"The third draw call has the correct screenshot width.");
is(thirdDrawCallScreenshot.height, 128,
"The third draw call has the correct screenshot height.");
is([].find.call(thirdDrawCallScreenshot.pixels, e => e > 0), 2160001024,
"The third draw call's screenshot's pixels seems to not be completely transparent.");
ok(fourthDrawCallScreenshot,
"The fourth draw call has a screenshot attached.");
is(fourthDrawCallScreenshot.index, 6,
"The fourth draw call has the correct screenshot index.");
is(fourthDrawCallScreenshot.width, 128,
"The fourth draw call has the correct screenshot width.");
is(fourthDrawCallScreenshot.height, 128,
"The fourth draw call has the correct screenshot height.");
is([].find.call(fourthDrawCallScreenshot.pixels, e => e > 0), 2147483839,
"The fourth draw call's screenshot's pixels seems to not be completely transparent.");
isnot(firstDrawCallScreenshot.pixels, secondDrawCallScreenshot.pixels,
"The screenshots taken on consecutive draw calls are different (1).");
isnot(secondDrawCallScreenshot.pixels, thirdDrawCallScreenshot.pixels,
"The screenshots taken on consecutive draw calls are different (2).");
isnot(thirdDrawCallScreenshot.pixels, fourthDrawCallScreenshot.pixels,
"The screenshots taken on consecutive draw calls are different (3).");
yield removeTab(target.tab);
finish();
}

94
browser/devtools/canvasdebugger/test/browser_canvas-actor-test-07.js
View File

@ -1,94 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if screenshots for non-draw calls can still be retrieved properly,
* by deferring the the most recent previous draw-call.
*/
function ifTestingSupported() {
let [target, debuggee, front] = yield initCanavsDebuggerBackend(SIMPLE_CANVAS_URL);
let navigated = once(target, "navigate");
yield front.setup({ reload: true });
ok(true, "The front was setup up successfully.");
yield navigated;
ok(true, "Target automatically navigated when the front was set up.");
let snapshotActor = yield front.recordAnimationFrame();
let animationOverview = yield snapshotActor.getOverview();
let functionCalls = animationOverview.calls;
ok(functionCalls,
"An array of function call actors was sent after recording.");
is(functionCalls.length, 8,
"The number of function call actors is correct.");
let firstNonDrawCall = yield functionCalls[1].getDetails();
let secondNonDrawCall = yield functionCalls[3].getDetails();
let lastNonDrawCall = yield functionCalls[7].getDetails();
is(firstNonDrawCall.name, "fillStyle",
"The first non-draw function's name is correct.");
is(secondNonDrawCall.name, "fillStyle",
"The second non-draw function's name is correct.");
is(lastNonDrawCall.name, "requestAnimationFrame",
"The last non-draw function's name is correct.");
let firstScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[1]);
let secondScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[3]);
let lastScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[7]);
ok(firstScreenshot,
"A screenshot was successfully retrieved for the first non-draw function.");
ok(secondScreenshot,
"A screenshot was successfully retrieved for the second non-draw function.");
ok(lastScreenshot,
"A screenshot was successfully retrieved for the last non-draw function.");
let firstActualScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[0]);
ok(sameArray(firstScreenshot.pixels, firstActualScreenshot.pixels),
"The screenshot for the first non-draw function is correct.");
is(firstScreenshot.width, 128,
"The screenshot for the first non-draw function has the correct width.");
is(firstScreenshot.height, 128,
"The screenshot for the first non-draw function has the correct height.");
let secondActualScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[2]);
ok(sameArray(secondScreenshot.pixels, secondActualScreenshot.pixels),
"The screenshot for the second non-draw function is correct.");
is(secondScreenshot.width, 128,
"The screenshot for the second non-draw function has the correct width.");
is(secondScreenshot.height, 128,
"The screenshot for the second non-draw function has the correct height.");
let lastActualScreenshot = yield snapshotActor.generateScreenshotFor(functionCalls[6]);
ok(sameArray(lastScreenshot.pixels, lastActualScreenshot.pixels),
"The screenshot for the last non-draw function is correct.");
is(lastScreenshot.width, 128,
"The screenshot for the last non-draw function has the correct width.");
is(lastScreenshot.height, 128,
"The screenshot for the last non-draw function has the correct height.");
ok(!sameArray(firstScreenshot.pixels, secondScreenshot.pixels),
"The screenshots taken on consecutive draw calls are different (1).");
ok(!sameArray(secondScreenshot.pixels, lastScreenshot.pixels),
"The screenshots taken on consecutive draw calls are different (2).");
yield removeTab(target.tab);
finish();
}
function sameArray(a, b) {
if (a.length != b.length) {
return false;
}
for (let i = 0; i < a.length; i++) {
if (a[i] !== b[i]) {
return false;
}
}
return true;
}

41
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-highlight.js
View File

@ -1,41 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if certain function calls are properly highlighted in the UI.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
is(CallsListView.itemCount, 8,
"All the function calls should now be displayed in the UI.");
is($(".call-item-view", CallsListView.getItemAtIndex(0).target).hasAttribute("draw-call"), true,
"The first item's node should have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(1).target).hasAttribute("draw-call"), false,
"The second item's node should not have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(2).target).hasAttribute("draw-call"), true,
"The third item's node should have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(3).target).hasAttribute("draw-call"), false,
"The fourth item's node should not have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(4).target).hasAttribute("draw-call"), true,
"The fifth item's node should have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(5).target).hasAttribute("draw-call"), false,
"The sixth item's node should not have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(6).target).hasAttribute("draw-call"), true,
"The seventh item's node should have a draw-call attribute.");
is($(".call-item-view", CallsListView.getItemAtIndex(7).target).hasAttribute("draw-call"), false,
"The eigth item's node should not have a draw-call attribute.");
yield teardown(panel);
finish();
}

70
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-list.js
View File

@ -1,70 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if all the function calls associated with an animation frame snapshot
* are properly displayed in the UI.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
is(CallsListView.itemCount, 8,
"All the function calls should now be displayed in the UI.");
testItem(CallsListView.getItemAtIndex(0),
"1", "ctx", "clearRect", "(0, 0, 128, 128)", "doc_simple-canvas.html:25");
testItem(CallsListView.getItemAtIndex(1),
"2", "ctx", "fillStyle", " = rgb(192, 192, 192)", "doc_simple-canvas.html:20");
testItem(CallsListView.getItemAtIndex(2),
"3", "ctx", "fillRect", "(0, 0, 128, 128)", "doc_simple-canvas.html:21");
testItem(CallsListView.getItemAtIndex(3),
"4", "ctx", "fillStyle", " = rgba(0, 0, 192, 0.5)", "doc_simple-canvas.html:20");
testItem(CallsListView.getItemAtIndex(4),
"5", "ctx", "fillRect", "(30, 30, 55, 50)", "doc_simple-canvas.html:21");
testItem(CallsListView.getItemAtIndex(5),
"6", "ctx", "fillStyle", " = rgba(192, 0, 0, 0.5)", "doc_simple-canvas.html:20");
testItem(CallsListView.getItemAtIndex(6),
"7", "ctx", "fillRect", "(10, 10, 55, 50)", "doc_simple-canvas.html:21");
testItem(CallsListView.getItemAtIndex(7),
"8", "", "requestAnimationFrame", "(Function)", "doc_simple-canvas.html:30");
function testItem(item, index, context, name, args, location) {
let i = CallsListView.indexOfItem(item);
is(i, index - 1,
"The item at index " + index + " is correctly displayed in the UI.");
is($(".call-item-index", item.target).getAttribute("value"), index,
"The item's gutter label has the correct text.");
if (context) {
is($(".call-item-context", item.target).getAttribute("value"), context,
"The item's context label has the correct text.");
} else {
is($(".call-item-context", item.target), null,
"The item's context label should not be available.");
}
is($(".call-item-name", item.target).getAttribute("value"), name,
"The item's name label has the correct text.");
is($(".call-item-args", item.target).getAttribute("value"), args,
"The item's args label has the correct text.");
is($(".call-item-location", item.target).getAttribute("value"), location,
"The item's location label has the correct text.");
}
yield teardown(panel);
finish();
}

72
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-search.js
View File

@ -1,72 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if filtering the items in the call list works properly.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
let searchbox = $("#calls-searchbox");
yield reload(target);
let firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([firstRecordingFinished, callListPopulated]);
is(searchbox.value, "",
"The searchbox should be initially empty.");
is(CallsListView.visibleItems.length, 8,
"All the items should be initially visible in the calls list.");
searchbox.focus();
EventUtils.sendString("clear", window);
is(searchbox.value, "clear",
"The searchbox should now contain the 'clear' string.");
is(CallsListView.visibleItems.length, 1,
"Only one item should now be visible in the calls list.");
is(CallsListView.visibleItems[0].attachment.actor.type, CallWatcherFront.METHOD_FUNCTION,
"The visible item's type has the expected value.");
is(CallsListView.visibleItems[0].attachment.actor.name, "clearRect",
"The visible item's name has the expected value.");
is(CallsListView.visibleItems[0].attachment.actor.file, SIMPLE_CANVAS_URL,
"The visible item's file has the expected value.");
is(CallsListView.visibleItems[0].attachment.actor.line, 25,
"The visible item's line has the expected value.");
is(CallsListView.visibleItems[0].attachment.actor.argsPreview, "0, 0, 128, 128",
"The visible item's args have the expected value.");
is(CallsListView.visibleItems[0].attachment.actor.callerPreview, "ctx",
"The visible item's caller has the expected value.");
let secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield secondRecordingFinished;
SnapshotsListView.selectedIndex = 1;
yield callListPopulated;
is(searchbox.value, "clear",
"The searchbox should still contain the 'clear' string.");
is(CallsListView.visibleItems.length, 1,
"Only one item should still be visible in the calls list.");
for (let i = 0; i < 5; i++) {
searchbox.focus();
EventUtils.sendKey("BACK_SPACE", window);
}
is(searchbox.value, "",
"The searchbox should now be emptied.");
is(CallsListView.visibleItems.length, 8,
"All the items should be initially visible again in the calls list.");
yield teardown(panel);
finish();
}

74
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-stack-01.js
View File

@ -1,74 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the a function call's stack is properly displayed in the UI.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
let callItem = CallsListView.getItemAtIndex(2);
let locationLink = $(".call-item-location", callItem.target);
is($(".call-item-stack", callItem.target), null,
"There should be no stack container available yet for the draw call.");
let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
EventUtils.sendMouseEvent({ type: "mousedown" }, locationLink, window);
yield callStackDisplayed;
isnot($(".call-item-stack", callItem.target), null,
"There should be a stack container available now for the draw call.");
is($all(".call-item-stack-fn", callItem.target).length, 4,
"There should be 4 functions on the stack for the draw call.");
ok($all(".call-item-stack-fn-name", callItem.target)[0].getAttribute("value")
.contains("C()"),
"The first function on the stack has the correct name.");
ok($all(".call-item-stack-fn-name", callItem.target)[1].getAttribute("value")
.contains("B()"),
"The second function on the stack has the correct name.");
ok($all(".call-item-stack-fn-name", callItem.target)[2].getAttribute("value")
.contains("A()"),
"The third function on the stack has the correct name.");
ok($all(".call-item-stack-fn-name", callItem.target)[3].getAttribute("value")
.contains("drawRect()"),
"The fourth function on the stack has the correct name.");
is($all(".call-item-stack-fn-location", callItem.target)[0].getAttribute("value"),
"doc_simple-canvas-deep-stack.html:26",
"The first function on the stack has the correct location.");
is($all(".call-item-stack-fn-location", callItem.target)[1].getAttribute("value"),
"doc_simple-canvas-deep-stack.html:28",
"The second function on the stack has the correct location.");
is($all(".call-item-stack-fn-location", callItem.target)[2].getAttribute("value"),
"doc_simple-canvas-deep-stack.html:30",
"The third function on the stack has the correct location.");
is($all(".call-item-stack-fn-location", callItem.target)[3].getAttribute("value"),
"doc_simple-canvas-deep-stack.html:35",
"The fourth function on the stack has the correct location.");
let jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
EventUtils.sendMouseEvent({ type: "mousedown" }, $(".call-item-stack-fn-location", callItem.target));
yield jumpedToSource;
let toolbox = yield gDevTools.getToolbox(target);
let { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
is(view.Sources.selectedValue, SIMPLE_CANVAS_DEEP_STACK_URL,
"The expected source was shown in the debugger.");
is(view.editor.getCursor().line, 25,
"The expected source line is highlighted in the debugger.");
yield teardown(panel);
finish();
}

49
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-stack-02.js
View File

@ -1,49 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the a function call's stack is properly displayed in the UI
* and jumping to source in the debugger for the topmost call item works.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
let callItem = CallsListView.getItemAtIndex(2);
let locationLink = $(".call-item-location", callItem.target);
is($(".call-item-stack", callItem.target), null,
"There should be no stack container available yet for the draw call.");
let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
EventUtils.sendMouseEvent({ type: "mousedown" }, locationLink, window);
yield callStackDisplayed;
isnot($(".call-item-stack", callItem.target), null,
"There should be a stack container available now for the draw call.");
is($all(".call-item-stack-fn", callItem.target).length, 4,
"There should be 4 functions on the stack for the draw call.");
let jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
EventUtils.sendMouseEvent({ type: "mousedown" }, $(".call-item-location", callItem.target));
yield jumpedToSource;
let toolbox = yield gDevTools.getToolbox(target);
let { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
is(view.Sources.selectedValue, SIMPLE_CANVAS_DEEP_STACK_URL,
"The expected source was shown in the debugger.");
is(view.editor.getCursor().line, 23,
"The expected source line is highlighted in the debugger.");
yield teardown(panel);
finish();
}

61
browser/devtools/canvasdebugger/test/browser_canvas-frontend-call-stack-03.js
View File

@ -1,61 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the a function call's stack can be shown/hidden by double-clicking
* on a function call item.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
let callItem = CallsListView.getItemAtIndex(2);
let view = $(".call-item-view", callItem.target);
let contents = $(".call-item-contents", callItem.target);
is(view.hasAttribute("call-stack-populated"), false,
"The call item's view should not have the stack populated yet.");
is(view.hasAttribute("call-stack-expanded"), false,
"The call item's view should not have the stack populated yet.");
is($(".call-item-stack", callItem.target), null,
"There should be no stack container available yet for the draw call.");
let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
EventUtils.sendMouseEvent({ type: "dblclick" }, contents, window);
yield callStackDisplayed;
is(view.hasAttribute("call-stack-populated"), true,
"The call item's view should have the stack populated now.");
is(view.getAttribute("call-stack-expanded"), "true",
"The call item's view should have the stack expanded now.");
isnot($(".call-item-stack", callItem.target), null,
"There should be a stack container available now for the draw call.");
is($(".call-item-stack", callItem.target).hidden, false,
"The stack container should now be visible.");
is($all(".call-item-stack-fn", callItem.target).length, 4,
"There should be 4 functions on the stack for the draw call.");
EventUtils.sendMouseEvent({ type: "dblclick" }, contents, window);
is(view.hasAttribute("call-stack-populated"), true,
"The call item's view should still have the stack populated.");
is(view.getAttribute("call-stack-expanded"), "false",
"The call item's view should not have the stack expanded anymore.");
isnot($(".call-item-stack", callItem.target), null,
"There should still be a stack container available for the draw call.");
is($(".call-item-stack", callItem.target).hidden, true,
"The stack container should now be hidden.");
is($all(".call-item-stack-fn", callItem.target).length, 4,
"There should still be 4 functions on the stack for the draw call.");
yield teardown(panel);
finish();
}

43
browser/devtools/canvasdebugger/test/browser_canvas-frontend-clear.js
View File

@ -1,43 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if clearing the snapshots list works as expected.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, EVENTS, SnapshotsListView } = panel.panelWin;
yield reload(target);
let firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
yield firstRecordingFinished;
ok(true, "Finished recording a snapshot of the animation loop.");
is(SnapshotsListView.itemCount, 1,
"There should be one item available in the snapshots list.");
let secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
yield secondRecordingFinished;
ok(true, "Finished recording another snapshot of the animation loop.");
is(SnapshotsListView.itemCount, 2,
"There should be two items available in the snapshots list.");
let clearingFinished = once(window, EVENTS.SNAPSHOTS_LIST_CLEARED);
SnapshotsListView._onClearButtonClick();
yield clearingFinished;
ok(true, "Finished recording all snapshots.");
is(SnapshotsListView.itemCount, 0,
"There should be no items available in the snapshots list.");
yield teardown(panel);
finish();
}

34
browser/devtools/canvasdebugger/test/browser_canvas-frontend-img-screenshots.js
View File

@ -1,34 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if screenshots are properly displayed in the UI.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated, screenshotDisplayed]);
is($("#screenshot-container").hidden, false,
"The screenshot container should now be visible.");
is($("#screenshot-dimensions").getAttribute("value"), "128 x 128",
"The screenshot dimensions label has the expected value.");
is($("#screenshot-image").getAttribute("flipped"), "false",
"The screenshot element should not be flipped vertically.");
ok(window.getComputedStyle($("#screenshot-image")).backgroundImage.contains("#screenshot-rendering"),
"The screenshot element should have an offscreen canvas element as a background.");
yield teardown(panel);
finish();
}

65
browser/devtools/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-01.js
View File

@ -1,65 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if thumbnails are properly displayed in the UI.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, $all, EVENTS, SnapshotsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated, thumbnailsDisplayed]);
is($all(".filmstrip-thumbnail").length, 4,
"There should be 4 thumbnails displayed in the UI.");
let firstThumbnail = $(".filmstrip-thumbnail[index='0']");
ok(firstThumbnail,
"The first thumbnail element should be for the function call at index 0.");
is(firstThumbnail.width, 50,
"The first thumbnail's width is correct.");
is(firstThumbnail.height, 50,
"The first thumbnail's height is correct.");
is(firstThumbnail.getAttribute("flipped"), "false",
"The first thumbnail should not be flipped vertically.");
let secondThumbnail = $(".filmstrip-thumbnail[index='2']");
ok(secondThumbnail,
"The second thumbnail element should be for the function call at index 2.");
is(secondThumbnail.width, 50,
"The second thumbnail's width is correct.");
is(secondThumbnail.height, 50,
"The second thumbnail's height is correct.");
is(secondThumbnail.getAttribute("flipped"), "false",
"The second thumbnail should not be flipped vertically.");
let thirdThumbnail = $(".filmstrip-thumbnail[index='4']");
ok(thirdThumbnail,
"The third thumbnail element should be for the function call at index 4.");
is(thirdThumbnail.width, 50,
"The third thumbnail's width is correct.");
is(thirdThumbnail.height, 50,
"The third thumbnail's height is correct.");
is(thirdThumbnail.getAttribute("flipped"), "false",
"The third thumbnail should not be flipped vertically.");
let fourthThumbnail = $(".filmstrip-thumbnail[index='6']");
ok(fourthThumbnail,
"The fourth thumbnail element should be for the function call at index 6.");
is(fourthThumbnail.width, 50,
"The fourth thumbnail's width is correct.");
is(fourthThumbnail.height, 50,
"The fourth thumbnail's height is correct.");
is(fourthThumbnail.getAttribute("flipped"), "false",
"The fourth thumbnail should not be flipped vertically.");
yield teardown(panel);
finish();
}

67
browser/devtools/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-02.js
View File

@ -1,67 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if thumbnails are correctly linked with other UI elements like
* function call items and their respective screenshots.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([
recordingFinished,
callListPopulated,
thumbnailsDisplayed,
screenshotDisplayed
]);
is($all(".filmstrip-thumbnail[highlighted]").length, 0,
"There should be no highlighted thumbnail available yet.");
is(CallsListView.selectedIndex, -1,
"There should be no selected item in the calls list view.");
EventUtils.sendMouseEvent({ type: "mousedown" }, $all(".filmstrip-thumbnail")[0], window);
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
info("The first draw call was selected, by clicking the first thumbnail.");
isnot($(".filmstrip-thumbnail[highlighted][index='0']"), null,
"There should be a highlighted thumbnail available now, for the first draw call.");
is($all(".filmstrip-thumbnail[highlighted]").length, 1,
"There should be only one highlighted thumbnail available now.");
is(CallsListView.selectedIndex, 0,
"The first draw call should be selected in the calls list view.");
EventUtils.sendMouseEvent({ type: "mousedown" }, $all(".call-item-view")[1], window);
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
info("The second context call was selected, by clicking the second call item.");
isnot($(".filmstrip-thumbnail[highlighted][index='0']"), null,
"There should be a highlighted thumbnail available, for the first draw call.");
is($all(".filmstrip-thumbnail[highlighted]").length, 1,
"There should be only one highlighted thumbnail available.");
is(CallsListView.selectedIndex, 1,
"The second draw call should be selected in the calls list view.");
EventUtils.sendMouseEvent({ type: "mousedown" }, $all(".call-item-view")[2], window);
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
info("The second draw call was selected, by clicking the third call item.");
isnot($(".filmstrip-thumbnail[highlighted][index='2']"), null,
"There should be a highlighted thumbnail available, for the second draw call.");
is($all(".filmstrip-thumbnail[highlighted]").length, 1,
"There should be only one highlighted thumbnail available.");
is(CallsListView.selectedIndex, 2,
"The second draw call should be selected in the calls list view.");
yield teardown(panel);
finish();
}

41
browser/devtools/canvasdebugger/test/browser_canvas-frontend-open.js
View File

@ -1,41 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests that the frontend UI is properly configured when opening the tool.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { $ } = panel.panelWin;
is($("#snapshots-pane").hasAttribute("hidden"), false,
"The snapshots pane should initially be visible.");
is($("#debugging-pane").hasAttribute("hidden"), false,
"The debugging pane should initially be visible.");
is($("#record-snapshot").getAttribute("hidden"), "true",
"The 'record snapshot' button should initially be hidden.");
is($("#import-snapshot").hasAttribute("hidden"), false,
"The 'import snapshot' button should initially be visible.");
is($("#clear-snapshots").hasAttribute("hidden"), false,
"The 'clear snapshots' button should initially be visible.");
is($("#reload-notice").hasAttribute("hidden"), false,
"The reload notice should initially be visible.");
is($("#empty-notice").getAttribute("hidden"), "true",
"The empty notice should initially be hidden.");
is($("#import-notice").getAttribute("hidden"), "true",
"The import notice should initially be hidden.");
is($("#screenshot-container").getAttribute("hidden"), "true",
"The screenshot container should initially be hidden.");
is($("#snapshot-filmstrip").getAttribute("hidden"), "true",
"The snapshot filmstrip should initially be hidden.");
is($("#debugging-pane-contents").getAttribute("hidden"), "true",
"The rest of the UI should initially be hidden.");
yield teardown(panel);
finish();
}

62
browser/devtools/canvasdebugger/test/browser_canvas-frontend-record-01.js
View File

@ -1,62 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests whether the frontend behaves correctly while reording a snapshot.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
yield reload(target);
is($("#record-snapshot").hasAttribute("checked"), false,
"The 'record snapshot' button should initially be unchecked.");
is($("#record-snapshot").hasAttribute("disabled"), false,
"The 'record snapshot' button should initially be enabled.");
is($("#record-snapshot").hasAttribute("hidden"), false,
"The 'record snapshot' button should now be visible.");
is(SnapshotsListView.itemCount, 0,
"There should be no items available in the snapshots list view.");
is(SnapshotsListView.selectedIndex, -1,
"There should be no selected item in the snapshots list view.");
let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
yield recordingStarted;
ok(true, "Started recording a snapshot of the animation loop.");
is($("#record-snapshot").getAttribute("checked"), "true",
"The 'record snapshot' button should now be checked.");
is($("#record-snapshot").getAttribute("disabled"), "true",
"The 'record snapshot' button should now be disabled.");
is($("#record-snapshot").hasAttribute("hidden"), false,
"The 'record snapshot' button should still be visible.");
is(SnapshotsListView.itemCount, 1,
"There should be one item available in the snapshots list view now.");
is(SnapshotsListView.selectedIndex, -1,
"There should be no selected item in the snapshots list view yet.");
yield recordingFinished;
ok(true, "Finished recording a snapshot of the animation loop.");
is($("#record-snapshot").hasAttribute("checked"), false,
"The 'record snapshot' button should now be unchecked.");
is($("#record-snapshot").hasAttribute("disabled"), false,
"The 'record snapshot' button should now be re-enabled.");
is($("#record-snapshot").hasAttribute("hidden"), false,
"The 'record snapshot' button should still be visible.");
is(SnapshotsListView.itemCount, 1,
"There should still be only one item available in the snapshots list view.");
is(SnapshotsListView.selectedIndex, 0,
"There should be one selected item in the snapshots list view now.");
yield teardown(panel);
finish();
}

73
browser/devtools/canvasdebugger/test/browser_canvas-frontend-record-02.js
View File

@ -1,73 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests whether the frontend displays a placeholder snapshot while recording.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, EVENTS, L10N, $, SnapshotsListView } = panel.panelWin;
yield reload(target);
let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let recordingSelected = once(window, EVENTS.SNAPSHOT_RECORDING_SELECTED);
SnapshotsListView._onRecordButtonClick();
yield recordingStarted;
ok(true, "Started recording a snapshot of the animation loop.");
let item = SnapshotsListView.getItemAtIndex(0);
is($(".snapshot-item-title", item.target).getAttribute("value"),
L10N.getFormatStr("snapshotsList.itemLabel", 1),
"The placeholder item's title label is correct.");
is($(".snapshot-item-calls", item.target).getAttribute("value"),
L10N.getStr("snapshotsList.loadingLabel"),
"The placeholder item's calls label is correct.");
is($(".snapshot-item-save", item.target).getAttribute("value"), "",
"The placeholder item's save label should not have a value yet.");
is($("#reload-notice").getAttribute("hidden"), "true",
"The reload notice should now be hidden.");
is($("#empty-notice").getAttribute("hidden"), "true",
"The empty notice should now be hidden.");
is($("#import-notice").hasAttribute("hidden"), false,
"The import notice should now be visible.");
is($("#screenshot-container").getAttribute("hidden"), "true",
"The screenshot container should still be hidden.");
is($("#snapshot-filmstrip").getAttribute("hidden"), "true",
"The snapshot filmstrip should still be hidden.");
is($("#debugging-pane-contents").getAttribute("hidden"), "true",
"The rest of the UI should still be hidden.");
yield recordingFinished;
ok(true, "Finished recording a snapshot of the animation loop.");
yield recordingSelected;
ok(true, "Finished selecting a snapshot of the animation loop.");
is($("#reload-notice").getAttribute("hidden"), "true",
"The reload notice should now be hidden.");
is($("#empty-notice").getAttribute("hidden"), "true",
"The empty notice should now be hidden.");
is($("#import-notice").getAttribute("hidden"), "true",
"The import notice should now be hidden.");
is($("#screenshot-container").hasAttribute("hidden"), false,
"The screenshot container should now be visible.");
is($("#snapshot-filmstrip").hasAttribute("hidden"), false,
"The snapshot filmstrip should now be visible.");
is($("#debugging-pane-contents").hasAttribute("hidden"), false,
"The rest of the UI should now be visible.");
yield teardown(panel);
finish();
}

37
browser/devtools/canvasdebugger/test/browser_canvas-frontend-record-03.js
View File

@ -1,37 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests whether the frontend displays the correct info for a snapshot
* after finishing recording.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
yield recordingFinished;
ok(true, "Finished recording a snapshot of the animation loop.");
let item = SnapshotsListView.getItemAtIndex(0);
is(SnapshotsListView.selectedItem, item,
"The first item should now be selected in the snapshots list view (1).");
is(SnapshotsListView.selectedIndex, 0,
"The first item should now be selected in the snapshots list view (2).");
is($(".snapshot-item-calls", item.target).getAttribute("value"), "4 draws, 8 calls",
"The placeholder item's calls label is correct.");
is($(".snapshot-item-save", item.target).getAttribute("value"), "Save",
"The placeholder item's save label is correct.");
is($(".snapshot-item-save", item.target).getAttribute("disabled"), "false",
"The placeholder item's save label should be clickable.");
yield teardown(panel);
finish();
}

55
browser/devtools/canvasdebugger/test/browser_canvas-frontend-reload-01.js
View File

@ -1,55 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests that the frontend UI is properly reconfigured after reloading.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS } = panel.panelWin;
let reset = once(window, EVENTS.UI_RESET);
let navigated = reload(target);
yield reset;
ok(true, "The UI was reset after the refresh button was clicked.");
yield navigated;
ok(true, "The target finished reloading.");
is($("#snapshots-pane").hasAttribute("hidden"), false,
"The snapshots pane should still be visible.");
is($("#debugging-pane").hasAttribute("hidden"), false,
"The debugging pane should still be visible.");
is($("#record-snapshot").hasAttribute("checked"), false,
"The 'record snapshot' button should not be checked.");
is($("#record-snapshot").hasAttribute("disabled"), false,
"The 'record snapshot' button should not be disabled.");
is($("#record-snapshot").hasAttribute("hidden"), false,
"The 'record snapshot' button should now be visible.");
is($("#import-snapshot").hasAttribute("hidden"), false,
"The 'import snapshot' button should still be visible.");
is($("#clear-snapshots").hasAttribute("hidden"), false,
"The 'clear snapshots' button should still be visible.");
is($("#reload-notice").getAttribute("hidden"), "true",
"The reload notice should now be hidden.");
is($("#empty-notice").hasAttribute("hidden"), false,
"The empty notice should now be visible.");
is($("#import-notice").getAttribute("hidden"), "true",
"The import notice should now be hidden.");
is($("#snapshot-filmstrip").getAttribute("hidden"), "true",
"The snapshot filmstrip should still be hidden.");
is($("#screenshot-container").getAttribute("hidden"), "true",
"The screenshot container should still be hidden.");
is($("#debugging-pane-contents").getAttribute("hidden"), "true",
"The rest of the UI should still be hidden.");
yield teardown(panel);
finish();
}

70
browser/devtools/canvasdebugger/test/browser_canvas-frontend-reload-02.js
View File

@ -1,70 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests that the frontend UI is properly reconfigured after reloading.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
is(SnapshotsListView.itemCount, 0,
"There should be no snapshots initially displayed in the UI.");
is(CallsListView.itemCount, 0,
"There should be no function calls initially displayed in the UI.");
is($("#screenshot-container").hidden, true,
"The screenshot should not be initially displayed in the UI.");
is($("#snapshot-filmstrip").hidden, true,
"There should be no thumbnails initially displayed in the UI (1).");
is($all(".filmstrip-thumbnail").length, 0,
"There should be no thumbnails initially displayed in the UI (2).");
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([
recordingFinished,
callListPopulated,
thumbnailsDisplayed,
screenshotDisplayed
]);
is(SnapshotsListView.itemCount, 1,
"There should be one snapshot displayed in the UI.");
is(CallsListView.itemCount, 8,
"All the function calls should now be displayed in the UI.");
is($("#screenshot-container").hidden, false,
"The screenshot should now be displayed in the UI.");
is($("#snapshot-filmstrip").hidden, false,
"All the thumbnails should now be displayed in the UI (1).");
is($all(".filmstrip-thumbnail").length, 4,
"All the thumbnails should now be displayed in the UI (2).");
let reset = once(window, EVENTS.UI_RESET);
let navigated = reload(target);
yield reset;
ok(true, "The UI was reset after the refresh button was clicked.");
is(SnapshotsListView.itemCount, 0,
"There should be no snapshots displayed in the UI after navigating.");
is(CallsListView.itemCount, 0,
"There should be no function calls displayed in the UI after navigating.");
is($("#snapshot-filmstrip").hidden, true,
"There should be no thumbnails displayed in the UI after navigating.");
is($("#screenshot-container").hidden, true,
"The screenshot should not be displayed in the UI after navigating.");
yield navigated;
ok(true, "The target finished reloading.");
yield teardown(panel);
finish();
}

39
browser/devtools/canvasdebugger/test/browser_canvas-frontend-slider-01.js
View File

@ -1,39 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the slider in the calls list view works as advertised.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
is(CallsListView.selectedIndex, -1,
"No item in the function calls list should be initially selected.");
is($("#calls-slider").value, 0,
"The slider should be moved all the way to the start.");
is($("#calls-slider").min, 0,
"The slider minimum value should be 0.");
is($("#calls-slider").max, 7,
"The slider maximum value should be 7.");
CallsListView.selectedIndex = 1;
is($("#calls-slider").value, 1,
"The slider should be changed according to the current selection.");
$("#calls-slider").value = 2;
is(CallsListView.selectedIndex, 2,
"The calls selection should be changed according to the current slider value.");
yield teardown(panel);
finish();
}

97
browser/devtools/canvasdebugger/test/browser_canvas-frontend-slider-02.js
View File

@ -1,97 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the slider in the calls list view works as advertised.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, gFront, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated, thumbnailsDisplayed]);
let firstSnapshot = SnapshotsListView.getItemAtIndex(0);
let firstSnapshotOverview = yield firstSnapshot.attachment.actor.getOverview();
let thumbnails = firstSnapshotOverview.thumbnails;
is(thumbnails.length, 4,
"There should be 4 thumbnails cached for the snapshot item.");
let thumbnailImageElementSet = waitForMozSetImageElement(window);
$("#calls-slider").value = 1;
let thumbnailPixels = yield thumbnailImageElementSet;
ok(sameArray(thumbnailPixels, thumbnails[0].pixels),
"The screenshot element should have a thumbnail as an immediate background.");
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
ok(true, "The full-sized screenshot was displayed for the item at index 1.");
let thumbnailImageElementSet = waitForMozSetImageElement(window);
$("#calls-slider").value = 2;
let thumbnailPixels = yield thumbnailImageElementSet;
ok(sameArray(thumbnailPixels, thumbnails[1].pixels),
"The screenshot element should have a thumbnail as an immediate background.");
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
ok(true, "The full-sized screenshot was displayed for the item at index 2.");
let thumbnailImageElementSet = waitForMozSetImageElement(window);
$("#calls-slider").value = 7;
let thumbnailPixels = yield thumbnailImageElementSet;
ok(sameArray(thumbnailPixels, thumbnails[3].pixels),
"The screenshot element should have a thumbnail as an immediate background.");
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
ok(true, "The full-sized screenshot was displayed for the item at index 7.");
let thumbnailImageElementSet = waitForMozSetImageElement(window);
$("#calls-slider").value = 4;
let thumbnailPixels = yield thumbnailImageElementSet;
ok(sameArray(thumbnailPixels, thumbnails[2].pixels),
"The screenshot element should have a thumbnail as an immediate background.");
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
ok(true, "The full-sized screenshot was displayed for the item at index 4.");
let thumbnailImageElementSet = waitForMozSetImageElement(window);
$("#calls-slider").value = 0;
let thumbnailPixels = yield thumbnailImageElementSet;
ok(sameArray(thumbnailPixels, thumbnails[0].pixels),
"The screenshot element should have a thumbnail as an immediate background.");
yield once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
ok(true, "The full-sized screenshot was displayed for the item at index 0.");
yield teardown(panel);
finish();
}
function waitForMozSetImageElement(panel) {
let deferred = promise.defer();
panel._onMozSetImageElement = deferred.resolve;
return deferred.promise;
}
function sameArray(a, b) {
if (a.length != b.length) {
return false;
}
for (let i = 0; i < a.length; i++) {
if (a[i] !== b[i]) {
return false;
}
}
return true;
}

93
browser/devtools/canvasdebugger/test/browser_canvas-frontend-snapshot-select.js
View File

@ -1,93 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if selecting snapshots in the frontend displays the appropriate data
* respective to their recorded animation frame.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
yield recordAndWaitForFirstSnapshot();
info("First snapshot recorded.")
is(SnapshotsListView.selectedIndex, 0,
"A snapshot should be automatically selected after first recording.");
is(CallsListView.selectedIndex, -1,
"There should be no call item automatically selected in the snapshot.");
yield recordAndWaitForAnotherSnapshot();
info("Second snapshot recorded.")
is(SnapshotsListView.selectedIndex, 0,
"A snapshot should not be automatically selected after another recording.");
is(CallsListView.selectedIndex, -1,
"There should still be no call item automatically selected in the snapshot.");
let secondSnapshotTarget = SnapshotsListView.getItemAtIndex(1).target;
let snapshotSelected = waitForSnapshotSelection();
EventUtils.sendMouseEvent({ type: "mousedown" }, secondSnapshotTarget, window);
yield snapshotSelected;
info("Second snapshot selected.");
is(SnapshotsListView.selectedIndex, 1,
"The second snapshot should now be selected.");
is(CallsListView.selectedIndex, -1,
"There should still be no call item automatically selected in the snapshot.");
let firstDrawCallContents = $(".call-item-contents", CallsListView.getItemAtIndex(2).target);
let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
EventUtils.sendMouseEvent({ type: "mousedown" }, firstDrawCallContents, window);
yield screenshotDisplayed;
info("First draw call in the second snapshot selected.");
is(SnapshotsListView.selectedIndex, 1,
"The second snapshot should still be selected.");
is(CallsListView.selectedIndex, 2,
"The first draw call should now be selected in the snapshot.");
let firstSnapshotTarget = SnapshotsListView.getItemAtIndex(0).target;
let snapshotSelected = waitForSnapshotSelection();
EventUtils.sendMouseEvent({ type: "mousedown" }, firstSnapshotTarget, window);
yield snapshotSelected;
info("First snapshot re-selected.");
is(SnapshotsListView.selectedIndex, 0,
"The first snapshot should now be re-selected.");
is(CallsListView.selectedIndex, -1,
"There should still be no call item automatically selected in the snapshot.");
function recordAndWaitForFirstSnapshot() {
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let snapshotSelected = waitForSnapshotSelection();
SnapshotsListView._onRecordButtonClick();
return promise.all([recordingFinished, snapshotSelected]);
}
function recordAndWaitForAnotherSnapshot() {
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
return recordingFinished;
}
function waitForSnapshotSelection() {
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
return promise.all([
callListPopulated,
thumbnailsDisplayed,
screenshotDisplayed
]);
}
yield teardown(panel);
finish();
}

76
browser/devtools/canvasdebugger/test/browser_canvas-frontend-stepping.js
View File

@ -1,76 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/**
* Tests if the stepping buttons in the call list toolbar work as advertised.
*/
function ifTestingSupported() {
let [target, debuggee, panel] = yield initCanavsDebuggerFrontend(SIMPLE_CANVAS_URL);
let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
yield reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
SnapshotsListView._onRecordButtonClick();
yield promise.all([recordingFinished, callListPopulated]);
checkSteppingButtons(1, 1, 1, 1);
is(CallsListView.selectedIndex, -1,
"There should be no selected item in the calls list view initially.");
CallsListView._onResume();
checkSteppingButtons(1, 1, 1, 1);
is(CallsListView.selectedIndex, 0,
"The first draw call should now be selected.");
CallsListView._onResume();
checkSteppingButtons(1, 1, 1, 1);
is(CallsListView.selectedIndex, 2,
"The second draw call should now be selected.");
CallsListView._onStepOver();
checkSteppingButtons(1, 1, 1, 1);
is(CallsListView.selectedIndex, 3,
"The next context call should now be selected.");
CallsListView._onStepOut();
checkSteppingButtons(0, 0, 1, 0);
is(CallsListView.selectedIndex, 7,
"The last context call should now be selected.");
function checkSteppingButtons(resume, stepOver, stepIn, stepOut) {
if (!resume) {
is($("#resume").getAttribute("disabled"), "true",
"The resume button doesn't have the expected disabled state.");
} else {
is($("#resume").hasAttribute("disabled"), false,
"The resume button doesn't have the expected enabled state.");
}
if (!stepOver) {
is($("#step-over").getAttribute("disabled"), "true",
"The stepOver button doesn't have the expected disabled state.");
} else {
is($("#step-over").hasAttribute("disabled"), false,
"The stepOver button doesn't have the expected enabled state.");
}
if (!stepIn) {
is($("#step-in").getAttribute("disabled"), "true",
"The stepIn button doesn't have the expected disabled state.");
} else {
is($("#step-in").hasAttribute("disabled"), false,
"The stepIn button doesn't have the expected enabled state.");
}
if (!stepOut) {
is($("#step-out").getAttribute("disabled"), "true",
"The stepOut button doesn't have the expected disabled state.");
} else {
is($("#step-out").hasAttribute("disabled"), false,
"The stepOut button doesn't have the expected enabled state.");
}
}
yield teardown(panel);
finish();
}

46
browser/devtools/canvasdebugger/test/doc_simple-canvas-deep-stack.html
View File

@ -1,46 +0,0 @@
<!-- Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ -->
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Canvas inspector test page</title>
</head>
<body>
<canvas width="128" height="128"></canvas>
<script type="text/javascript;version=1.8">
"use strict";
var ctx = document.querySelector("canvas").getContext("2d");
function drawRect(fill, size) {
function A() {
function B() {
function C() {
ctx.fillStyle = fill;
ctx.fillRect(size[0], size[1], size[2], size[3]);
}
C();
}
B();
}
A();
}
function drawScene() {
ctx.clearRect(0, 0, 128, 128);
drawRect("rgb(192, 192, 192)", [0, 0, 128, 128]);
drawRect("rgba(0, 0, 192, 0.5)", [30, 30, 55, 50]);
drawRect("rgba(192, 0, 0, 0.5)", [10, 10, 55, 50]);
window.requestAnimationFrame(drawScene);
}
drawScene();
</script>
</body>
</html>

37
browser/devtools/canvasdebugger/test/doc_simple-canvas-transparent.html
View File

@ -1,37 +0,0 @@
<!-- Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ -->
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Canvas inspector test page</title>
</head>
<body>
<canvas width="128" height="128"></canvas>
<script type="text/javascript;version=1.8">
"use strict";
var ctx = document.querySelector("canvas").getContext("2d");
function drawRect(fill, size) {
ctx.fillStyle = fill;
ctx.fillRect(size[0], size[1], size[2], size[3]);
}
function drawScene() {
ctx.clearRect(0, 0, 128, 128);
drawRect("rgba(255, 255, 255, 0)", [0, 0, 128, 128]);
drawRect("rgba(0, 0, 192, 0.5)", [30, 30, 55, 50]);
drawRect("rgba(192, 0, 0, 0.5)", [10, 10, 55, 50]);
window.requestAnimationFrame(drawScene);
}
drawScene();
</script>
</body>
</html>

37
browser/devtools/canvasdebugger/test/doc_simple-canvas.html
View File

@ -1,37 +0,0 @@
<!-- Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ -->
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<title>Canvas inspector test page</title>
</head>
<body>
<canvas width="128" height="128"></canvas>
<script type="text/javascript;version=1.8">
"use strict";
var ctx = document.querySelector("canvas").getContext("2d");
function drawRect(fill, size) {
ctx.fillStyle = fill;
ctx.fillRect(size[0], size[1], size[2], size[3]);
}
function drawScene() {
ctx.clearRect(0, 0, 128, 128);
drawRect("rgb(192, 192, 192)", [0, 0, 128, 128]);
drawRect("rgba(0, 0, 192, 0.5)", [30, 30, 55, 50]);
drawRect("rgba(192, 0, 0, 0.5)", [10, 10, 55, 50]);
window.requestAnimationFrame(drawScene);
}
drawScene();
</script>
</body>
</html>

234
browser/devtools/canvasdebugger/test/head.js
View File

@ -1,234 +0,0 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
const { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
let { Services } = Cu.import("resource://gre/modules/Services.jsm", {});
// Disable logging for all the tests. Both the debugger server and frontend will
// be affected by this pref.
let gEnableLogging = Services.prefs.getBoolPref("devtools.debugger.log");
Services.prefs.setBoolPref("devtools.debugger.log", false);
let { Task } = Cu.import("resource://gre/modules/Task.jsm", {});
let { Promise: promise } = Cu.import("resource://gre/modules/Promise.jsm", {});
let { gDevTools } = Cu.import("resource:///modules/devtools/gDevTools.jsm", {});
let { devtools } = Cu.import("resource://gre/modules/devtools/Loader.jsm", {});
let { DebuggerServer } = Cu.import("resource://gre/modules/devtools/dbg-server.jsm", {});
let { DebuggerClient } = Cu.import("resource://gre/modules/devtools/dbg-client.jsm", {});
let { CallWatcherFront } = devtools.require("devtools/server/actors/call-watcher");
let { CanvasFront } = devtools.require("devtools/server/actors/canvas");
let TiltGL = devtools.require("devtools/tilt/tilt-gl");
let TargetFactory = devtools.TargetFactory;
let Toolbox = devtools.Toolbox;
const EXAMPLE_URL = "http://example.com/browser/browser/devtools/canvasdebugger/test/";
const SIMPLE_CANVAS_URL = EXAMPLE_URL + "doc_simple-canvas.html";
const SIMPLE_CANVAS_TRANSPARENT_URL = EXAMPLE_URL + "doc_simple-canvas-transparent.html";
const SIMPLE_CANVAS_DEEP_STACK_URL = EXAMPLE_URL + "doc_simple-canvas-deep-stack.html";
// All tests are asynchronous.
waitForExplicitFinish();
let gToolEnabled = Services.prefs.getBoolPref("devtools.canvasdebugger.enabled");
registerCleanupFunction(() => {
info("finish() was called, cleaning up...");
Services.prefs.setBoolPref("devtools.debugger.log", gEnableLogging);
Services.prefs.setBoolPref("devtools.canvasdebugger.enabled", gToolEnabled);
// Some of yhese tests use a lot of memory due to GL contexts, so force a GC
// to help fragmentation.
info("Forcing GC after canvas debugger test.");
Cu.forceGC();
});
function addTab(aUrl, aWindow) {
info("Adding tab: " + aUrl);
let deferred = promise.defer();
let targetWindow = aWindow || window;
let targetBrowser = targetWindow.gBrowser;
targetWindow.focus();
let tab = targetBrowser.selectedTab = targetBrowser.addTab(aUrl);
let linkedBrowser = tab.linkedBrowser;
linkedBrowser.addEventListener("load", function onLoad() {
linkedBrowser.removeEventListener("load", onLoad, true);
info("Tab added and finished loading: " + aUrl);
deferred.resolve(tab);
}, true);
return deferred.promise;
}
function removeTab(aTab, aWindow) {
info("Removing tab.");
let deferred = promise.defer();
let targetWindow = aWindow || window;
let targetBrowser = targetWindow.gBrowser;
let tabContainer = targetBrowser.tabContainer;
tabContainer.addEventListener("TabClose", function onClose(aEvent) {
tabContainer.removeEventListener("TabClose", onClose, false);
info("Tab removed and finished closing.");
deferred.resolve();
}, false);
targetBrowser.removeTab(aTab);
return deferred.promise;
}
function handleError(aError) {
ok(false, "Got an error: " + aError.message + "\n" + aError.stack);
finish();
}
let gRequiresWebGL = false;
function ifTestingSupported() {
ok(false, "You need to define a 'ifTestingSupported' function.");
finish();
}
function ifTestingUnsupported() {
todo(false, "Skipping test because some required functionality isn't supported.");
finish();
}
function test() {
let generator = isTestingSupported() ? ifTestingSupported : ifTestingUnsupported;
Task.spawn(generator).then(null, handleError);
}
function createCanvas() {
return document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
}
function isTestingSupported() {
if (!gRequiresWebGL) {
info("This test does not require WebGL support.");
return true;
}
let supported =
!TiltGL.isWebGLForceEnabled() &&
TiltGL.isWebGLSupported() &&
TiltGL.create3DContext(createCanvas());
info("This test requires WebGL support.");
info("Apparently, WebGL is" + (supported ? "" : " not") + " supported.");
return supported;
}
function once(aTarget, aEventName, aUseCapture = false) {
info("Waiting for event: '" + aEventName + "' on " + aTarget + ".");
let deferred = promise.defer();
for (let [add, remove] of [
["on", "off"], // Use event emitter before DOM events for consistency
["addEventListener", "removeEventListener"],
["addListener", "removeListener"]
]) {
if ((add in aTarget) && (remove in aTarget)) {
aTarget[add](aEventName, function onEvent(...aArgs) {
aTarget[remove](aEventName, onEvent, aUseCapture);
deferred.resolve(...aArgs);
}, aUseCapture);
break;
}
}
return deferred.promise;
}
function waitForTick() {
let deferred = promise.defer();
executeSoon(deferred.resolve);
return deferred.promise;
}
function navigateInHistory(aTarget, aDirection, aWaitForTargetEvent = "navigate") {
executeSoon(() => content.history[aDirection]());
return once(aTarget, aWaitForTargetEvent);
}
function navigate(aTarget, aUrl, aWaitForTargetEvent = "navigate") {
executeSoon(() => aTarget.activeTab.navigateTo(aUrl));
return once(aTarget, aWaitForTargetEvent);
}
function reload(aTarget, aWaitForTargetEvent = "navigate") {
executeSoon(() => aTarget.activeTab.reload());
return once(aTarget, aWaitForTargetEvent);
}
function initServer() {
if (!DebuggerServer.initialized) {
DebuggerServer.init(() => true);
DebuggerServer.addBrowserActors();
}
}
function initCallWatcherBackend(aUrl) {
info("Initializing a call watcher front.");
initServer();
return Task.spawn(function*() {
let tab = yield addTab(aUrl);
let target = TargetFactory.forTab(tab);
let debuggee = target.window.wrappedJSObject;
yield target.makeRemote();
let front = new CallWatcherFront(target.client, target.form);
return [target, debuggee, front];
});
}
function initCanavsDebuggerBackend(aUrl) {
info("Initializing a canvas debugger front.");
initServer();
return Task.spawn(function*() {
let tab = yield addTab(aUrl);
let target = TargetFactory.forTab(tab);
let debuggee = target.window.wrappedJSObject;
yield target.makeRemote();
let front = new CanvasFront(target.client, target.form);
return [target, debuggee, front];
});
}
function initCanavsDebuggerFrontend(aUrl) {
info("Initializing a canvas debugger pane.");
return Task.spawn(function*() {
let tab = yield addTab(aUrl);
let target = TargetFactory.forTab(tab);
let debuggee = target.window.wrappedJSObject;
yield target.makeRemote();
Services.prefs.setBoolPref("devtools.canvasdebugger.enabled", true);
let toolbox = yield gDevTools.showToolbox(target, "canvasdebugger");
let panel = toolbox.getCurrentPanel();
return [target, debuggee, panel];
});
}
function teardown(aPanel) {
info("Destroying the specified canvas debugger.");
return promise.all([
once(aPanel, "destroyed"),
removeTab(aPanel.target.tab)
]);
}

6
browser/devtools/canvasdebugger/test/moz.build
View File

@ -1,6 +0,0 @@
# vim: set filetype=python:
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
BROWSER_CHROME_MANIFESTS += ['browser.ini']

6
browser/devtools/debugger/debugger-view.js
View File

@ -390,7 +390,8 @@ let DebuggerView = {
this._setEditorText(L10N.getStr("loadingText"));
this._editorSource = { url: aSource.url, promise: deferred.promise };
DebuggerController.SourceScripts.getText(aSource).then(([, aText, aContentType]) => {
DebuggerController.SourceScripts.getText(aSource)
.then(([, aText, aContentType]) => {
// Avoid setting an unexpected source. This may happen when switching
// very fast between sources that haven't been fetched yet.
if (this._editorSource.url != aSource.url) {
@ -468,7 +469,8 @@ let DebuggerView = {
// Make sure the requested source client is shown in the editor, then
// update the source editor's caret position and debug location.
return this._setEditorSource(sourceForm, aFlags).then(([,, aContentType]) => {
return this._setEditorSource(sourceForm, aFlags)
.then(([,, aContentType]) => {
// Record the contentType learned from fetching
sourceForm.contentType = aContentType;
// Line numbers in the source editor should start from 1. If invalid

2
browser/devtools/debugger/debugger.xul
View File

@ -434,7 +434,7 @@
<tabpanels flex="1">
<tabpanel id="variables-tabpanel">
<vbox id="expressions"/>
<splitter class="devtools-horizontal-splitter devtools-invisible-splitter"/>
<splitter class="devtools-horizontal-splitter devtools-invisible splitter"/>
<vbox id="variables" flex="1"/>
</tabpanel>
<tabpanel id="events-tabpanel">

3
browser/devtools/debugger/panel.js
View File

@ -8,6 +8,7 @@
const { Cc, Ci, Cu, Cr } = require("chrome");
const promise = require("sdk/core/promise");
const EventEmitter = require("devtools/toolkit/event-emitter");
const { DevToolsUtils } = Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm", {});
function DebuggerPanel(iframeWindow, toolbox) {
@ -59,7 +60,7 @@ DebuggerPanel.prototype = {
return this;
})
.then(null, function onError(aReason) {
DevToolsUtils.reportException("DebuggerPanel.prototype.open", aReason);
DevToolsUtils.reportException("DebuggerPane.prototype.open", aReason);
});
},

3
browser/devtools/debugger/test/head.js
View File

@ -245,7 +245,8 @@ function waitForSourceShown(aPanel, aUrl) {
}
function waitForEditorLocationSet(aPanel) {
return waitForDebuggerEvents(aPanel, aPanel.panelWin.EVENTS.EDITOR_LOCATION_SET);
return waitForDebuggerEvents(aPanel,
aPanel.panelWin.EVENTS.EDITOR_LOCATION_SET);
}
function ensureSourceIs(aPanel, aUrl, aWaitFlag = false) {

2
browser/devtools/jar.mn
View File

@ -60,8 +60,6 @@ browser.jar:
content/browser/devtools/debugger-panes.js (debugger/debugger-panes.js)
content/browser/devtools/shadereditor.xul (shadereditor/shadereditor.xul)
content/browser/devtools/shadereditor.js (shadereditor/shadereditor.js)
content/browser/devtools/canvasdebugger.xul (canvasdebugger/canvasdebugger.xul)
content/browser/devtools/canvasdebugger.js (canvasdebugger/canvasdebugger.js)
content/browser/devtools/profiler.xul (profiler/profiler.xul)
content/browser/devtools/cleopatra.html (profiler/cleopatra/cleopatra.html)
content/browser/devtools/profiler/cleopatra/css/ui.css (profiler/cleopatra/css/ui.css)

30
browser/devtools/main.js
View File

@ -28,7 +28,6 @@ loader.lazyGetter(this, "WebConsolePanel", () => require("devtools/webconsole/pa
loader.lazyGetter(this, "DebuggerPanel", () => require("devtools/debugger/panel").DebuggerPanel);
loader.lazyGetter(this, "StyleEditorPanel", () => require("devtools/styleeditor/styleeditor-panel").StyleEditorPanel);
loader.lazyGetter(this, "ShaderEditorPanel", () => require("devtools/shadereditor/panel").ShaderEditorPanel);
loader.lazyGetter(this, "CanvasDebuggerPanel", () => require("devtools/canvasdebugger/panel").CanvasDebuggerPanel);
loader.lazyGetter(this, "ProfilerPanel", () => require("devtools/profiler/panel"));
loader.lazyGetter(this, "NetMonitorPanel", () => require("devtools/netmonitor/panel").NetMonitorPanel);
loader.lazyGetter(this, "ScratchpadPanel", () => require("devtools/scratchpad/scratchpad-panel").ScratchpadPanel);
@ -39,7 +38,6 @@ const inspectorProps = "chrome://browser/locale/devtools/inspector.properties";
const debuggerProps = "chrome://browser/locale/devtools/debugger.properties";
const styleEditorProps = "chrome://browser/locale/devtools/styleeditor.properties";
const shaderEditorProps = "chrome://browser/locale/devtools/shadereditor.properties";
const canvasDebuggerProps = "chrome://browser/locale/devtools/canvasdebugger.properties";
const webConsoleProps = "chrome://browser/locale/devtools/webconsole.properties";
const profilerProps = "chrome://browser/locale/devtools/profiler.properties";
const netMonitorProps = "chrome://browser/locale/devtools/netmonitor.properties";
@ -49,7 +47,6 @@ loader.lazyGetter(this, "webConsoleStrings", () => Services.strings.createBundle
loader.lazyGetter(this, "debuggerStrings", () => Services.strings.createBundle(debuggerProps));
loader.lazyGetter(this, "styleEditorStrings", () => Services.strings.createBundle(styleEditorProps));
loader.lazyGetter(this, "shaderEditorStrings", () => Services.strings.createBundle(shaderEditorProps));
loader.lazyGetter(this, "canvasDebuggerStrings", () => Services.strings.createBundle(canvasDebuggerProps));
loader.lazyGetter(this, "inspectorStrings", () => Services.strings.createBundle(inspectorProps));
loader.lazyGetter(this, "profilerStrings",() => Services.strings.createBundle(profilerProps));
loader.lazyGetter(this, "netMonitorStrings", () => Services.strings.createBundle(netMonitorProps));
@ -203,31 +200,11 @@ Tools.shaderEditor = {
}
};
Tools.canvasDebugger = {
id: "canvasdebugger",
ordinal: 6,
visibilityswitch: "devtools.canvasdebugger.enabled",
icon: "chrome://browser/skin/devtools/tool-styleeditor.svg",
invertIconForLightTheme: true,
url: "chrome://browser/content/devtools/canvasdebugger.xul",
label: l10n("ToolboxCanvasDebugger.label", canvasDebuggerStrings),
tooltip: l10n("ToolboxCanvasDebugger.tooltip", canvasDebuggerStrings),
isTargetSupported: function(target) {
return true;
},
build: function(iframeWindow, toolbox) {
let panel = new CanvasDebuggerPanel(iframeWindow, toolbox);
return panel.open();
}
};
Tools.jsprofiler = {
id: "jsprofiler",
accesskey: l10n("profiler.accesskey", profilerStrings),
key: l10n("profiler2.commandkey", profilerStrings),
ordinal: 7,
ordinal: 6,
modifiers: "shift",
visibilityswitch: "devtools.profiler.enabled",
icon: "chrome://browser/skin/devtools/tool-profiler.svg",
@ -251,7 +228,7 @@ Tools.netMonitor = {
id: "netmonitor",
accesskey: l10n("netmonitor.accesskey", netMonitorStrings),
key: l10n("netmonitor.commandkey", netMonitorStrings),
ordinal: 8,
ordinal: 7,
modifiers: osString == "Darwin" ? "accel,alt" : "accel,shift",
visibilityswitch: "devtools.netmonitor.enabled",
icon: "chrome://browser/skin/devtools/tool-network.svg",
@ -274,7 +251,7 @@ Tools.netMonitor = {
Tools.scratchpad = {
id: "scratchpad",
ordinal: 9,
ordinal: 8,
visibilityswitch: "devtools.scratchpad.enabled",
icon: "chrome://browser/skin/devtools/tool-scratchpad.svg",
invertIconForLightTheme: true,
@ -300,7 +277,6 @@ let defaultTools = [
Tools.jsdebugger,
Tools.styleEditor,
Tools.shaderEditor,
Tools.canvasDebugger,
Tools.jsprofiler,
Tools.netMonitor,
Tools.scratchpad

1
browser/devtools/moz.build
View File

@ -6,7 +6,6 @@
DIRS += [
'app-manager',
'canvasdebugger',
'commandline',
'debugger',
'fontinspector',

15
browser/devtools/netmonitor/netmonitor-controller.js
View File

@ -117,9 +117,6 @@ const {Tooltip} = require("devtools/shared/widgets/Tooltip");
XPCOMUtils.defineLazyModuleGetter(this, "Chart",
"resource:///modules/devtools/Chart.jsm");
XPCOMUtils.defineLazyModuleGetter(this, "Curl",
"resource:///modules/devtools/Curl.jsm");
XPCOMUtils.defineLazyModuleGetter(this, "Task",
"resource://gre/modules/Task.jsm");
@ -129,17 +126,23 @@ XPCOMUtils.defineLazyModuleGetter(this, "PluralForm",
XPCOMUtils.defineLazyModuleGetter(this, "DevToolsUtils",
"resource://gre/modules/devtools/DevToolsUtils.jsm");
XPCOMUtils.defineLazyServiceGetter(this, "clipboardHelper",
"@mozilla.org/widget/clipboardhelper;1", "nsIClipboardHelper");
XPCOMUtils.defineLazyModuleGetter(this, "devtools",
"resource://gre/modules/devtools/Loader.jsm");
Object.defineProperty(this, "NetworkHelper", {
get: function() {
return require("devtools/toolkit/webconsole/network-helper");
return devtools.require("devtools/toolkit/webconsole/network-helper");
},
configurable: true,
enumerable: true
});
XPCOMUtils.defineLazyServiceGetter(this, "clipboardHelper",
"@mozilla.org/widget/clipboardhelper;1", "nsIClipboardHelper");
XPCOMUtils.defineLazyModuleGetter(this, "Curl",
"resource:///modules/devtools/Curl.jsm");
/**
* Object defining the network monitor controller components.
*/

4
browser/devtools/netmonitor/panel.js
View File

@ -8,7 +8,6 @@
const { Cc, Ci, Cu, Cr } = require("chrome");
const { Promise: promise } = Cu.import("resource://gre/modules/Promise.jsm", {});
const EventEmitter = require("devtools/toolkit/event-emitter");
const { DevToolsUtils } = Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm", {});
function NetMonitorPanel(iframeWindow, toolbox) {
this.panelWin = iframeWindow;
@ -50,7 +49,8 @@ NetMonitorPanel.prototype = {
return this;
})
.then(null, function onError(aReason) {
DevToolsUtils.reportException("NetMonitorPanel.prototype.open", aReason);
Cu.reportError("NetMonitorPanel open failed. " +
aReason.error + ": " + aReason.message);
});
},

1
browser/devtools/shadereditor/moz.build
View File

@ -10,3 +10,4 @@ JS_MODULES_PATH = 'modules/devtools/shadereditor'
EXTRA_JS_MODULES += [
'panel.js'
]

10
browser/devtools/shadereditor/panel.js
View File

@ -9,7 +9,6 @@ const { Cc, Ci, Cu, Cr } = require("chrome");
const promise = Cu.import("resource://gre/modules/Promise.jsm", {}).Promise;
const EventEmitter = require("devtools/toolkit/event-emitter");
const { WebGLFront } = require("devtools/server/actors/webgl");
const { DevToolsUtils } = Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm", {});
function ShaderEditorPanel(iframeWindow, toolbox) {
this.panelWin = iframeWindow;
@ -22,12 +21,6 @@ function ShaderEditorPanel(iframeWindow, toolbox) {
exports.ShaderEditorPanel = ShaderEditorPanel;
ShaderEditorPanel.prototype = {
/**
* Open is effectively an asynchronous constructor.
*
* @return object
* A promise that is resolved when the Shader Editor completes opening.
*/
open: function() {
let targetPromise;
@ -51,7 +44,8 @@ ShaderEditorPanel.prototype = {
return this;
})
.then(null, function onError(aReason) {
DevToolsUtils.reportException("ShaderEditorPanel.prototype.open", aReason);
Cu.reportError("ShaderEditorPanel open failed. " +
aReason.error + ": " + aReason.message);
});
},

1
browser/devtools/shadereditor/shadereditor.js
View File

@ -8,6 +8,7 @@ const { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
Cu.import("resource://gre/modules/Services.jsm");
Cu.import("resource://gre/modules/XPCOMUtils.jsm");
Cu.import("resource://gre/modules/Task.jsm");
Cu.import("resource://gre/modules/devtools/Loader.jsm");
Cu.import("resource:///modules/devtools/SideMenuWidget.jsm");
Cu.import("resource:///modules/devtools/ViewHelpers.jsm");

42
browser/devtools/shared/widgets/ViewHelpers.jsm
View File

@ -20,8 +20,7 @@ Cu.import("resource://gre/modules/devtools/DevToolsUtils.jsm");
this.EXPORTED_SYMBOLS = [
"Heritage", "ViewHelpers", "WidgetMethods",
"setNamedTimeout", "clearNamedTimeout",
"setConditionalTimeout", "clearConditionalTimeout",
"setNamedTimeout", "clearNamedTimeout"
];
/**
@ -58,7 +57,7 @@ this.Heritage = {
* @param function aCallback
* Invoked when no more events are fired after the specified time.
*/
this.setNamedTimeout = function setNamedTimeout(aId, aWait, aCallback) {
this.setNamedTimeout = function(aId, aWait, aCallback) {
clearNamedTimeout(aId);
namedTimeoutsStore.set(aId, setTimeout(() =>
@ -72,7 +71,7 @@ this.setNamedTimeout = function setNamedTimeout(aId, aWait, aCallback) {
* @param string aId
* A string identifier for the named timeout.
*/
this.clearNamedTimeout = function clearNamedTimeout(aId) {
this.clearNamedTimeout = function(aId) {
if (!namedTimeoutsStore) {
return;
}
@ -80,41 +79,6 @@ this.clearNamedTimeout = function clearNamedTimeout(aId) {
namedTimeoutsStore.delete(aId);
};
/**
* Same as `setNamedTimeout`, but invokes the callback only if the provided
* predicate function returns true. Otherwise, the timeout is re-triggered.
*
* @param string aId
* A string identifier for the conditional timeout.
* @param number aWait
* The amount of milliseconds to wait after no more events are fired.
* @param function aPredicate
* The predicate function used to determine whether the timeout restarts.
* @param function aCallback
* Invoked when no more events are fired after the specified time, and
* the provided predicate function returns true.
*/
this.setConditionalTimeout = function setConditionalTimeout(aId, aWait, aPredicate, aCallback) {
setNamedTimeout(aId, aWait, function maybeCallback() {
if (aPredicate()) {
aCallback();
return;
}
setConditionalTimeout(aId, aWait, aPredicate, aCallback);
});
};
/**
* Clears a conditional timeout.
* @see setConditionalTimeout
*
* @param string aId
* A string identifier for the conditional timeout.
*/
this.clearConditionalTimeout = function clearConditionalTimeout(aId) {
clearNamedTimeout(aId);
};
XPCOMUtils.defineLazyGetter(this, "namedTimeoutsStore", () => new Map());
/**

45
browser/locales/en-US/chrome/browser/devtools/canvasdebugger.dtd
View File

@ -1,45 +0,0 @@
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<!-- LOCALIZATION NOTE : FILE This file contains the Debugger strings -->
<!-- LOCALIZATION NOTE : FILE Do not translate commandkey -->
<!-- LOCALIZATION NOTE : FILE The correct localization of this file might be to
- keep it in English, or another language commonly spoken among web developers.
- You want to make that choice consistent across the developer tools.
- A good criteria is the language in which you'd find the best
- documentation on web development on the web. -->
<!-- LOCALIZATION NOTE (canvasDebuggerUI.reloadNotice1): This is the label shown
- on the button that triggers a page refresh. -->
<!ENTITY canvasDebuggerUI.reloadNotice1 "Reload">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.reloadNotice2): This is the label shown
- along with the button that triggers a page refresh. -->
<!ENTITY canvasDebuggerUI.reloadNotice2 "the page to be able to debug &lt;canvas&gt; contexts.">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.emptyNotice1/2): This is the label shown
- in the call list view when empty. -->
<!ENTITY canvasDebuggerUI.emptyNotice1 "Click on the">
<!ENTITY canvasDebuggerUI.emptyNotice2 "button to record an animation frame's call stack.">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.reloadNotice1): This is the label shown
- in the call list view while loading a snapshot. -->
<!ENTITY canvasDebuggerUI.importNotice "Loading…">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.recordSnapshot): This string is displayed
- on a button that starts a new snapshot. -->
<!ENTITY canvasDebuggerUI.recordSnapshot.tooltip "Record the next frame in the animation loop.">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.importSnapshot): This string is displayed
- on a button that opens a dialog to import a saved snapshot data file. -->
<!ENTITY canvasDebuggerUI.importSnapshot "Import…">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.clearSnapshots): This string is displayed
- on a button that remvoes all the snapshots. -->
<!ENTITY canvasDebuggerUI.clearSnapshots "Clear">
<!-- LOCALIZATION NOTE (canvasDebuggerUI.searchboxPlaceholder): This string is displayed
- as a placeholder of the search box that filters the calls list. -->
<!ENTITY canvasDebuggerUI.searchboxPlaceholder "Filter calls">

74
browser/locales/en-US/chrome/browser/devtools/canvasdebugger.properties
View File

@ -1,74 +0,0 @@
# This Source Code Form is subject to the terms of the Mozilla Public
# License, v. 2.0. If a copy of the MPL was not distributed with this
# file, You can obtain one at http://mozilla.org/MPL/2.0/.
# LOCALIZATION NOTE These strings are used inside the Canvas Debugger
# which is available from the Web Developer sub-menu -> 'Canvas'.
# The correct localization of this file might be to keep it in
# English, or another language commonly spoken among web developers.
# You want to make that choice consistent across the developer tools.
# A good criteria is the language in which you'd find the best
# documentation on web development on the web.
# LOCALIZATION NOTE (ToolboxCanvasDebugger.label):
# This string is displayed in the title of the tab when the Shader Editor is
# displayed inside the developer tools window and in the Developer Tools Menu.
ToolboxCanvasDebugger.label=Canvas
# LOCALIZATION NOTE (ToolboxCanvasDebugger.tooltip):
# This string is displayed in the tooltip of the tab when the Shader Editor is
# displayed inside the developer tools window.
ToolboxCanvasDebugger.tooltip=Tools to inspect and debug <canvas> contexts
# LOCALIZATION NOTE (noSnapshotsText): The text to display in the snapshots menu
# when there are no recorded snapshots yet.
noSnapshotsText=There are no snapshots yet.
# LOCALIZATION NOTE (snapshotsList.itemLabel):
# This string is displayed in the snapshots list of the Canvas Debugger,
# identifying a set of function calls of a recorded animation frame.
snapshotsList.itemLabel=Snapshot #%S
# LOCALIZATION NOTE (snapshotsList.loadingLabel):
# This string is displayed in the snapshots list of the Canvas Debugger,
# for an item that has not finished loading.
snapshotsList.loadingLabel=Loading…
# LOCALIZATION NOTE (snapshotsList.saveLabel):
# This string is displayed in the snapshots list of the Canvas Debugger,
# for saving an item to disk.
snapshotsList.saveLabel=Save
# LOCALIZATION NOTE (snapshotsList.savingLabel):
# This string is displayed in the snapshots list of the Canvas Debugger,
# while saving an item to disk.
snapshotsList.savingLabel=Saving…
# LOCALIZATION NOTE (snapshotsList.loadedLabel):
# This string is displayed in the snapshots list of the Canvas Debugger,
# for an item which was loaded from disk
snapshotsList.loadedLabel=Loaded from disk
# LOCALIZATION NOTE (snapshotsList.saveDialogTitle):
# This string is displayed as a title for saving a snapshot to disk.
snapshotsList.saveDialogTitle=Save animation frame snapshot…
# LOCALIZATION NOTE (snapshotsList.saveDialogJSONFilter):
# This string is displayed as a filter for saving a snapshot to disk.
snapshotsList.saveDialogJSONFilter=JSON Files
# LOCALIZATION NOTE (snapshotsList.saveDialogAllFilter):
# This string is displayed as a filter for saving a snapshot to disk.
snapshotsList.saveDialogAllFilter=All Files
# LOCALIZATION NOTE (snapshotsList.drawCallsLabel):
# See: http://developer.mozilla.org/en/docs/Localization_and_Plurals
# This string is displayed in the snapshots list of the Canvas Debugger,
# as a generic description about how many draw calls were made.
snapshotsList.drawCallsLabel=#1 draw;#1 draws
# LOCALIZATION NOTE (snapshotsList.functionCallsLabel):
# See: http://developer.mozilla.org/en/docs/Localization_and_Plurals
# This string is displayed in the snapshots list of the Canvas Debugger,
# as a generic description about how many function calls were made in total.
snapshotsList.functionCallsLabel=#1 call;#1 calls

2
browser/locales/jar.mn
View File

@ -32,8 +32,6 @@
locale/browser/devtools/netmonitor.properties (%chrome/browser/devtools/netmonitor.properties)
locale/browser/devtools/shadereditor.dtd (%chrome/browser/devtools/shadereditor.dtd)
locale/browser/devtools/shadereditor.properties (%chrome/browser/devtools/shadereditor.properties)
locale/browser/devtools/canvasdebugger.dtd (%chrome/browser/devtools/canvasdebugger.dtd)
locale/browser/devtools/canvasdebugger.properties (%chrome/browser/devtools/canvasdebugger.properties)
locale/browser/devtools/gcli.properties (%chrome/browser/devtools/gcli.properties)
locale/browser/devtools/gclicommands.properties (%chrome/browser/devtools/gclicommands.properties)
locale/browser/devtools/webconsole.properties (%chrome/browser/devtools/webconsole.properties)

5
browser/themes/linux/devtools/canvasdebugger.css
View File

@ -1,5 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../../shared/devtools/canvasdebugger.inc.css

1
browser/themes/linux/jar.mn
View File

@ -209,7 +209,6 @@ browser.jar:
* skin/classic/browser/devtools/splitview.css (../shared/devtools/splitview.css)
skin/classic/browser/devtools/styleeditor.css (../shared/devtools/styleeditor.css)
* skin/classic/browser/devtools/shadereditor.css (devtools/shadereditor.css)
* skin/classic/browser/devtools/canvasdebugger.css (devtools/canvasdebugger.css)
* skin/classic/browser/devtools/debugger.css (devtools/debugger.css)
* skin/classic/browser/devtools/profiler.css (devtools/profiler.css)
* skin/classic/browser/devtools/netmonitor.css (devtools/netmonitor.css)

6
browser/themes/osx/devtools/canvasdebugger.css
View File

@ -1,6 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../shared.inc
%include ../../shared/devtools/canvasdebugger.inc.css

1
browser/themes/osx/jar.mn
View File

@ -330,7 +330,6 @@ browser.jar:
* skin/classic/browser/devtools/splitview.css (../shared/devtools/splitview.css)
skin/classic/browser/devtools/styleeditor.css (../shared/devtools/styleeditor.css)
* skin/classic/browser/devtools/shadereditor.css (devtools/shadereditor.css)
* skin/classic/browser/devtools/canvasdebugger.css (devtools/canvasdebugger.css)
* skin/classic/browser/devtools/debugger.css (devtools/debugger.css)
* skin/classic/browser/devtools/profiler.css (devtools/profiler.css)
* skin/classic/browser/devtools/netmonitor.css (devtools/netmonitor.css)

501
browser/themes/shared/devtools/canvasdebugger.inc.css
View File

@ -1,501 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
%filter substitution
%define darkCheckerboardBackground #000
%define lightCheckerboardBackground #fff
%define checkerboardCell rgba(128,128,128,0.2)
%define checkerboardPattern linear-gradient(45deg, @checkerboardCell@ 25%, transparent 25%, transparent 75%, @checkerboardCell@ 75%, @checkerboardCell@), linear-gradient(45deg, @checkerboardCell@ 25%, transparent 25%, transparent 75%, @checkerboardCell@ 75%, @checkerboardCell@)
%define gutterWidth 3em
%define gutterPaddingStart 22px
/* Reload and waiting notices */
.notice-container {
margin-top: -50vh;
font-size: 120%;
}
.theme-dark .notice-container {
background: url(background-noise-toolbar.png), #343c45; /* Toolbars */
color: #f5f7fa; /* Light foreground text */
}
.theme-light .notice-container {
background: url(background-noise-toolbar.png), #f0f1f2; /* Toolbars */
color: #585959; /* Grey foreground text */
}
#reload-notice > button {
min-height: 2em;
}
#empty-notice > button {
min-width: 30px;
min-height: 28px;
margin: 0;
list-style-image: url(profiler-stopwatch.png);
-moz-image-region: rect(0px,16px,16px,0px);
}
#empty-notice > button .button-text {
display: none;
}
.theme-dark #import-notice {
font-size: 250%;
color: rgba(255,255,255,0.2);
}
.theme-light #import-notice {
font-size: 250%;
color: rgba(0,0,0,0.2);
}
/* Snapshots pane */
#snapshots-pane > tabs {
-moz-border-end: 1px solid;
}
#snapshots-pane .devtools-toolbar {
-moz-border-end: 1px solid;
}
.theme-dark #snapshots-pane > tabs,
.theme-dark #snapshots-pane .devtools-toolbar {
-moz-border-end-color: black; /* Match the splitter color. */
}
.theme-light #snapshots-pane > tabs,
.theme-light #snapshots-pane .devtools-toolbar {
-moz-border-end-color: #aaa; /* Match the splitter color. */
}
#record-snapshot {
list-style-image: url("chrome://browser/skin/devtools/profiler-stopwatch.png");
-moz-image-region: rect(0px,16px,16px,0px);
}
#record-snapshot[checked] {
-moz-image-region: rect(0px,32px,16px,16px);
}
/* Snapshots items */
.snapshot-item-thumbnail {
image-rendering: -moz-crisp-edges;
background-image: @checkerboardPattern@;
background-size: 12px 12px, 12px 12px;
background-position: 0px 0px, 6px 6px;
background-repeat: repeat, repeat;
}
.snapshot-item-thumbnail[flipped=true] {
transform: scaleY(-1);
}
.theme-dark .snapshot-item-thumbnail {
background-color: @darkCheckerboardBackground@;
}
.theme-light .snapshot-item-thumbnail {
background-color: @lightCheckerboardBackground@;
}
.snapshot-item-details {
-moz-padding-start: 6px;
}
.snapshot-item-calls {
padding-top: 4px;
font-size: 80%;
}
.snapshot-item-save {
padding-bottom: 2px;
font-size: 90%;
}
.theme-dark .snapshot-item-calls,
.theme-dark .snapshot-item-save {
color: #b6babf; /* Foreground (Text) - Grey */
}
.theme-light .snapshot-item-calls,
.theme-light .snapshot-item-save {
color: #585959; /* Foreground (Text) - Grey */
}
.snapshot-item-save {
text-decoration: underline;
cursor: pointer;
}
.snapshot-item-save[disabled=true] {
text-decoration: none;
pointer-events: none;
}
.snapshot-item-footer[saving]::before {
display: inline-block;
content: "";
background: url("chrome://global/skin/icons/loading_16.png") center no-repeat;
width: 16px;
height: 16px;
margin-top: -2px;
-moz-margin-end: 4px;
}
#snapshots-list .selected label {
/* Text inside a selected item should not be custom colored. */
color: inherit !important;
}
/* Debugging pane controls */
#resume {
list-style-image: url(debugger-play.png);
-moz-image-region: rect(0px,32px,16px,16px);
}
#step-over {
list-style-image: url(debugger-step-over.png);
}
#step-in {
list-style-image: url(debugger-step-in.png);
}
#step-out {
list-style-image: url(debugger-step-out.png);
}
#debugging-controls > toolbarbutton {
transition: opacity 0.15s ease-in-out;
}
#debugging-controls > toolbarbutton[disabled=true] {
opacity: 0.5;
}
#calls-slider {
-moz-padding-end: 24px;
}
#calls-slider .scale-slider {
margin: 0;
}
#debugging-toolbar-sizer-button {
/* This button's only purpose in life is to make the
container .devtools-toolbar have the right height. */
visibility: hidden;
min-width: 1px;
}
/* Calls list pane */
#calls-list .side-menu-widget-container {
background: transparent;
}
#calls-list .side-menu-widget-item {
padding: 0;
}
/* Calls list items */
.theme-dark #calls-list .side-menu-widget-item {
border-color: #111;
border-bottom-color: transparent;
}
.theme-light #calls-list .side-menu-widget-item {
border-color: #eee;
border-bottom-color: transparent;
}
.theme-dark .call-item-view:hover {
background-color: rgba(255,255,255,.025);
}
.theme-light .call-item-view:hover {
background-color: rgba(0,0,0,.025);
}
.theme-dark .call-item-view[draw-call] {
background-color: rgba(112,191,83,0.15);
}
.theme-light .call-item-view[draw-call] {
background-color: rgba(44,187,15,0.1);
}
.theme-dark .call-item-view[interesting-call] {
background-color: rgba(223,128,255,0.15);
}
.theme-light .call-item-view[interesting-call] {
background-color: rgba(184,46,229,0.1);
}
.call-item-gutter {
width: calc(@gutterWidth@ + @gutterPaddingStart@);
-moz-padding-start: @gutterPaddingStart@;
-moz-padding-end: 4px;
padding-top: 2px;
padding-bottom: 2px;
-moz-border-end: 1px solid;
-moz-margin-end: 6px;
}
.selected .call-item-gutter {
background-image: url("editor-debug-location.png");
background-repeat: no-repeat;
background-position: 6px center;
background-size: 12px;
}
.theme-dark .call-item-gutter {
background-color: #181d20;
color: #5f7387;
border-color: #000;
}
.theme-light .call-item-gutter {
background-color: #f7f7f7;
color: #667380;
border-color: #aaa;
}
.call-item-index {
text-align: end;
}
.theme-dark .call-item-context {
color: #eb5368; /* Highlight Orange */
}
.theme-light .call-item-context {
color: #f13c00; /* Highlight Orange */
}
.theme-dark .call-item-name {
color: #46afe3; /* Highlight Blue */
}
.theme-light .call-item-name {
color: #0088cc; /* Highlight Blue */
}
.call-item-location {
-moz-padding-start: 2px;
-moz-padding-end: 6px;
text-align: end;
cursor: pointer;
}
.theme-dark .call-item-location:hover {
color: #0088cc; /* Highlight Blue */
}
.theme-light .call-item-location:hover {
color: #46afe3; /* Highlight Blue */
}
.call-item-view:hover .call-item-location,
.call-item-view[expanded] .call-item-location {
text-decoration: underline;
}
.theme-dark .call-item-location {
border-color: #111;
color: #5e88b0; /* Highlight Blue-Grey */
}
.theme-light .call-item-location {
border-color: #eee;
color: #5f88b0; /* Highlight Blue-Grey */
}
.call-item-stack {
-moz-padding-start: calc(@gutterWidth@ + @gutterPaddingStart@);
padding-bottom: 10px;
}
.theme-dark .call-item-stack {
background: rgba(0,0,0,0.9);
}
.theme-light .call-item-stack {
background: rgba(255,255,255,0.9);
}
.call-item-stack-fn {
padding-top: 2px;
padding-bottom: 2px;
}
.call-item-stack-fn-location {
-moz-padding-start: 2px;
-moz-padding-end: 6px;
text-align: end;
cursor: pointer;
text-decoration: underline;
}
.theme-dark .call-item-stack-fn-name {
color: #a9bacb; /* Content (Text) - Light */
}
.theme-light .call-item-stack-fn-name {
color: #667380; /* Content (Text) - Dark Grey */
}
.theme-dark .call-item-stack-fn-location {
color: #5e88b0; /* Highlight Blue-Grey */
}
.theme-light .call-item-stack-fn-location {
color: #5e88b0; /* Highlight Blue-Grey */
}
.theme-dark .call-item-stack-fn-location:hover {
color: #0088cc; /* Highlight Blue */
}
.theme-light .call-item-stack-fn-location:hover {
color: #46afe3; /* Highlight Blue */
}
#calls-list .selected .call-item-contents > label:not(.call-item-gutter) {
/* Text inside a selected item should not be custom colored. */
color: inherit !important;
}
/* Rendering preview */
#screenshot-container {
background-image: @checkerboardPattern@;
background-size: 30px 30px, 30px 30px;
background-position: 0px 0px, 15px 15px;
background-repeat: repeat, repeat;
}
.theme-dark #screenshot-container {
background-color: @darkCheckerboardBackground@;
}
.theme-light #screenshot-container {
background-color: @lightCheckerboardBackground@;
}
@media (min-width: 701px) {
#screenshot-container {
width: 30vw;
max-width: 50vw;
min-width: 100px;
}
}
@media (max-width: 700px) {
#screenshot-container {
height: 40vh;
max-height: 70vh;
min-height: 100px;
}
}
#screenshot-image {
background-image: -moz-element(#screenshot-rendering);
background-size: contain;
background-position: center, center;
background-repeat: no-repeat;
}
#screenshot-image[flipped=true] {
transform: scaleY(-1);
}
#screenshot-dimensions {
padding-top: 4px;
padding-bottom: 4px;
text-align: center;
}
.theme-dark #screenshot-dimensions {
background-color: rgba(0,0,0,0.4);
}
.theme-light #screenshot-dimensions {
background-color: rgba(255,255,255,0.8);
}
/* Snapshot filmstrip */
#snapshot-filmstrip {
overflow: hidden;
}
.theme-dark #snapshot-filmstrip {
border-top: 1px solid #000;
background-image: url(background-noise-toolbar.png);
color: #f5f7fa; /* Light foreground text */
}
.theme-light #snapshot-filmstrip {
border-top: 1px solid #aaa;
background-image: url(background-noise-toolbar.png);
color: #585959; /* Grey foreground text */
}
.filmstrip-thumbnail {
image-rendering: -moz-crisp-edges;
background-image: @checkerboardPattern@;
background-size: 12px 12px, 12px 12px;
background-position: 0px -1px, 6px 5px;
background-repeat: repeat, repeat;
background-origin: content-box;
cursor: pointer;
padding-top: 1px;
padding-bottom: 1px;
transition: opacity 0.1s ease-in-out;
}
.filmstrip-thumbnail[flipped=true] {
transform: scaleY(-1);
}
.theme-dark .filmstrip-thumbnail {
background-color: @darkCheckerboardBackground@;
}
.theme-light .filmstrip-thumbnail {
background-color: @lightCheckerboardBackground@;
}
.theme-dark .filmstrip-thumbnail {
-moz-border-end: 1px solid #000;
}
.theme-light .filmstrip-thumbnail {
-moz-border-end: 1px solid #aaa;
}
.theme-dark #snapshot-filmstrip > .filmstrip-thumbnail:hover,
.theme-dark #snapshot-filmstrip:not(:hover) > .filmstrip-thumbnail[highlighted] {
border: 1px solid #46afe3; /* Highlight Blue */
margin: 0 0 0 -1px;
padding: 0;
opacity: 0.66;
}
.theme-light #snapshot-filmstrip > .filmstrip-thumbnail:hover,
.theme-light #snapshot-filmstrip:not(:hover) > .filmstrip-thumbnail[highlighted] {
border: 1px solid #0088cc; /* Highlight Blue */
margin: 0 0 0 -1px;
padding: 0;
opacity: 0.66;
}

1
browser/themes/shared/devtools/toolbars.inc.css
View File

@ -774,7 +774,6 @@
.theme-light .scrollbutton-up > .toolbarbutton-icon,
.theme-light .scrollbutton-down > .toolbarbutton-icon,
.theme-light #black-boxed-message-button .button-icon,
.theme-light #canvas-debugging-empty-notice-button .button-icon,
.theme-light #requests-menu-perf-notice-button .button-icon,
.theme-light #requests-menu-network-summary-button .button-icon {
filter: url(filters.svg#invert);

2
browser/themes/shared/devtools/widgets.inc.css
View File

@ -564,12 +564,10 @@
}
.theme-dark .side-menu-widget-empty-text {
background: url(background-noise-toolbar.png), #343c45; /* Toolbars */
color: #b6babf; /* Foreground (Text) - Grey */
}
.theme-light .side-menu-widget-empty-text {
background: #f7f7f7; /* Toolbars */
color: #585959; /* Grey foreground text */
}

5
browser/themes/windows/devtools/canvasdebugger.css
View File

@ -1,5 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
%include ../../shared/devtools/canvasdebugger.inc.css

2
browser/themes/windows/jar.mn
View File

@ -242,7 +242,6 @@ browser.jar:
* skin/classic/browser/devtools/splitview.css (../shared/devtools/splitview.css)
skin/classic/browser/devtools/styleeditor.css (../shared/devtools/styleeditor.css)
* skin/classic/browser/devtools/shadereditor.css (devtools/shadereditor.css)
* skin/classic/browser/devtools/canvasdebugger.css (devtools/canvasdebugger.css)
* skin/classic/browser/devtools/debugger.css (devtools/debugger.css)
* skin/classic/browser/devtools/profiler.css (devtools/profiler.css)
* skin/classic/browser/devtools/netmonitor.css (devtools/netmonitor.css)
@ -590,7 +589,6 @@ browser.jar:
* skin/classic/aero/browser/devtools/splitview.css (../shared/devtools/splitview.css)
skin/classic/aero/browser/devtools/styleeditor.css (../shared/devtools/styleeditor.css)
* skin/classic/aero/browser/devtools/shadereditor.css (devtools/shadereditor.css)
* skin/classic/aero/browser/devtools/canvasdebugger.css (devtools/canvasdebugger.css)
* skin/classic/aero/browser/devtools/debugger.css (devtools/debugger.css)
* skin/classic/aero/browser/devtools/profiler.css (devtools/profiler.css)
* skin/classic/aero/browser/devtools/netmonitor.css (devtools/netmonitor.css)

49
toolkit/devtools/DevToolsUtils.js
View File

@ -8,7 +8,6 @@
const { Ci, Cu } = require("chrome");
let { Services } = Cu.import("resource://gre/modules/Services.jsm", {});
let { setTimeout, clearTimeout } = Cu.import("resource://gre/modules/Timer.jsm", {});
/**
* Turn the error |aError| into a string, without fail.
@ -28,8 +27,6 @@ exports.safeErrorString = function safeErrorString(aError) {
}
} catch (ee) { }
// Append additional line and column number information to the output,
// since it might not be part of the stringified error.
if (typeof aError.lineNumber == "number" && typeof aError.columnNumber == "number") {
errorString += "Line: " + aError.lineNumber + ", column: " + aError.columnNumber;
}
@ -116,41 +113,12 @@ exports.zip = function zip(a, b) {
return pairs;
};
/**
* Waits for the next tick in the event loop to execute a callback.
*/
exports.executeSoon = function executeSoon(aFn) {
const executeSoon = aFn => {
Services.tm.mainThread.dispatch({
run: exports.makeInfallible(aFn)
}, Ci.nsIThread.DISPATCH_NORMAL);
};
/**
* Waits for the next tick in the event loop.
*
* @return Promise
* A promise that is resolved after the next tick in the event loop.
*/
exports.waitForTick = function waitForTick() {
let deferred = promise.defer();
exports.executeSoon(deferred.resolve);
return deferred.promise;
};
/**
* Waits for the specified amount of time to pass.
*
* @param number aDelay
* The amount of time to wait, in milliseconds.
* @return Promise
* A promise that is resolved after the specified amount of time passes.
*/
exports.waitForTime = function waitForTime(aDelay) {
let deferred = promise.defer();
setTimeout(deferred.resolve, aDelay);
return deferred.promise;
};
/**
* Like Array.prototype.forEach, but doesn't cause jankiness when iterating over
* very large arrays by yielding to the browser and continuing execution on the
@ -159,19 +127,16 @@ exports.waitForTime = function waitForTime(aDelay) {
* @param Array aArray
* The array being iterated over.
* @param Function aFn
* The function called on each item in the array. If a promise is
* returned by this function, iterating over the array will be paused
* until the respective promise is resolved.
* The function called on each item in the array.
* @returns Promise
* A promise that is resolved once the whole array has been iterated
* over, and all promises returned by the aFn callback are resolved.
* over.
*/
exports.yieldingEach = function yieldingEach(aArray, aFn) {
const deferred = promise.defer();
let i = 0;
let len = aArray.length;
let outstanding = [deferred.promise];
(function loop() {
const start = Date.now();
@ -182,12 +147,12 @@ exports.yieldingEach = function yieldingEach(aArray, aFn) {
// aren't including time spent in non-JS here, but this is Good
// Enough(tm).
if (Date.now() - start > 16) {
exports.executeSoon(loop);
executeSoon(loop);
return;
}
try {
outstanding.push(aFn(aArray[i], i++));
aFn(aArray[i++]);
} catch (e) {
deferred.reject(e);
return;
@ -197,9 +162,10 @@ exports.yieldingEach = function yieldingEach(aArray, aFn) {
deferred.resolve();
}());
return promise.all(outstanding);
return deferred.promise;
}
/**
* Like XPCOMUtils.defineLazyGetter, but with a |this| sensitive getter that
* allows the lazy getter to be defined on a prototype and work correctly with
@ -300,3 +266,4 @@ exports.isSafeJSObject = function isSafeJSObject(aObj) {
return Cu.isXrayWrapper(aObj);
};

1
toolkit/devtools/Loader.jsm
View File

@ -71,7 +71,6 @@ BuiltinProvider.prototype = {
"devtools/client": "resource://gre/modules/devtools/client",
"devtools/pretty-fast": "resource://gre/modules/devtools/pretty-fast.js",
"devtools/async-utils": "resource://gre/modules/devtools/async-utils",
"devtools/content-observer": "resource://gre/modules/devtools/content-observer",
"gcli": "resource://gre/modules/devtools/gcli",
"acorn": "resource://gre/modules/devtools/acorn",
"acorn/util/walk": "resource://gre/modules/devtools/acorn/walk.js",

72
toolkit/devtools/content-observer.js
View File

@ -1,72 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const {Cc, Ci, Cu, Cr} = require("chrome");
const {Services} = Cu.import("resource://gre/modules/Services.jsm", {});
const events = require("sdk/event/core");
const promise = require("sdk/core/promise");
/**
* Handles adding an observer for the creation of content document globals,
* event sent immediately after a web content document window has been set up,
* but before any script code has been executed.
*/
function ContentObserver(tabActor) {
this._contentWindow = tabActor.window;
this._onContentGlobalCreated = this._onContentGlobalCreated.bind(this);
this._onInnerWindowDestroyed = this._onInnerWindowDestroyed.bind(this);
this.startListening();
}
module.exports.ContentObserver = ContentObserver;
ContentObserver.prototype = {
/**
* Starts listening for the required observer messages.
*/
startListening: function() {
Services.obs.addObserver(
this._onContentGlobalCreated, "content-document-global-created", false);
Services.obs.addObserver(
this._onInnerWindowDestroyed, "inner-window-destroyed", false);
},
/**
* Stops listening for the required observer messages.
*/
stopListening: function() {
Services.obs.removeObserver(
this._onContentGlobalCreated, "content-document-global-created", false);
Services.obs.removeObserver(
this._onInnerWindowDestroyed, "inner-window-destroyed", false);
},
/**
* Fired immediately after a web content document window has been set up.
*/
_onContentGlobalCreated: function(subject, topic, data) {
if (subject == this._contentWindow) {
events.emit(this, "global-created", subject);
}
},
/**
* Fired when an inner window is removed from the backward/forward cache.
*/
_onInnerWindowDestroyed: function(subject, topic, data) {
let id = subject.QueryInterface(Ci.nsISupportsPRUint64).data;
events.emit(this, "global-destroyed", id);
}
};
// Utility functions.
ContentObserver.GetInnerWindowID = function(window) {
return window
.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIDOMWindowUtils)
.currentInnerWindowID;
};

559
toolkit/devtools/server/actors/call-watcher.js
View File

@ -1,559 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const {Cc, Ci, Cu, Cr} = require("chrome");
const events = require("sdk/event/core");
const promise = require("sdk/core/promise");
const protocol = require("devtools/server/protocol");
const {ContentObserver} = require("devtools/content-observer");
const {on, once, off, emit} = events;
const {method, Arg, Option, RetVal} = protocol;
exports.register = function(handle) {
handle.addTabActor(CallWatcherActor, "callWatcherActor");
};
exports.unregister = function(handle) {
handle.removeTabActor(CallWatcherActor);
};
/**
* Type describing a single function call in a stack trace.
*/
protocol.types.addDictType("call-stack-item", {
name: "string",
file: "string",
line: "number"
});
/**
* Type describing an overview of a function call.
*/
protocol.types.addDictType("call-details", {
type: "number",
name: "string",
stack: "array:call-stack-item"
});
/**
* This actor contains information about a function call, like the function
* type, name, stack, arguments, returned value etc.
*/
let FunctionCallActor = protocol.ActorClass({
typeName: "function-call",
/**
* Creates the function call actor.
*
* @param DebuggerServerConnection conn
* The server connection.
* @param DOMWindow window
* The content window.
* @param string global
* The name of the global object owning this function, like
* "CanvasRenderingContext2D" or "WebGLRenderingContext".
* @param object caller
* The object owning the function when it was called.
* For example, in `foo.bar()`, the caller is `foo`.
* @param number type
* Either METHOD_FUNCTION, METHOD_GETTER or METHOD_SETTER.
* @param string name
* The called function's name.
* @param array stack
* The called function's stack, as a list of { name, file, line } objects.
* @param array args
* The called function's arguments.
* @param any result
* The value returned by the function call.
*/
initialize: function(conn, [window, global, caller, type, name, stack, args, result]) {
protocol.Actor.prototype.initialize.call(this, conn);
this.details = {
window: window,
caller: caller,
type: type,
name: name,
stack: stack,
args: args,
return: result
};
this.meta = {
global: -1,
previews: { caller: "", args: "" }
};
if (global == "WebGLRenderingContext") {
this.meta.global = CallWatcherFront.CANVAS_WEBGL_CONTEXT;
} else if (global == "CanvasRenderingContext2D") {
this.meta.global = CallWatcherFront.CANVAS_2D_CONTEXT;
} else if (global == "window") {
this.meta.global = CallWatcherFront.UNKNOWN_SCOPE;
} else {
this.meta.global = CallWatcherFront.GLOBAL_SCOPE;
}
this.meta.previews.caller = this._generateCallerPreview();
this.meta.previews.args = this._generateArgsPreview();
},
/**
* Customize the marshalling of this actor to provide some generic information
* directly on the Front instance.
*/
form: function() {
return {
actor: this.actorID,
type: this.details.type,
name: this.details.name,
file: this.details.stack[0].file,
line: this.details.stack[0].line,
callerPreview: this.meta.previews.caller,
argsPreview: this.meta.previews.args
};
},
/**
* Gets more information about this function call, which is not necessarily
* available on the Front instance.
*/
getDetails: method(function() {
let { type, name, stack } = this.details;
// Since not all calls on the stack have corresponding owner files (e.g.
// callbacks of a requestAnimationFrame etc.), there's no benefit in
// returning them, as the user can't jump to the Debugger from them.
for (let i = stack.length - 1;;) {
if (stack[i].file) {
break;
}
stack.pop();
i--;
}
// XXX: Use grips for objects and serialize them properly, in order
// to add the function's caller, arguments and return value. Bug 978957.
return {
type: type,
name: name,
stack: stack
};
}, {
response: { info: RetVal("call-details") }
}),
/**
* Serializes the caller's name so that it can be easily be transferred
* as a string, but still be useful when displayed in a potential UI.
*
* @return string
* The caller's name as a string.
*/
_generateCallerPreview: function() {
let global = this.meta.global;
if (global == CallWatcherFront.CANVAS_WEBGL_CONTEXT) {
return "gl";
}
if (global == CallWatcherFront.CANVAS_2D_CONTEXT) {
return "ctx";
}
return "";
},
/**
* Serializes the arguments so that they can be easily be transferred
* as a string, but still be useful when displayed in a potential UI.
*
* @return string
* The arguments as a string.
*/
_generateArgsPreview: function() {
let { caller, args } = this.details;
let { global } = this.meta;
// XXX: All of this sucks. Make this smarter, so that the frontend
// can inspect each argument, be it object or primitive. Bug 978960.
let serializeArgs = () => args.map(arg => {
if (typeof arg == "undefined") {
return "undefined";
}
if (typeof arg == "function") {
return "Function";
}
if (typeof arg == "object") {
return "Object";
}
if (global == CallWatcherFront.CANVAS_WEBGL_CONTEXT) {
// XXX: This doesn't handle combined bitmasks. Bug 978964.
return getEnumsLookupTable("webgl", caller)[arg] || arg;
}
if (global == CallWatcherFront.CANVAS_2D_CONTEXT) {
return getEnumsLookupTable("2d", caller)[arg] || arg;
}
return arg;
});
return serializeArgs().join(", ");
}
});
/**
* The corresponding Front object for the FunctionCallActor.
*/
let FunctionCallFront = protocol.FrontClass(FunctionCallActor, {
initialize: function(client, form) {
protocol.Front.prototype.initialize.call(this, client, form);
},
/**
* Adds some generic information directly to this instance,
* to avoid extra roundtrips.
*/
form: function(form) {
this.actorID = form.actor;
this.type = form.type;
this.name = form.name;
this.file = form.file;
this.line = form.line;
this.callerPreview = form.callerPreview;
this.argsPreview = form.argsPreview;
}
});
/**
* This actor observes function calls on certain objects or globals.
*/
let CallWatcherActor = exports.CallWatcherActor = protocol.ActorClass({
typeName: "call-watcher",
initialize: function(conn, tabActor) {
protocol.Actor.prototype.initialize.call(this, conn);
this.tabActor = tabActor;
this._onGlobalCreated = this._onGlobalCreated.bind(this);
this._onGlobalDestroyed = this._onGlobalDestroyed.bind(this);
this._onContentFunctionCall = this._onContentFunctionCall.bind(this);
},
destroy: function(conn) {
protocol.Actor.prototype.destroy.call(this, conn);
this.finalize();
},
/**
* Starts waiting for the current tab actor's document global to be
* created, in order to instrument the specified objects and become
* aware of everything the content does with them.
*/
setup: method(function({ tracedGlobals, tracedFunctions, startRecording, performReload }) {
if (this._initialized) {
return;
}
this._initialized = true;
this._functionCalls = [];
this._tracedGlobals = tracedGlobals || [];
this._tracedFunctions = tracedFunctions || [];
this._contentObserver = new ContentObserver(this.tabActor);
on(this._contentObserver, "global-created", this._onGlobalCreated);
on(this._contentObserver, "global-destroyed", this._onGlobalDestroyed);
if (startRecording) {
this.resumeRecording();
}
if (performReload) {
this.tabActor.window.location.reload();
}
}, {
request: {
tracedGlobals: Option(0, "nullable:array:string"),
tracedFunctions: Option(0, "nullable:array:string"),
startRecording: Option(0, "boolean"),
performReload: Option(0, "boolean")
},
oneway: true
}),
/**
* Stops listening for document global changes and puts this actor
* to hibernation. This method is called automatically just before the
* actor is destroyed.
*/
finalize: method(function() {
if (!this._initialized) {
return;
}
this._initialized = false;
this._contentObserver.stopListening();
off(this._contentObserver, "global-created", this._onGlobalCreated);
off(this._contentObserver, "global-destroyed", this._onGlobalDestroyed);
this._tracedGlobals = null;
this._tracedFunctions = null;
this._contentObserver = null;
}, {
oneway: true
}),
/**
* Returns whether the instrumented function calls are currently recorded.
*/
isRecording: method(function() {
return this._recording;
}, {
response: RetVal("boolean")
}),
/**
* Starts recording function calls.
*/
resumeRecording: method(function() {
this._recording = true;
}),
/**
* Stops recording function calls.
*/
pauseRecording: method(function() {
this._recording = false;
return this._functionCalls;
}, {
response: { calls: RetVal("array:function-call") }
}),
/**
* Erases all the recorded function calls.
* Calling `resumeRecording` or `pauseRecording` does not erase history.
*/
eraseRecording: method(function() {
this._functionCalls = [];
}),
/**
* Lightweight listener invoked whenever an instrumented function is called
* while recording. We're doing this to avoid the event emitter overhead,
* since this is expected to be a very hot function.
*/
onCall: function() {},
/**
* Invoked whenever the current tab actor's document global is created.
*/
_onGlobalCreated: function(window) {
let self = this;
this._tracedWindowId = ContentObserver.GetInnerWindowID(window);
let unwrappedWindow = XPCNativeWrapper.unwrap(window);
let callback = this._onContentFunctionCall;
for (let global of this._tracedGlobals) {
let prototype = unwrappedWindow[global].prototype;
let properties = Object.keys(prototype);
properties.forEach(name => overrideSymbol(global, prototype, name, callback));
}
for (let name of this._tracedFunctions) {
overrideSymbol("window", unwrappedWindow, name, callback);
}
/**
* Instruments a method, getter or setter on the specified target object to
* invoke a callback whenever it is called.
*/
function overrideSymbol(global, target, name, callback) {
let propertyDescriptor = Object.getOwnPropertyDescriptor(target, name);
if (propertyDescriptor.get || propertyDescriptor.set) {
overrideAccessor(global, target, name, propertyDescriptor, callback);
return;
}
if (propertyDescriptor.writable && typeof propertyDescriptor.value == "function") {
overrideFunction(global, target, name, propertyDescriptor, callback);
return;
}
}
/**
* Instruments a function on the specified target object.
*/
function overrideFunction(global, target, name, descriptor, callback) {
let originalFunc = target[name];
Object.defineProperty(target, name, {
value: function(...args) {
let result = originalFunc.apply(this, args);
if (self._recording) {
let stack = getStack(name);
let type = CallWatcherFront.METHOD_FUNCTION;
callback(unwrappedWindow, global, this, type, name, stack, args, result);
}
return result;
},
configurable: descriptor.configurable,
enumerable: descriptor.enumerable,
writable: true
});
}
/**
* Instruments a getter or setter on the specified target object.
*/
function overrideAccessor(global, target, name, descriptor, callback) {
let originalGetter = target.__lookupGetter__(name);
let originalSetter = target.__lookupSetter__(name);
Object.defineProperty(target, name, {
get: function(...args) {
if (!originalGetter) return undefined;
let result = originalGetter.apply(this, args);
if (self._recording) {
let stack = getStack(name);
let type = CallWatcherFront.GETTER_FUNCTION;
callback(unwrappedWindow, global, this, type, name, stack, args, result);
}
return result;
},
set: function(...args) {
if (!originalSetter) return;
originalSetter.apply(this, args);
if (self._recording) {
let stack = getStack(name);
let type = CallWatcherFront.SETTER_FUNCTION;
callback(unwrappedWindow, global, this, type, name, stack, args, undefined);
}
},
configurable: descriptor.configurable,
enumerable: descriptor.enumerable
});
}
/**
* Stores the relevant information about calls on the stack when
* a function is called.
*/
function getStack(caller) {
try {
// Using Components.stack wouldn't be a better idea, since it's
// much slower because it attempts to retrieve the C++ stack as well.
throw new Error();
} catch (e) {
var stack = e.stack;
}
// Of course, using a simple regex like /(.*?)@(.*):(\d*):\d*/ would be
// much prettier, but this is a very hot function, so let's sqeeze
// every drop of performance out of it.
let calls = [];
let callIndex = 0;
let currNewLinePivot = stack.indexOf("\n") + 1;
let nextNewLinePivot = stack.indexOf("\n", currNewLinePivot);
while (nextNewLinePivot > 0) {
let nameDelimiterIndex = stack.indexOf("@", currNewLinePivot);
let columnDelimiterIndex = stack.lastIndexOf(":", nextNewLinePivot - 1);
let lineDelimiterIndex = stack.lastIndexOf(":", columnDelimiterIndex - 1);
if (!calls[callIndex]) {
calls[callIndex] = { name: "", file: "", line: 0 };
}
if (!calls[callIndex + 1]) {
calls[callIndex + 1] = { name: "", file: "", line: 0 };
}
if (callIndex > 0) {
let file = stack.substring(nameDelimiterIndex + 1, lineDelimiterIndex);
let line = stack.substring(lineDelimiterIndex + 1, columnDelimiterIndex);
let name = stack.substring(currNewLinePivot, nameDelimiterIndex);
calls[callIndex].name = name;
calls[callIndex - 1].file = file;
calls[callIndex - 1].line = line;
} else {
// Since the topmost stack frame is actually our overwritten function,
// it will not have the expected name.
calls[0].name = caller;
}
currNewLinePivot = nextNewLinePivot + 1;
nextNewLinePivot = stack.indexOf("\n", currNewLinePivot);
callIndex++;
}
return calls;
}
},
/**
* Invoked whenever the current tab actor's inner window is destroyed.
*/
_onGlobalDestroyed: function(id) {
if (this._tracedWindowId == id) {
this.pauseRecording();
this.eraseRecording();
}
},
/**
* Invoked whenever an instrumented function is called.
*/
_onContentFunctionCall: function(...details) {
let functionCall = new FunctionCallActor(this.conn, details);
this._functionCalls.push(functionCall);
this.onCall(functionCall);
}
});
/**
* The corresponding Front object for the CallWatcherActor.
*/
let CallWatcherFront = exports.CallWatcherFront = protocol.FrontClass(CallWatcherActor, {
initialize: function(client, { callWatcherActor }) {
protocol.Front.prototype.initialize.call(this, client, { actor: callWatcherActor });
client.addActorPool(this);
this.manage(this);
}
});
/**
* Constants.
*/
CallWatcherFront.METHOD_FUNCTION = 0;
CallWatcherFront.GETTER_FUNCTION = 1;
CallWatcherFront.SETTER_FUNCTION = 2;
CallWatcherFront.GLOBAL_SCOPE = 0;
CallWatcherFront.UNKNOWN_SCOPE = 1;
CallWatcherFront.CANVAS_WEBGL_CONTEXT = 2;
CallWatcherFront.CANVAS_2D_CONTEXT = 3;
/**
* A lookup table for cross-referencing flags or properties with their name
* assuming they look LIKE_THIS most of the time.
*
* For example, when gl.clear(gl.COLOR_BUFFER_BIT) is called, the actual passed
* argument's value is 16384, which we want identified as "COLOR_BUFFER_BIT".
*/
var gEnumRegex = /^[A-Z_]+$/;
var gEnumsLookupTable = {};
function getEnumsLookupTable(type, object) {
let cachedEnum = gEnumsLookupTable[type];
if (cachedEnum) {
return cachedEnum;
}
let table = gEnumsLookupTable[type] = {};
for (let key in object) {
if (key.match(gEnumRegex)) {
table[object[key]] = key;
}
}
return table;
}

759
toolkit/devtools/server/actors/canvas.js
View File

@ -1,759 +0,0 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
const {Cc, Ci, Cu, Cr} = require("chrome");
const events = require("sdk/event/core");
const promise = require("sdk/core/promise");
const protocol = require("devtools/server/protocol");
const {CallWatcherActor, CallWatcherFront} = require("devtools/server/actors/call-watcher");
const DevToolsUtils = require("devtools/toolkit/DevToolsUtils.js");
const {on, once, off, emit} = events;
const {method, custom, Arg, Option, RetVal} = protocol;
const CANVAS_CONTEXTS = [
"CanvasRenderingContext2D",
"WebGLRenderingContext"
];
const ANIMATION_GENERATORS = [
"requestAnimationFrame",
"mozRequestAnimationFrame"
];
const DRAW_CALLS = [
// 2D canvas
"fill",
"stroke",
"clearRect",
"fillRect",
"strokeRect",
"fillText",
"strokeText",
"drawImage",
// WebGL
"clear",
"drawArrays",
"drawElements",
"finish",
"flush"
];
const INTERESTING_CALLS = [
// 2D canvas
"save",
"restore",
// WebGL
"useProgram"
];
exports.register = function(handle) {
handle.addTabActor(CanvasActor, "canvasActor");
};
exports.unregister = function(handle) {
handle.removeTabActor(CanvasActor);
};
/**
* Type representing an Uint32Array buffer, serialized fast(er).
*
* XXX: It would be nice if on local connections (only), we could just *give*
* the buffer directly to the front, instead of going through all this
* serialization redundancy.
*/
protocol.types.addType("uint32-array", {
write: (v) => "[" + Array.join(v, ",") + "]",
read: (v) => new Uint32Array(JSON.parse(v))
});
/**
* Type describing a thumbnail or screenshot in a recorded animation frame.
*/
protocol.types.addDictType("snapshot-image", {
index: "number",
width: "number",
height: "number",
flipped: "boolean",
pixels: "uint32-array"
});
/**
* Type describing an overview of a recorded animation frame.
*/
protocol.types.addDictType("snapshot-overview", {
calls: "array:function-call",
thumbnails: "array:snapshot-image",
screenshot: "snapshot-image"
});
/**
* This actor represents a recorded animation frame snapshot, along with
* all the corresponding canvas' context methods invoked in that frame,
* thumbnails for each draw call and a screenshot of the end result.
*/
let FrameSnapshotActor = protocol.ActorClass({
typeName: "frame-snapshot",
/**
* Creates the frame snapshot call actor.
*
* @param DebuggerServerConnection conn
* The server connection.
* @param HTMLCanvasElement canvas
* A reference to the content canvas.
* @param array calls
* An array of "function-call" actor instances.
* @param object screenshot
* A single "snapshot-image" type instance.
*/
initialize: function(conn, { canvas, calls, screenshot }) {
protocol.Actor.prototype.initialize.call(this, conn);
this._contentCanvas = canvas;
this._functionCalls = calls;
this._lastDrawCallScreenshot = screenshot;
},
/**
* Gets as much data about this snapshot without computing anything costly.
*/
getOverview: method(function() {
return {
calls: this._functionCalls,
thumbnails: this._functionCalls.map(e => e._thumbnail).filter(e => !!e),
screenshot: this._lastDrawCallScreenshot
};
}, {
response: { overview: RetVal("snapshot-overview") }
}),
/**
* Gets a screenshot of the canvas's contents after the specified
* function was called.
*/
generateScreenshotFor: method(function(functionCall) {
let caller = functionCall.details.caller;
let global = functionCall.meta.global;
let canvas = this._contentCanvas;
let calls = this._functionCalls;
let index = calls.indexOf(functionCall);
// To get a screenshot, replay all the steps necessary to render the frame,
// by invoking the context calls up to and including the specified one.
// This will be done in a custom framebuffer in case of a WebGL context.
let { replayContext, lastDrawCallIndex } = ContextUtils.replayAnimationFrame({
contextType: global,
canvas: canvas,
calls: calls,
first: 0,
last: index
});
// To keep things fast, generate an image that's relatively small.
let dimensions = Math.min(CanvasFront.SCREENSHOT_HEIGHT_MAX, canvas.height);
let screenshot;
// Depending on the canvas' context, generating a screenshot is done
// in different ways. In case of the WebGL context, we also need to reset
// the framebuffer binding to the default value.
if (global == CallWatcherFront.CANVAS_WEBGL_CONTEXT) {
screenshot = ContextUtils.getPixelsForWebGL(replayContext);
replayContext.bindFramebuffer(replayContext.FRAMEBUFFER, null);
screenshot.flipped = true;
}
// In case of 2D contexts, no additional special treatment is necessary.
else if (global == CallWatcherFront.CANVAS_2D_CONTEXT) {
screenshot = ContextUtils.getPixelsFor2D(replayContext);
screenshot.flipped = false;
}
screenshot.index = lastDrawCallIndex;
return screenshot;
}, {
request: { call: Arg(0, "function-call") },
response: { screenshot: RetVal("snapshot-image") }
})
});
/**
* The corresponding Front object for the FrameSnapshotActor.
*/
let FrameSnapshotFront = protocol.FrontClass(FrameSnapshotActor, {
initialize: function(client, form) {
protocol.Front.prototype.initialize.call(this, client, form);
this._lastDrawCallScreenshot = null;
this._cachedScreenshots = new WeakMap();
},
/**
* This implementation caches the last draw call screenshot to optimize
* frontend requests to `generateScreenshotFor`.
*/
getOverview: custom(function() {
return this._getOverview().then(data => {
this._lastDrawCallScreenshot = data.screenshot;
return data;
});
}, {
impl: "_getOverview"
}),
/**
* This implementation saves a roundtrip to the backend if the screenshot
* was already generated and retrieved once.
*/
generateScreenshotFor: custom(function(functionCall) {
if (CanvasFront.ANIMATION_GENERATORS.has(functionCall.name)) {
return promise.resolve(this._lastDrawCallScreenshot);
}
let cachedScreenshot = this._cachedScreenshots.get(functionCall);
if (cachedScreenshot) {
return cachedScreenshot;
}
let screenshot = this._generateScreenshotFor(functionCall);
this._cachedScreenshots.set(functionCall, screenshot);
return screenshot;
}, {
impl: "_generateScreenshotFor"
})
});
/**
* This Canvas Actor handles simple instrumentation of all the methods
* of a 2D or WebGL context, to provide information regarding all the calls
* made when drawing frame inside an animation loop.
*/
let CanvasActor = exports.CanvasActor = protocol.ActorClass({
typeName: "canvas",
initialize: function(conn, tabActor) {
protocol.Actor.prototype.initialize.call(this, conn);
this.tabActor = tabActor;
this._onContentFunctionCall = this._onContentFunctionCall.bind(this);
},
destroy: function(conn) {
protocol.Actor.prototype.destroy.call(this, conn);
this.finalize();
},
/**
* Starts listening for function calls.
*/
setup: method(function({ reload }) {
if (this._initialized) {
return;
}
this._initialized = true;
this._callWatcher = new CallWatcherActor(this.conn, this.tabActor);
this._callWatcher.onCall = this._onContentFunctionCall;
this._callWatcher.setup({
tracedGlobals: CANVAS_CONTEXTS,
tracedFunctions: ANIMATION_GENERATORS,
performReload: reload
});
}, {
request: { reload: Option(0, "boolean") },
oneway: true
}),
/**
* Stops listening for function calls.
*/
finalize: method(function() {
if (!this._initialized) {
return;
}
this._initialized = false;
this._callWatcher.finalize();
this._callWatcher = null;
}, {
oneway: true
}),
/**
* Returns whether this actor has been set up.
*/
isInitialized: method(function() {
return !!this._initialized;
}, {
response: { initialized: RetVal("boolean") }
}),
/**
* Records a snapshot of all the calls made during the next animation frame.
* The animation should be implemented via the de-facto requestAnimationFrame
* utility, not inside a `setInterval` or recursive `setTimeout`.
*
* XXX: Currently only supporting requestAnimationFrame. When this isn't used,
* it'd be a good idea to display a huge red flashing banner telling people to
* STOP USING `setInterval` OR `setTimeout` FOR ANIMATION. Bug 978948.
*/
recordAnimationFrame: method(function() {
if (this._callWatcher.isRecording()) {
return this._currentAnimationFrameSnapshot.promise;
}
this._callWatcher.eraseRecording();
this._callWatcher.resumeRecording();
let deferred = this._currentAnimationFrameSnapshot = promise.defer();
return deferred.promise;
}, {
response: { snapshot: RetVal("frame-snapshot") }
}),
/**
* Invoked whenever an instrumented function is called, be it on a
* 2d or WebGL context, or an animation generator like requestAnimationFrame.
*/
_onContentFunctionCall: function(functionCall) {
let { window, name, args } = functionCall.details;
// The function call arguments are required to replay animation frames,
// in order to generate screenshots. However, simply storing references to
// every kind of object is a bad idea, since their properties may change.
// Consider transformation matrices for example, which are typically
// Float32Arrays whose values can easily change across context calls.
// They need to be cloned.
inplaceShallowCloneArrays(args, window);
if (CanvasFront.ANIMATION_GENERATORS.has(name)) {
this._handleAnimationFrame(functionCall);
return;
}
if (CanvasFront.DRAW_CALLS.has(name) && this._animationStarted) {
this._handleDrawCall(functionCall);
return;
}
},
/**
* Handle animations generated using requestAnimationFrame.
*/
_handleAnimationFrame: function(functionCall) {
if (!this._animationStarted) {
this._handleAnimationFrameBegin();
} else {
this._handleAnimationFrameEnd(functionCall);
}
},
/**
* Called whenever an animation frame rendering begins.
*/
_handleAnimationFrameBegin: function() {
this._callWatcher.eraseRecording();
this._animationStarted = true;
},
/**
* Called whenever an animation frame rendering ends.
*/
_handleAnimationFrameEnd: function() {
// Get a hold of all the function calls made during this animation frame.
// Since only one snapshot can be recorded at a time, erase all the
// previously recorded calls.
let functionCalls = this._callWatcher.pauseRecording();
this._callWatcher.eraseRecording();
// Since the animation frame finished, get a hold of the (already retrieved)
// canvas pixels to conveniently create a screenshot of the final rendering.
let index = this._lastDrawCallIndex;
let width = this._lastContentCanvasWidth;
let height = this._lastContentCanvasHeight;
let flipped = this._lastThumbnailFlipped;
let pixels = ContextUtils.getPixelStorage()["32bit"];
let lastDrawCallScreenshot = {
index: index,
width: width,
height: height,
flipped: flipped,
pixels: pixels.subarray(0, width * height)
};
// Wrap the function calls and screenshot in a FrameSnapshotActor instance,
// which will resolve the promise returned by `recordAnimationFrame`.
let frameSnapshot = new FrameSnapshotActor(this.conn, {
canvas: this._lastDrawCallCanvas,
calls: functionCalls,
screenshot: lastDrawCallScreenshot
});
this._currentAnimationFrameSnapshot.resolve(frameSnapshot);
this._currentAnimationFrameSnapshot = null;
this._animationStarted = false;
},
/**
* Invoked whenever a draw call is detected in the animation frame which is
* currently being recorded.
*/
_handleDrawCall: function(functionCall) {
let functionCalls = this._callWatcher.pauseRecording();
let caller = functionCall.details.caller;
let global = functionCall.meta.global;
let contentCanvas = this._lastDrawCallCanvas = caller.canvas;
let index = this._lastDrawCallIndex = functionCalls.indexOf(functionCall);
let w = this._lastContentCanvasWidth = contentCanvas.width;
let h = this._lastContentCanvasHeight = contentCanvas.height;
// To keep things fast, generate images of small and fixed dimensions.
let dimensions = CanvasFront.THUMBNAIL_HEIGHT;
let thumbnail;
// Create a thumbnail on every draw call on the canvas context, to augment
// the respective function call actor with this additional data.
if (global == CallWatcherFront.CANVAS_WEBGL_CONTEXT) {
// Check if drawing to a custom framebuffer (when rendering to texture).
// Don't create a thumbnail in this particular case.
let framebufferBinding = caller.getParameter(caller.FRAMEBUFFER_BINDING);
if (framebufferBinding == null) {
thumbnail = ContextUtils.getPixelsForWebGL(caller, 0, 0, w, h, dimensions);
thumbnail.flipped = this._lastThumbnailFlipped = true;
thumbnail.index = index;
}
} else if (global == CallWatcherFront.CANVAS_2D_CONTEXT) {
thumbnail = ContextUtils.getPixelsFor2D(caller, 0, 0, w, h, dimensions);
thumbnail.flipped = this._lastThumbnailFlipped = false;
thumbnail.index = index;
}
functionCall._thumbnail = thumbnail;
this._callWatcher.resumeRecording();
}
});
/**
* A collection of methods for manipulating canvas contexts.
*/
let ContextUtils = {
/**
* WebGL contexts are sensitive to how they're queried. Use this function
* to make sure the right context is always retrieved, if available.
*
* @param HTMLCanvasElement canvas
* The canvas element for which to get a WebGL context.
* @param WebGLRenderingContext gl
* The queried WebGL context, or null if unavailable.
*/
getWebGLContext: function(canvas) {
return canvas.getContext("webgl") ||
canvas.getContext("experimental-webgl");
},
/**
* Gets a hold of the rendered pixels in the most efficient way possible for
* a canvas with a WebGL context.
*
* @param WebGLRenderingContext gl
* The WebGL context to get a screenshot from.
* @param number srcX [optional]
* The first left pixel that is read from the framebuffer.
* @param number srcY [optional]
* The first top pixel that is read from the framebuffer.
* @param number srcWidth [optional]
* The number of pixels to read on the X axis.
* @param number srcHeight [optional]
* The number of pixels to read on the Y axis.
* @param number dstHeight [optional]
* The desired generated screenshot height.
* @return object
* An objet containing the screenshot's width, height and pixel data.
*/
getPixelsForWebGL: function(gl,
srcX = 0, srcY = 0,
srcWidth = gl.canvas.width,
srcHeight = gl.canvas.height,
dstHeight = srcHeight)
{
let contentPixels = ContextUtils.getPixelStorage(srcWidth, srcHeight);
let { "8bit": charView, "32bit": intView } = contentPixels;
gl.readPixels(srcX, srcY, srcWidth, srcHeight, gl.RGBA, gl.UNSIGNED_BYTE, charView);
return this.resizePixels(intView, srcWidth, srcHeight, dstHeight);
},
/**
* Gets a hold of the rendered pixels in the most efficient way possible for
* a canvas with a 2D context.
*
* @param CanvasRenderingContext2D ctx
* The 2D context to get a screenshot from.
* @param number srcX [optional]
* The first left pixel that is read from the canvas.
* @param number srcY [optional]
* The first top pixel that is read from the canvas.
* @param number srcWidth [optional]
* The number of pixels to read on the X axis.
* @param number srcHeight [optional]
* The number of pixels to read on the Y axis.
* @param number dstHeight [optional]
* The desired generated screenshot height.
* @return object
* An objet containing the screenshot's width, height and pixel data.
*/
getPixelsFor2D: function(ctx,
srcX = 0, srcY = 0,
srcWidth = ctx.canvas.width,
srcHeight = ctx.canvas.height,
dstHeight = srcHeight)
{
let { data } = ctx.getImageData(srcX, srcY, srcWidth, srcHeight);
let { "32bit": intView } = ContextUtils.usePixelStorage(data.buffer);
return this.resizePixels(intView, srcWidth, srcHeight, dstHeight);
},
/**
* Resizes the provided pixels to fit inside a rectangle with the specified
* height and the same aspect ratio as the source.
*
* @param Uint32Array srcPixels
* The source pixel data, assuming 32bit/pixel and 4 color components.
* @param number srcWidth
* The source pixel data width.
* @param number srcHeight
* The source pixel data height.
* @param number dstHeight [optional]
* The desired resized pixel data height.
* @return object
* An objet containing the resized pixels width, height and data.
*/
resizePixels: function(srcPixels, srcWidth, srcHeight, dstHeight) {
let screenshotRatio = dstHeight / srcHeight;
let dstWidth = Math.floor(srcWidth * screenshotRatio);
// Use a plain array instead of a Uint32Array to make serializing faster.
let dstPixels = new Array(dstWidth * dstHeight);
// If the resized image ends up being completely transparent, returning
// an empty array will skip some redundant serialization cycles.
let isTransparent = true;
for (let dstX = 0; dstX < dstWidth; dstX++) {
for (let dstY = 0; dstY < dstHeight; dstY++) {
let srcX = Math.floor(dstX / screenshotRatio);
let srcY = Math.floor(dstY / screenshotRatio);
let cPos = srcX + srcWidth * srcY;
let dPos = dstX + dstWidth * dstY;
let color = dstPixels[dPos] = srcPixels[cPos];
if (color) {
isTransparent = false;
}
}
}
return {
width: dstWidth,
height: dstHeight,
pixels: isTransparent ? [] : dstPixels
};
},
/**
* Invokes a series of canvas context calls, to "replay" an animation frame
* and generate a screenshot.
*
* In case of a WebGL context, an offscreen framebuffer is created for
* the respective canvas, and the rendering will be performed into it.
* This is necessary because some state (like shaders, textures etc.) can't
* be shared between two different WebGL contexts.
* Hopefully, once SharedResources are a thing this won't be necessary:
* http://www.khronos.org/webgl/wiki/SharedResouces
*
* In case of a 2D context, a new canvas is created, since there's no
* intrinsic state that can't be easily duplicated.
*
* @param number contexType
* The type of context to use. See the CallWatcherFront scope types.
* @param HTMLCanvasElement canvas
* The canvas element which is the source of all context calls.
* @param array calls
* An array of function call actors.
* @param number first
* The first function call to start from.
* @param number last
* The last (inclusive) function call to end at.
* @return object
* The context on which the specified calls were invoked and the
* last registered draw call's index.
*/
replayAnimationFrame: function({ contextType, canvas, calls, first, last }) {
let w = canvas.width;
let h = canvas.height;
let replayCanvas;
let replayContext;
let customFramebuffer;
let lastDrawCallIndex = -1;
// In case of WebGL contexts, rendering will be done offscreen, in a
// custom framebuffer, but on the provided canvas context.
if (contextType == CallWatcherFront.CANVAS_WEBGL_CONTEXT) {
replayCanvas = canvas;
replayContext = this.getWebGLContext(replayCanvas);
customFramebuffer = this.createBoundFramebuffer(replayContext, w, h);
}
// In case of 2D contexts, draw everything on a separate canvas context.
else if (contextType == CallWatcherFront.CANVAS_2D_CONTEXT) {
let contentDocument = canvas.ownerDocument;
replayCanvas = contentDocument.createElement("canvas");
replayCanvas.width = w;
replayCanvas.height = h;
replayContext = replayCanvas.getContext("2d");
replayContext.clearRect(0, 0, w, h);
}
// Replay all the context calls up to and including the specified one.
for (let i = first; i <= last; i++) {
let { type, name, args } = calls[i].details;
// Prevent WebGL context calls that try to reset the framebuffer binding
// to the default value, since we want to perform the rendering offscreen.
if (name == "bindFramebuffer" && args[1] == null) {
replayContext.bindFramebuffer(replayContext.FRAMEBUFFER, customFramebuffer);
} else {
if (type == CallWatcherFront.METHOD_FUNCTION) {
replayContext[name].apply(replayContext, args);
} else if (type == CallWatcherFront.SETTER_FUNCTION) {
replayContext[name] = args;
} else {
// Ignore getter calls.
}
if (CanvasFront.DRAW_CALLS.has(name)) {
lastDrawCallIndex = i;
}
}
}
return {
replayContext: replayContext,
lastDrawCallIndex: lastDrawCallIndex
};
},
/**
* Gets an object containing a buffer large enough to hold width * height
* pixels, assuming 32bit/pixel and 4 color components.
*
* This method avoids allocating memory and tries to reuse a common buffer
* as much as possible.
*
* @param number w
* The desired pixel array storage width.
* @param number h
* The desired pixel array storage height.
* @return object
* The requested pixel array buffer.
*/
getPixelStorage: function(w = 0, h = 0) {
let storage = this._currentPixelStorage;
if (storage && storage["32bit"].length >= w * h) {
return storage;
}
return this.usePixelStorage(new ArrayBuffer(w * h * 4));
},
/**
* Creates and saves the array buffer views used by `getPixelStorage`.
*
* @param ArrayBuffer buffer
* The raw buffer used as storage for various array buffer views.
*/
usePixelStorage: function(buffer) {
let array8bit = new Uint8Array(buffer);
let array32bit = new Uint32Array(buffer);
return this._currentPixelStorage = {
"8bit": array8bit,
"32bit": array32bit
};
},
/**
* Creates a framebuffer of the specified dimensions for a WebGL context,
* assuming a RGBA color buffer, a depth buffer and no stencil buffer.
*
* @param WebGLRenderingContext gl
* The WebGL context to create and bind a framebuffer for.
* @param number width
* The desired width of the renderbuffers.
* @param number height
* The desired height of the renderbuffers.
* @return WebGLFramebuffer
* The generated framebuffer object.
*/
createBoundFramebuffer: function(gl, width, height) {
let framebuffer = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
// Use a texture as the color rendebuffer attachment, since consumenrs of
// this function will most likely want to read the rendered pixels back.
let colorBuffer = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, colorBuffer);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.generateMipmap(gl.TEXTURE_2D);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
let depthBuffer = gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, depthBuffer);
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, width, height);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorBuffer, 0);
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthBuffer);
gl.bindTexture(gl.TEXTURE_2D, null);
gl.bindRenderbuffer(gl.RENDERBUFFER, null);
return framebuffer;
}
};
/**
* The corresponding Front object for the CanvasActor.
*/
let CanvasFront = exports.CanvasFront = protocol.FrontClass(CanvasActor, {
initialize: function(client, { canvasActor }) {
protocol.Front.prototype.initialize.call(this, client, { actor: canvasActor });
client.addActorPool(this);
this.manage(this);
}
});
/**
* Constants.
*/
CanvasFront.CANVAS_CONTEXTS = new Set(CANVAS_CONTEXTS);
CanvasFront.ANIMATION_GENERATORS = new Set(ANIMATION_GENERATORS);
CanvasFront.DRAW_CALLS = new Set(DRAW_CALLS);
CanvasFront.INTERESTING_CALLS = new Set(INTERESTING_CALLS);
CanvasFront.THUMBNAIL_HEIGHT = 50; // px
CanvasFront.SCREENSHOT_HEIGHT_MAX = 256; // px
CanvasFront.INVALID_SNAPSHOT_IMAGE = {
index: -1,
width: 0,
height: 0,
pixels: []
};
/**
* Goes through all the arguments and creates a one-level shallow copy
* of all arrays and array buffers.
*/
function inplaceShallowCloneArrays(functionArguments, contentWindow) {
let { Object, Array, ArrayBuffer } = contentWindow;
functionArguments.forEach((arg, index, store) => {
if (arg instanceof Array) {
store[index] = arg.slice();
}
if (arg instanceof Object && arg.buffer instanceof ArrayBuffer) {
store[index] = new arg.constructor(arg);
}
});
}

65
toolkit/devtools/server/actors/webgl.js
View File

@ -4,9 +4,9 @@
"use strict";
const {Cc, Ci, Cu, Cr} = require("chrome");
const Services = require("Services");
const events = require("sdk/event/core");
const protocol = require("devtools/server/protocol");
const { ContentObserver } = require("devtools/content-observer");
const { on, once, off, emit } = events;
const { method, Arg, Option, RetVal } = protocol;
@ -293,7 +293,7 @@ let WebGLActor = exports.WebGLActor = protocol.ActorClass({
* This is useful for dealing with bfcache, when no new programs are linked.
*/
getPrograms: method(function() {
let id = ContentObserver.GetInnerWindowID(this.tabActor.window);
let id = getInnerWindowID(this.tabActor.window);
return this._programActorsCache.filter(e => e.ownerWindow == id);
}, {
response: { programs: RetVal("array:gl-program") }
@ -346,6 +346,58 @@ let WebGLFront = exports.WebGLFront = protocol.FrontClass(WebGLActor, {
}
});
/**
* Handles adding an observer for the creation of content document globals,
* event sent immediately after a web content document window has been set up,
* but before any script code has been executed. This will allow us to
* instrument the HTMLCanvasElement with the appropriate inspection methods.
*/
function ContentObserver(tabActor) {
this._contentWindow = tabActor.window;
this._onContentGlobalCreated = this._onContentGlobalCreated.bind(this);
this._onInnerWindowDestroyed = this._onInnerWindowDestroyed.bind(this);
this.startListening();
}
ContentObserver.prototype = {
/**
* Starts listening for the required observer messages.
*/
startListening: function() {
Services.obs.addObserver(
this._onContentGlobalCreated, "content-document-global-created", false);
Services.obs.addObserver(
this._onInnerWindowDestroyed, "inner-window-destroyed", false);
},
/**
* Stops listening for the required observer messages.
*/
stopListening: function() {
Services.obs.removeObserver(
this._onContentGlobalCreated, "content-document-global-created", false);
Services.obs.removeObserver(
this._onInnerWindowDestroyed, "inner-window-destroyed", false);
},
/**
* Fired immediately after a web content document window has been set up.
*/
_onContentGlobalCreated: function(subject, topic, data) {
if (subject == this._contentWindow) {
emit(this, "global-created", subject);
}
},
/**
* Fired when an inner window is removed from the backward/forward cache.
*/
_onInnerWindowDestroyed: function(subject, topic, data) {
let id = subject.QueryInterface(Ci.nsISupportsPRUint64).data;
emit(this, "global-destroyed", id);
}
};
/**
* Instruments a HTMLCanvasElement with the appropriate inspection methods.
*/
@ -361,7 +413,7 @@ let WebGLInstrumenter = {
handle: function(window, observer) {
let self = this;
let id = ContentObserver.GetInnerWindowID(window);
let id = getInnerWindowID(window);
let canvasElem = XPCNativeWrapper.unwrap(window.HTMLCanvasElement);
let canvasPrototype = canvasElem.prototype;
let originalGetContext = canvasPrototype.getContext;
@ -1302,6 +1354,13 @@ WebGLProxy.prototype = {
// Utility functions.
function getInnerWindowID(window) {
return window
.QueryInterface(Ci.nsIInterfaceRequestor)
.getInterface(Ci.nsIDOMWindowUtils)
.currentInnerWindowID;
}
function removeFromMap(map, predicate) {
for (let [key, value] of map) {
if (predicate(value)) {

5
toolkit/devtools/server/main.js
View File

@ -392,8 +392,6 @@ var DebuggerServer = {
this.addActors("resource://gre/modules/devtools/server/actors/script.js");
this.addActors("resource://gre/modules/devtools/server/actors/webconsole.js");
this.registerModule("devtools/server/actors/inspector");
this.registerModule("devtools/server/actors/call-watcher");
this.registerModule("devtools/server/actors/canvas");
this.registerModule("devtools/server/actors/webgl");
this.registerModule("devtools/server/actors/stylesheets");
this.registerModule("devtools/server/actors/styleeditor");
@ -402,9 +400,8 @@ var DebuggerServer = {
this.registerModule("devtools/server/actors/tracer");
this.registerModule("devtools/server/actors/memory");
this.registerModule("devtools/server/actors/eventlooplag");
if ("nsIProfiler" in Ci) {
if ("nsIProfiler" in Ci)
this.addActors("resource://gre/modules/devtools/server/actors/profiler.js");
}
},
/**