--- a/devtools/client/canvasdebugger/callslist.js
+++ b/devtools/client/canvasdebugger/callslist.js
@@ -8,17 +8,17 @@
/**
* Functions handling details about a single recorded animation frame snapshot
* (the calls list, rendering preview, thumbnails filmstrip etc.).
*/
var CallsListView = extend(WidgetMethods, {
/**
* Initialization function, called when the tool is started.
*/
- initialize: function () {
+ initialize: function() {
this.widget = new SideMenuWidget($("#calls-list"));
this._searchbox = $("#calls-searchbox");
this._filmstrip = $("#snapshot-filmstrip");
this._onSelect = this._onSelect.bind(this);
this._onSearch = this._onSearch.bind(this);
this._onScroll = this._onScroll.bind(this);
this._onExpand = this._onExpand.bind(this);
@@ -28,29 +28,29 @@ var CallsListView = extend(WidgetMethods
this.widget.addEventListener("select", this._onSelect);
this._searchbox.addEventListener("input", this._onSearch);
this._filmstrip.addEventListener("wheel", this._onScroll);
},
/**
* Destruction function, called when the tool is closed.
*/
- destroy: function () {
+ destroy: function() {
this.widget.removeEventListener("select", this._onSelect);
this._searchbox.removeEventListener("input", this._onSearch);
this._filmstrip.removeEventListener("wheel", this._onScroll);
},
/**
* Populates this container with a list of function calls.
*
* @param array functionCalls
* A list of function call actors received from the backend.
*/
- showCalls: function (functionCalls) {
+ showCalls: function(functionCalls) {
this.empty();
for (let i = 0, len = functionCalls.length; i < len; i++) {
let call = functionCalls[i];
let view = document.createElement("vbox");
view.className = "call-item-view devtools-monospace";
view.setAttribute("flex", "1");
@@ -133,17 +133,17 @@ var CallsListView = extend(WidgetMethods
/**
* Displays an image in the rendering preview of this container, generated
* for the specified draw call in the recorded animation frame snapshot.
*
* @param array screenshot
* A single "snapshot-image" instance received from the backend.
*/
- showScreenshot: function (screenshot) {
+ showScreenshot: function(screenshot) {
let { index, width, height, scaling, flipped, pixels } = screenshot;
let screenshotNode = $("#screenshot-image");
screenshotNode.setAttribute("flipped", flipped);
drawBackground("screenshot-rendering", width, height, pixels);
let dimensionsNode = $("#screenshot-dimensions");
let actualWidth = (width / scaling) | 0;
@@ -156,17 +156,17 @@ var CallsListView = extend(WidgetMethods
/**
* Populates this container's footer with a list of thumbnails, one generated
* for each draw call in the recorded animation frame snapshot.
*
* @param array thumbnails
* An array of "snapshot-image" instances received from the backend.
*/
- showThumbnails: function (thumbnails) {
+ showThumbnails: function(thumbnails) {
while (this._filmstrip.hasChildNodes()) {
this._filmstrip.firstChild.remove();
}
for (let thumbnail of thumbnails) {
this.appendThumbnail(thumbnail);
}
window.emit(EVENTS.THUMBNAILS_DISPLAYED);
@@ -174,17 +174,17 @@ var CallsListView = extend(WidgetMethods
/**
* Displays an image in the thumbnails list of this container, generated
* for the specified draw call in the recorded animation frame snapshot.
*
* @param array thumbnail
* A single "snapshot-image" instance received from the backend.
*/
- appendThumbnail: function (thumbnail) {
+ appendThumbnail: function(thumbnail) {
let { index, width, height, flipped, pixels } = thumbnail;
let thumbnailNode = document.createElementNS(HTML_NS, "canvas");
thumbnailNode.setAttribute("flipped", flipped);
thumbnailNode.width = Math.max(CanvasFront.THUMBNAIL_SIZE, width);
thumbnailNode.height = Math.max(CanvasFront.THUMBNAIL_SIZE, height);
drawImage(thumbnailNode, width, height, pixels, { centered: true });
@@ -225,17 +225,17 @@ var CallsListView = extend(WidgetMethods
*/
get highlightedThumbnail() {
return this._highlightedThumbnailIndex;
},
/**
* The select listener for this container.
*/
- _onSelect: function ({ detail: callItem }) {
+ _onSelect: function({ detail: callItem }) {
if (!callItem) {
return;
}
// Some of the stepping buttons don't make sense specifically while the
// last function call is selected.
if (this.selectedIndex == this.itemCount - 1) {
$("#resume").setAttribute("disabled", "true");
@@ -266,17 +266,17 @@ var CallsListView = extend(WidgetMethods
this.highlightedThumbnail = screenshot.index;
}).catch(console.error);
});
},
/**
* The input listener for the calls searchbox.
*/
- _onSearch: function (e) {
+ _onSearch: function(e) {
let lowerCaseSearchToken = this._searchbox.value.toLowerCase();
this.filterContents(e => {
let call = e.attachment.actor;
let name = call.name.toLowerCase();
let file = call.file.toLowerCase();
let line = call.line.toString().toLowerCase();
let args = call.argsPreview.toLowerCase();
@@ -286,46 +286,45 @@ var CallsListView = extend(WidgetMethods
line.includes(lowerCaseSearchToken) ||
args.includes(lowerCaseSearchToken);
});
},
/**
* The wheel listener for the filmstrip that contains all the thumbnails.
*/
- _onScroll: function (e) {
+ _onScroll: function(e) {
this._filmstrip.scrollLeft += e.deltaX;
},
/**
* The click/dblclick listener for an item or location url in this container.
* When expanding an item, it's corresponding call stack will be displayed.
*/
- _onExpand: function (e) {
+ _onExpand: function(e) {
let callItem = this.getItemForElement(e.target);
let view = $(".call-item-view", callItem.target);
// If the call stack nodes were already created, simply re-show them
// or jump to the corresponding file and line in the Debugger if a
// location link was clicked.
if (view.hasAttribute("call-stack-populated")) {
let isExpanded = view.getAttribute("call-stack-expanded") == "true";
// If clicking on the location, jump to the Debugger.
if (e.target.classList.contains("call-item-location")) {
let { file, line } = callItem.attachment.actor;
this._viewSourceInDebugger(file, line);
return;
}
// Otherwise hide the call stack.
- else {
- view.setAttribute("call-stack-expanded", !isExpanded);
- $(".call-item-stack", view).hidden = isExpanded;
- return;
- }
+
+ view.setAttribute("call-stack-expanded", !isExpanded);
+ $(".call-item-stack", view).hidden = isExpanded;
+ return;
}
let list = document.createElement("vbox");
list.className = "call-item-stack";
view.setAttribute("call-stack-populated", "");
view.setAttribute("call-stack-expanded", "true");
view.appendChild(list);
@@ -378,76 +377,76 @@ var CallsListView = extend(WidgetMethods
/**
* The click listener for a location link in the call stack.
*
* @param string file
* The url of the source owning the function.
* @param number line
* The line of the respective function.
*/
- _onStackFileClick: function (e, { file, line }) {
+ _onStackFileClick: function(e, { file, line }) {
this._viewSourceInDebugger(file, line);
},
/**
* The click listener for a thumbnail in the filmstrip.
*
* @param number index
* The function index in the recorded animation frame snapshot.
*/
- _onThumbnailClick: function (e, index) {
+ _onThumbnailClick: function(e, index) {
this.selectedIndex = index;
},
/**
* The click listener for the "resume" button in this container's toolbar.
*/
- _onResume: function () {
+ _onResume: function() {
// Jump to the next draw call in the recorded animation frame snapshot.
let drawCall = getNextDrawCall(this.items, this.selectedItem);
if (drawCall) {
this.selectedItem = drawCall;
return;
}
// If there are no more draw calls, just jump to the last context call.
this._onStepOut();
},
/**
* The click listener for the "step over" button in this container's toolbar.
*/
- _onStepOver: function () {
+ _onStepOver: function() {
this.selectedIndex++;
},
/**
* The click listener for the "step in" button in this container's toolbar.
*/
- _onStepIn: function () {
+ _onStepIn: function() {
if (this.selectedIndex == -1) {
this._onResume();
return;
}
let callItem = this.selectedItem;
let { file, line } = callItem.attachment.actor;
this._viewSourceInDebugger(file, line);
},
/**
* The click listener for the "step out" button in this container's toolbar.
*/
- _onStepOut: function () {
+ _onStepOut: function() {
this.selectedIndex = this.itemCount - 1;
},
/**
* Opens the specified file and line in the debugger. Falls back to Firefox's View Source.
*/
- _viewSourceInDebugger: function (file, line) {
+ _viewSourceInDebugger: function(file, line) {
gToolbox.viewSourceInDebugger(file, line).then(success => {
if (success) {
window.emit(EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
} else {
window.emit(EVENTS.SOURCE_NOT_FOUND_IN_JS_DEBUGGER);
}
});
}
--- a/devtools/client/canvasdebugger/canvasdebugger.js
+++ b/devtools/client/canvasdebugger/canvasdebugger.js
@@ -19,24 +19,23 @@ const { WidgetMethods, setNamedTimeout,
setConditionalTimeout } = require("devtools/client/shared/widgets/view-helpers");
// Use privileged promise in panel documents to prevent having them to freeze
// during toolbox destruction. See bug 1402779.
const Promise = require("Promise");
const CANVAS_ACTOR_RECORDING_ATTEMPT = flags.testing ? 500 : 5000;
-
ChromeUtils.defineModuleGetter(this, "FileUtils",
"resource://gre/modules/FileUtils.jsm");
ChromeUtils.defineModuleGetter(this, "NetUtil",
"resource://gre/modules/NetUtil.jsm");
-XPCOMUtils.defineLazyGetter(this, "NetworkHelper", function () {
+XPCOMUtils.defineLazyGetter(this, "NetworkHelper", function() {
return require("devtools/shared/webconsole/network-helper");
});
// The panel's window global is an EventEmitter firing the following events:
const EVENTS = {
// When the UI is reset from tab navigation.
UI_RESET: "CanvasDebugger:UIReset",
@@ -122,38 +121,38 @@ function shutdownCanvasDebugger() {
/**
* Functions handling target-related lifetime events.
*/
var EventsHandler = {
/**
* Listen for events emitted by the current tab target.
*/
- initialize: function () {
+ initialize: function() {
// Make sure the backend is prepared to handle <canvas> contexts.
// Since actors are created lazily on the first request to them, we need to send an
// early request to ensure the CallWatcherActor is running and watching for new window
// globals.
gFront.setup({ reload: false });
this._onTabWillNavigate = this._onTabWillNavigate.bind(this);
gTarget.on("will-navigate", this._onTabWillNavigate);
},
/**
* Remove events emitted by the current tab target.
*/
- destroy: function () {
+ destroy: function() {
gTarget.off("will-navigate", this._onTabWillNavigate);
},
/**
* Called for each location change in the debugged tab.
*/
- _onTabWillNavigate: function () {
+ _onTabWillNavigate: function() {
// Reset UI.
SnapshotsListView.empty();
CallsListView.empty();
$("#record-snapshot").removeAttribute("checked");
$("#record-snapshot").removeAttribute("disabled");
$("#record-snapshot").hidden = false;
--- a/devtools/client/canvasdebugger/panel.js
+++ b/devtools/client/canvasdebugger/panel.js
@@ -22,17 +22,17 @@ exports.CanvasDebuggerPanel = CanvasDebu
CanvasDebuggerPanel.prototype = {
/**
* Open is effectively an asynchronous constructor.
*
* @return object
* A promise that is resolved when the Canvas Debugger completes opening.
*/
- open: function () {
+ 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);
}
@@ -55,17 +55,17 @@ CanvasDebuggerPanel.prototype = {
},
// DevToolPanel API
get target() {
return this._toolbox.target;
},
- destroy: function () {
+ destroy: function() {
// Make sure this panel is not already destroyed.
if (this._destroyer) {
return this._destroyer;
}
return this._destroyer = this.panelWin.shutdownCanvasDebugger().then(() => {
// Destroy front to ensure packet handler is removed from client
this.panelWin.gFront.destroy();
--- a/devtools/client/canvasdebugger/snapshotslist.js
+++ b/devtools/client/canvasdebugger/snapshotslist.js
@@ -7,17 +7,17 @@
/**
* Functions handling the recorded animation frame snapshots UI.
*/
var SnapshotsListView = extend(WidgetMethods, {
/**
* Initialization function, called when the tool is started.
*/
- initialize: function () {
+ initialize: function() {
this.widget = new SideMenuWidget($("#snapshots-list"), {
showArrows: true
});
this._onSelect = this._onSelect.bind(this);
this._onClearButtonClick = this._onClearButtonClick.bind(this);
this._onRecordButtonClick = this._onRecordButtonClick.bind(this);
this._onImportButtonClick = this._onImportButtonClick.bind(this);
@@ -29,29 +29,29 @@ var SnapshotsListView = extend(WidgetMet
window.on(EVENTS.SNAPSHOT_RECORDING_FINISHED, this._enableRecordButton);
this.emptyText = L10N.getStr("noSnapshotsText");
this.widget.addEventListener("select", this._onSelect);
},
/**
* Destruction function, called when the tool is closed.
*/
- destroy: function () {
+ destroy: function() {
clearNamedTimeout("canvas-actor-recording");
window.off(EVENTS.SNAPSHOT_RECORDING_FINISHED, this._enableRecordButton);
this.widget.removeEventListener("select", this._onSelect);
},
/**
* Adds a snapshot entry to this container.
*
* @return object
* The newly inserted item.
*/
- addSnapshot: function () {
+ addSnapshot: function() {
let contents = document.createElement("hbox");
contents.className = "snapshot-item";
let thumbnail = document.createElementNS(HTML_NS, "canvas");
thumbnail.className = "snapshot-item-thumbnail";
thumbnail.width = CanvasFront.THUMBNAIL_SIZE;
thumbnail.height = CanvasFront.THUMBNAIL_SIZE;
@@ -97,17 +97,17 @@ var SnapshotsListView = extend(WidgetMet
screenshot: null
}
});
},
/**
* Removes the last snapshot added, in the event no requestAnimationFrame loop was found.
*/
- removeLastSnapshot: function () {
+ removeLastSnapshot: function() {
this.removeAt(this.itemCount - 1);
// If this is the only item, revert back to the empty notice
if (this.itemCount === 0) {
$("#empty-notice").hidden = false;
$("#waiting-notice").hidden = true;
}
},
@@ -116,17 +116,17 @@ var SnapshotsListView = extend(WidgetMet
*
* @param Item snapshotItem
* An item inserted via `SnapshotsListView.addSnapshot`.
* @param object snapshotActor
* The frame snapshot actor received from the backend.
* @param object snapshotOverview
* Additional data about the snapshot received from the backend.
*/
- customizeSnapshot: function (snapshotItem, snapshotActor, snapshotOverview) {
+ customizeSnapshot: function(snapshotItem, snapshotActor, snapshotOverview) {
// Make sure the function call actors are stored on the item,
// to be used when populating the CallsListView.
snapshotItem.attachment.actor = snapshotActor;
let functionCalls = snapshotItem.attachment.calls = snapshotOverview.calls;
let thumbnails = snapshotItem.attachment.thumbnails = snapshotOverview.thumbnails;
let screenshot = snapshotItem.attachment.screenshot = snapshotOverview.screenshot;
let lastThumbnail = thumbnails[thumbnails.length - 1];
@@ -158,33 +158,33 @@ var SnapshotsListView = extend(WidgetMet
if (!this.selectedItem) {
this.selectedIndex = 0;
}
},
/**
* The select listener for this container.
*/
- _onSelect: function ({ detail: snapshotItem }) {
+ _onSelect: function({ detail: snapshotItem }) {
// Check to ensure the attachment has an actor, like
// an in-progress recording.
if (!snapshotItem || !snapshotItem.attachment.actor) {
return;
}
let { calls, thumbnails, screenshot } = snapshotItem.attachment;
$("#reload-notice").hidden = true;
$("#empty-notice").hidden = true;
$("#waiting-notice").hidden = false;
$("#debugging-pane-contents").hidden = true;
$("#screenshot-container").hidden = true;
$("#snapshot-filmstrip").hidden = true;
- (async function () {
+ (async function() {
// Wait for a few milliseconds between presenting the function calls,
// screenshot and thumbnails, to allow each component being
// sequentially drawn. This gives the illusion of snappiness.
await DevToolsUtils.waitForTime(SNAPSHOT_DATA_DISPLAY_DELAY);
CallsListView.showCalls(calls);
$("#debugging-pane-contents").hidden = false;
$("#waiting-notice").hidden = true;
@@ -199,18 +199,18 @@ var SnapshotsListView = extend(WidgetMet
window.emit(EVENTS.SNAPSHOT_RECORDING_SELECTED);
})();
},
/**
* The click listener for the "clear" button in this container.
*/
- _onClearButtonClick: function () {
- (async function () {
+ _onClearButtonClick: function() {
+ (async function() {
SnapshotsListView.empty();
CallsListView.empty();
$("#reload-notice").hidden = true;
$("#empty-notice").hidden = true;
$("#waiting-notice").hidden = true;
if (await gFront.isInitialized()) {
@@ -225,17 +225,17 @@ var SnapshotsListView = extend(WidgetMet
window.emit(EVENTS.SNAPSHOTS_LIST_CLEARED);
})();
},
/**
* The click listener for the "record" button in this container.
*/
- _onRecordButtonClick: function () {
+ _onRecordButtonClick: function() {
this._disableRecordButton();
if (this._recording) {
this._stopRecordingAnimation();
return;
}
// Insert a "dummy" snapshot item in the view, to hint that recording
@@ -251,24 +251,24 @@ var SnapshotsListView = extend(WidgetMet
}
this._recordAnimation();
},
/**
* Makes the record button able to be clicked again.
*/
- _enableRecordButton: function () {
+ _enableRecordButton: function() {
$("#record-snapshot").removeAttribute("disabled");
},
/**
* Makes the record button unable to be clicked.
*/
- _disableRecordButton: function () {
+ _disableRecordButton: function() {
$("#record-snapshot").setAttribute("disabled", true);
},
/**
* Begins recording an animation.
*/
async _recordAnimation() {
if (this._recording) {
@@ -335,28 +335,28 @@ var SnapshotsListView = extend(WidgetMet
window.emit(EVENTS.SNAPSHOT_RECORDING_COMPLETED);
window.emit(EVENTS.SNAPSHOT_RECORDING_FINISHED);
},
/**
* Called as a reject from the front's recordAnimationFrame.
*/
- _onRecordFailure: function () {
+ _onRecordFailure: function() {
clearNamedTimeout("canvas-actor-recording");
showNotification(gToolbox, "canvas-debugger-timeout", L10N.getStr("recordingTimeoutFailure"));
window.emit(EVENTS.SNAPSHOT_RECORDING_CANCELLED);
window.emit(EVENTS.SNAPSHOT_RECORDING_FINISHED);
this.removeLastSnapshot();
},
/**
* The click listener for the "import" button in this container.
*/
- _onImportButtonClick: function () {
+ _onImportButtonClick: function() {
let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
fp.init(window, L10N.getStr("snapshotsList.saveDialogTitle"), Ci.nsIFilePicker.modeOpen);
fp.appendFilter(L10N.getStr("snapshotsList.saveDialogJSONFilter"), "*.json");
fp.appendFilter(L10N.getStr("snapshotsList.saveDialogAllFilter"), "*.*");
fp.open(rv => {
if (rv != Ci.nsIFilePicker.returnOK) {
return;
@@ -392,28 +392,28 @@ var SnapshotsListView = extend(WidgetMet
this.customizeSnapshot(snapshotItem, data.calls, data);
});
});
},
/**
* The click listener for the "save" button of each item in this container.
*/
- _onSaveButtonClick: function (e) {
+ _onSaveButtonClick: function(e) {
let snapshotItem = this.getItemForElement(e.target);
let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
fp.init(window, L10N.getStr("snapshotsList.saveDialogTitle"), Ci.nsIFilePicker.modeSave);
fp.appendFilter(L10N.getStr("snapshotsList.saveDialogJSONFilter"), "*.json");
fp.appendFilter(L10N.getStr("snapshotsList.saveDialogAllFilter"), "*.*");
fp.defaultString = "snapshot.json";
// Start serializing all the function call actors for the specified snapshot,
// while the nsIFilePicker dialog is being opened. Snappy.
- let serialized = (async function () {
+ let serialized = (async function() {
let data = {
fileType: CALLS_LIST_SERIALIZER_IDENTIFIER,
version: CALLS_LIST_SERIALIZER_VERSION,
calls: [],
thumbnails: [],
screenshot: null
};
let functionCalls = snapshotItem.attachment.calls;
@@ -443,18 +443,18 @@ var SnapshotsListView = extend(WidgetMet
data.thumbnails.push({ index, width, height, flipped, pixels });
});
// Prepare the screenshot for serialization.
let { index, width, height, flipped, pixels } = screenshot;
data.screenshot = { index, width, height, flipped, pixels };
let string = JSON.stringify(data);
- let converter = Cc["@mozilla.org/intl/scriptableunicodeconverter"].
- createInstance(Ci.nsIScriptableUnicodeConverter);
+ let converter = Cc["@mozilla.org/intl/scriptableunicodeconverter"]
+ .createInstance(Ci.nsIScriptableUnicodeConverter);
converter.charset = "UTF-8";
return converter.convertToInputStream(string);
})();
// Open the nsIFilePicker and wait for the function call actors to finish
// being serialized, in order to save the generated JSON data to disk.
fp.open({ done: result => {
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-04.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-04.js
@@ -16,17 +16,19 @@ async function ifTestingSupported() {
await reload(target);
let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
SnapshotsListView._onRecordButtonClick();
// Wait until after the recording started to trigger the content.
// Use the gFront method rather than the SNAPSHOT_RECORDING_STARTED event
// which triggers before the underlying actor call
- await waitUntil(async function () { return !(await gFront.isRecording()); });
+ await waitUntil(async function() {
+ return !(await gFront.isRecording());
+ });
// Start animation in content
evalInDebuggee("start();");
await recordingFinished;
ok(true, "Finished recording a snapshot of the animation loop.");
await removeTab(target.tab);
--- a/devtools/client/canvasdebugger/test/browser_profiling-webgl.js
+++ b/devtools/client/canvasdebugger/test/browser_profiling-webgl.js
@@ -50,38 +50,38 @@ async function ifTestingSupported() {
ok(true, "The front was setup up successfully.");
await navigated;
ok(true, "Target automatically navigated when the front was set up.");
snapshotActor = await front.recordAnimationFrame();
ok(snapshotActor,
"A snapshot actor was sent after recording.");
-
+
animationOverview = await snapshotActor.getOverview();
ok(animationOverview,
"An animation overview could be retrieved after recording.");
-
+
functionCalls = animationOverview.calls;
ok(functionCalls,
"An array of function call actors was sent after recording.");
-
+
testFunctionCallTimestamp(functionCalls, currentTime);
-
+
info("Check triangle and vertex counts in drawElements()");
is(animationOverview.primitive.tris, 5, "The count of triangles is correct.");
is(animationOverview.primitive.vertices, 26, "The count of vertices is correct.");
is(animationOverview.primitive.points, 4, "The count of points is correct.");
is(animationOverview.primitive.lines, 8, "The count of lines is correct.");
-
+
await removeTab(target.tab);
finish();
}
function testFunctionCallTimestamp(functionCalls, currentTime) {
info("Check the timestamps of function calls");
- for ( let i = 0; i < functionCalls.length-1; i += 2 ) {
- ok( functionCalls[i].timestamp > 0, "The timestamp of the called function is larger than 0." );
- ok( functionCalls[i].timestamp < currentTime, "The timestamp has been minus the frame start time." );
- ok( functionCalls[i+1].timestamp >= functionCalls[i].timestamp, "The timestamp of the called function is correct." );
+ for (let i = 0; i < functionCalls.length - 1; i += 2) {
+ ok(functionCalls[i].timestamp > 0, "The timestamp of the called function is larger than 0.");
+ ok(functionCalls[i].timestamp < currentTime, "The timestamp has been minus the frame start time.");
+ ok(functionCalls[i + 1].timestamp >= functionCalls[i].timestamp, "The timestamp of the called function is correct.");
}
}
--- a/devtools/client/canvasdebugger/test/doc_raf-begin.html
+++ b/devtools/client/canvasdebugger/test/doc_raf-begin.html
@@ -24,13 +24,15 @@
function drawScene() {
window.requestAnimationFrame(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]);
}
- function start () { window.requestAnimationFrame(drawScene); }
+ function start() {
+ window.requestAnimationFrame(drawScene);
+}
</script>
</body>
</html>
--- a/devtools/client/canvasdebugger/test/doc_raf-no-canvas.html
+++ b/devtools/client/canvasdebugger/test/doc_raf-no-canvas.html
@@ -5,14 +5,16 @@
<html>
<head>
<meta charset="utf-8"/>
<title>Canvas inspector test page</title>
</head>
<body>
<script>
- function render () { window.requestAnimationFrame(render); }
+ function render() {
+ window.requestAnimationFrame(render);
+}
window.requestAnimationFrame(render);
</script>
</body>
</html>
--- a/devtools/client/canvasdebugger/test/doc_webgl-bindings.html
+++ b/devtools/client/canvasdebugger/test/doc_webgl-bindings.html
@@ -43,17 +43,17 @@
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, customTexture, 0);
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, customRenderbuffer);
gl.viewport(128, 256, 384, 512);
gl.clearColor(0.0, 1.0, 0.0, 1.0);
gl.clear(gl.COLOR_BUFFER_BIT);
drawScene();
- }
+ };
function drawScene() {
gl.clearColor(0.0, 0.0, 1.0, 1.0);
gl.clear(gl.COLOR_BUFFER_BIT);
window.requestAnimationFrame(drawScene);
}
</script>
</body>
--- a/devtools/client/canvasdebugger/test/doc_webgl-drawArrays.html
+++ b/devtools/client/canvasdebugger/test/doc_webgl-drawArrays.html
@@ -26,115 +26,115 @@
gl_Position = vec4(aVertexPosition, 1.0);
}
</script>
<script type="text/javascript">
"use strict";
let canvas, gl, shaderProgram;
let triangleVertexPositionBuffer, squareVertexPositionBuffer;
-
+
window.onload = function() {
canvas = document.querySelector("canvas");
gl = canvas.getContext("webgl", { preserveDrawingBuffer: true });
gl.viewportWidth = canvas.width;
gl.viewportHeight = canvas.height;
-
+
initShaders();
initBuffers();
gl.viewport(0, 0, gl.viewportWidth, gl.viewportHeight);
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.disable(gl.DEPTH_TEST);
drawScene();
- }
+ };
function getShader(gl, id) {
var shaderScript = document.getElementById(id);
if (!shaderScript) {
- return null;
+ return null;
}
var str = "";
var k = shaderScript.firstChild;
while (k) {
- if (k.nodeType == 3) {
- str += k.textContent;
- }
- k = k.nextSibling;
+ if (k.nodeType == 3) {
+ str += k.textContent;
+ }
+ k = k.nextSibling;
}
var shader;
if (shaderScript.type == "x-shader/x-fragment") {
- shader = gl.createShader(gl.FRAGMENT_SHADER);
+ shader = gl.createShader(gl.FRAGMENT_SHADER);
} else if (shaderScript.type == "x-shader/x-vertex") {
- shader = gl.createShader(gl.VERTEX_SHADER);
+ shader = gl.createShader(gl.VERTEX_SHADER);
} else {
- return null;
+ return null;
}
gl.shaderSource(shader, str);
gl.compileShader(shader);
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
- alert(gl.getShaderInfoLog(shader));
- return null;
+ alert(gl.getShaderInfoLog(shader));
+ return null;
}
return shader;
}
function initShaders() {
var fragmentShader = getShader(gl, "shader-fs");
var vertexShader = getShader(gl, "shader-vs");
shaderProgram = gl.createProgram();
gl.attachShader(shaderProgram, vertexShader);
gl.attachShader(shaderProgram, fragmentShader);
gl.linkProgram(shaderProgram);
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
- alert("Could not initialise shaders");
+ alert("Could not initialise shaders");
}
gl.useProgram(shaderProgram);
shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
shaderProgram.pMaterialColor = gl.getUniformLocation(shaderProgram, "mtrColor");
gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
}
function initBuffers() {
// Create triangle vertex/index buffer
- triangleVertexPositionBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer);
- var vertices = [
+ triangleVertexPositionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer);
+ var vertices = [
0.0, 0.5, 0.0,
- -0.5, -0.5, 0.0,
+ -0.5, -0.5, 0.0,
0.5, -0.5, 0.0
- ];
- gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
- triangleVertexPositionBuffer.itemSize = 3;
- triangleVertexPositionBuffer.numItems = 3;
+ ];
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+ triangleVertexPositionBuffer.itemSize = 3;
+ triangleVertexPositionBuffer.numItems = 3;
// Create square vertex/index buffer
- squareVertexPositionBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer);
- vertices = [
+ squareVertexPositionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer);
+ vertices = [
0.8, 0.8, 0.0,
- -0.8, 0.8, 0.0,
+ -0.8, 0.8, 0.0,
0.8, -0.8, 0.0,
- -0.8, -0.8, 0.0
- ];
- gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
- squareVertexPositionBuffer.itemSize = 3;
- squareVertexPositionBuffer.numItems = 4;
+ -0.8, -0.8, 0.0
+ ];
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+ squareVertexPositionBuffer.itemSize = 3;
+ squareVertexPositionBuffer.numItems = 4;
}
- function drawScene() {
+ function drawScene() {
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
// DrawArrays
// --------------
// draw square - triangle strip
gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer);
gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, squareVertexPositionBuffer.itemSize, gl.FLOAT, false, 0, 0);
gl.uniform4f(shaderProgram.pMaterialColor, 1, 1, 1, 1);
--- a/devtools/client/canvasdebugger/test/doc_webgl-drawElements.html
+++ b/devtools/client/canvasdebugger/test/doc_webgl-drawElements.html
@@ -27,142 +27,141 @@
}
</script>
<script type="text/javascript">
"use strict";
let canvas, gl, shaderProgram;
let triangleVertexPositionBuffer, squareVertexPositionBuffer;
let triangleIndexBuffer;
- let squareIndexBuffer, squareStripIndexBuffer, squareFanIndexBuffer
-
+ let squareIndexBuffer, squareStripIndexBuffer, squareFanIndexBuffer;
+
window.onload = function() {
canvas = document.querySelector("canvas");
gl = canvas.getContext("webgl", { preserveDrawingBuffer: true });
gl.viewportWidth = canvas.width;
gl.viewportHeight = canvas.height;
-
+
initShaders();
initBuffers();
gl.viewport(0, 0, gl.viewportWidth, gl.viewportHeight);
gl.clearColor(0.0, 0.0, 0.0, 1.0);
gl.disable(gl.DEPTH_TEST);
drawScene();
- }
+ };
function getShader(gl, id) {
var shaderScript = document.getElementById(id);
if (!shaderScript) {
- return null;
+ return null;
}
var str = "";
var k = shaderScript.firstChild;
while (k) {
- if (k.nodeType == 3) {
- str += k.textContent;
- }
- k = k.nextSibling;
+ if (k.nodeType == 3) {
+ str += k.textContent;
+ }
+ k = k.nextSibling;
}
var shader;
if (shaderScript.type == "x-shader/x-fragment") {
- shader = gl.createShader(gl.FRAGMENT_SHADER);
+ shader = gl.createShader(gl.FRAGMENT_SHADER);
} else if (shaderScript.type == "x-shader/x-vertex") {
- shader = gl.createShader(gl.VERTEX_SHADER);
+ shader = gl.createShader(gl.VERTEX_SHADER);
} else {
- return null;
+ return null;
}
gl.shaderSource(shader, str);
gl.compileShader(shader);
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
- alert(gl.getShaderInfoLog(shader));
- return null;
+ alert(gl.getShaderInfoLog(shader));
+ return null;
}
return shader;
}
function initShaders() {
var fragmentShader = getShader(gl, "shader-fs");
var vertexShader = getShader(gl, "shader-vs");
shaderProgram = gl.createProgram();
gl.attachShader(shaderProgram, vertexShader);
gl.attachShader(shaderProgram, fragmentShader);
gl.linkProgram(shaderProgram);
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) {
- alert("Could not initialise shaders");
+ alert("Could not initialise shaders");
}
gl.useProgram(shaderProgram);
shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
shaderProgram.pMaterialColor = gl.getUniformLocation(shaderProgram, "mtrColor");
gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
}
function initBuffers() {
// Create triangle vertex/index buffer
- triangleVertexPositionBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer);
- var vertices = [
+ triangleVertexPositionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer);
+ var vertices = [
0.0, 0.5, 0.0,
- -0.5, -0.5, 0.0,
+ -0.5, -0.5, 0.0,
0.5, -0.5, 0.0
- ];
- gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
- triangleVertexPositionBuffer.itemSize = 3;
- triangleVertexPositionBuffer.numItems = 3;
+ ];
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+ triangleVertexPositionBuffer.itemSize = 3;
+ triangleVertexPositionBuffer.numItems = 3;
- triangleIndexBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, triangleIndexBuffer);
- var indices = [
+ triangleIndexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, triangleIndexBuffer);
+ var indices = [
0, 1, 2
- ];
- gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
- triangleIndexBuffer.itemSize = 1;
- triangleIndexBuffer.numItems = 3;
+ ];
+ gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
+ triangleIndexBuffer.itemSize = 1;
+ triangleIndexBuffer.numItems = 3;
// Create square vertex/index buffer
- squareVertexPositionBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer);
- vertices = [
+ squareVertexPositionBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer);
+ vertices = [
0.8, 0.8, 0.0,
- -0.8, 0.8, 0.0,
+ -0.8, 0.8, 0.0,
0.8, -0.8, 0.0,
- -0.8, -0.8, 0.0
- ];
- gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
- squareVertexPositionBuffer.itemSize = 3;
- squareVertexPositionBuffer.numItems = 4;
+ -0.8, -0.8, 0.0
+ ];
+ gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
+ squareVertexPositionBuffer.itemSize = 3;
+ squareVertexPositionBuffer.numItems = 4;
- squareIndexBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);
- indices = [
+ squareIndexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareIndexBuffer);
+ indices = [
0, 1, 2,
1, 3, 2
- ];
- gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
- squareIndexBuffer.itemSize = 1;
- squareIndexBuffer.numItems = 6;
+ ];
+ gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
+ squareIndexBuffer.itemSize = 1;
+ squareIndexBuffer.numItems = 6;
- squareStripIndexBuffer = gl.createBuffer();
- gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareStripIndexBuffer);
- indices = [
+ squareStripIndexBuffer = gl.createBuffer();
+ gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, squareStripIndexBuffer);
+ indices = [
0, 1, 2, 3
- ];
- gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
- squareStripIndexBuffer.itemSize = 1;
- squareStripIndexBuffer.numItems = 4;
-
+ ];
+ gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
+ squareStripIndexBuffer.itemSize = 1;
+ squareStripIndexBuffer.numItems = 4;
}
function drawScene() {
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
// DrawElements
// --------------
// draw triangle
--- a/devtools/client/canvasdebugger/test/doc_webgl-enum.html
+++ b/devtools/client/canvasdebugger/test/doc_webgl-enum.html
@@ -16,17 +16,17 @@
let canvas, gl;
window.onload = function() {
canvas = document.querySelector("canvas");
gl = canvas.getContext("webgl", { preserveDrawingBuffer: true });
gl.clearColor(0.0, 0.0, 0.0, 1.0);
drawScene();
- }
+ };
function drawScene() {
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
gl.bindTexture(gl.TEXTURE_2D, null);
window.requestAnimationFrame(drawScene);
}
</script>
</body>
--- a/devtools/client/canvasdebugger/test/head.js
+++ b/devtools/client/canvasdebugger/test/head.js
@@ -67,17 +67,17 @@ function ifTestingUnsupported() {
todo(false, "Skipping test because some required functionality isn't supported.");
finish();
}
async function test() {
let generator = isTestingSupported() ? ifTestingSupported : ifTestingUnsupported;
try {
await generator();
- } catch(e) {
+ } catch (e) {
handleError(e);
}
}
function createCanvas() {
return document.createElementNS("http://www.w3.org/1999/xhtml", "canvas");
}
@@ -113,46 +113,46 @@ function initServer() {
DebuggerServer.init();
DebuggerServer.registerAllActors();
}
function initCallWatcherBackend(aUrl) {
info("Initializing a call watcher front.");
initServer();
- return (async function () {
+ return (async function() {
let tab = await addTab(aUrl);
let target = TargetFactory.forTab(tab);
await target.makeRemote();
let front = new CallWatcherFront(target.client, target.form);
return { target, front };
})();
}
function initCanvasDebuggerBackend(aUrl) {
info("Initializing a canvas debugger front.");
initServer();
- return (async function () {
+ return (async function() {
let tab = await addTab(aUrl);
let target = TargetFactory.forTab(tab);
await target.makeRemote();
let front = new CanvasFront(target.client, target.form);
return { target, front };
})();
}
function initCanvasDebuggerFrontend(aUrl) {
info("Initializing a canvas debugger pane.");
- return (async function () {
+ return (async function() {
let tab = await addTab(aUrl);
let target = TargetFactory.forTab(tab);
await target.makeRemote();
Services.prefs.setBoolPref("devtools.canvasdebugger.enabled", true);
let toolbox = await gDevTools.showToolbox(target, "canvasdebugger");
let panel = toolbox.getCurrentPanel();