Magic-Mirror/gecko-dev
1
0
Fork 0
mirror of https://github.com/mozilla/gecko-dev.git synced 2024-10-21 01:05:45 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Backed out changeset 610872970d04 (bug 1444033) for ES lint failure in /builds/worker/checkouts/gecko/devtools/client/inspector/test/head.js on a CLOSED TREE

Browse Source
This commit is contained in:
Margareta Eliza Balazs 2018-03-23 02:06:53 +02:00
parent ab44d98e0d
commit cdccb66d47
548 changed files with 6181 additions and 6165 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
devtools/client/inspector/boxmodel/box-model.js
View File

@ -4,6 +4,7 @@
"use strict";
const { Task } = require("devtools/shared/task");
const { getCssProperties } = require("devtools/shared/fronts/css-properties");
const { InplaceEditor } = require("devtools/client/shared/inplace-editor");
@ -124,7 +125,7 @@ BoxModel.prototype = {
this._updateReasons.push(reason);
}
let lastRequest = ((async function() {
let lastRequest = Task.spawn((function* () {
if (!this.inspector ||
!this.isPanelVisible() ||
!this.inspector.selection.isConnected() ||
@ -134,11 +135,11 @@ BoxModel.prototype = {
let node = this.inspector.selection.nodeFront;
let layout = await this.inspector.pageStyle.getLayout(node, {
let layout = yield this.inspector.pageStyle.getLayout(node, {
autoMargins: true,
});
let styleEntries = await this.inspector.pageStyle.getApplied(node, {
let styleEntries = yield this.inspector.pageStyle.getApplied(node, {
// We don't need styles applied to pseudo elements of the current node.
skipPseudo: true
});
@ -146,18 +147,18 @@ BoxModel.prototype = {
// Update the layout properties with whether or not the element's position is
// editable with the geometry editor.
let isPositionEditable = await this.inspector.pageStyle.isPositionEditable(node);
let isPositionEditable = yield this.inspector.pageStyle.isPositionEditable(node);
layout = Object.assign({}, layout, {
isPositionEditable,
});
const actorCanGetOffSetParent =
await this.inspector.target.actorHasMethod("domwalker", "getOffsetParent");
yield this.inspector.target.actorHasMethod("domwalker", "getOffsetParent");
if (actorCanGetOffSetParent) {
// Update the redux store with the latest offset parent DOM node
let offsetParent = await this.inspector.walker.getOffsetParent(node);
let offsetParent = yield this.inspector.walker.getOffsetParent(node);
this.store.dispatch(updateOffsetParent(offsetParent));
}
@ -176,7 +177,7 @@ BoxModel.prototype = {
this._updateReasons = [];
return null;
}).bind(this))().catch(console.error);
}).bind(this)).catch(console.error);
this._lastRequest = lastRequest;
},

20
devtools/client/inspector/boxmodel/test/browser_boxmodel.js
View File

@ -150,21 +150,21 @@ var res2 = [
},
];
add_task(async function() {
add_task(function* () {
let style = "div { position: absolute; top: 42px; left: 42px; " +
"height: 100.111px; width: 100px; border: 10px solid black; " +
"padding: 20px; margin: 30px auto;}";
let html = "<style>" + style + "</style><div></div>";
await addTab("data:text/html," + encodeURIComponent(html));
let {inspector, boxmodel, testActor} = await openLayoutView();
await selectNode("div", inspector);
yield addTab("data:text/html," + encodeURIComponent(html));
let {inspector, boxmodel, testActor} = yield openLayoutView();
yield selectNode("div", inspector);
await testInitialValues(inspector, boxmodel);
await testChangingValues(inspector, boxmodel, testActor);
yield testInitialValues(inspector, boxmodel);
yield testChangingValues(inspector, boxmodel, testActor);
});
function testInitialValues(inspector, boxmodel) {
function* testInitialValues(inspector, boxmodel) {
info("Test that the initial values of the box model are correct");
let doc = boxmodel.document;
@ -175,14 +175,14 @@ function testInitialValues(inspector, boxmodel) {
}
}
async function testChangingValues(inspector, boxmodel, testActor) {
function* testChangingValues(inspector, boxmodel, testActor) {
info("Test that changing the document updates the box model");
let doc = boxmodel.document;
let onUpdated = waitForUpdate(inspector);
await testActor.setAttribute("div", "style",
yield testActor.setAttribute("div", "style",
"height:150px;padding-right:50px;top:50px");
await onUpdated;
yield onUpdated;
for (let i = 0; i < res2.length; i++) {
let elt = doc.querySelector(res2[i].selector);

10
devtools/client/inspector/boxmodel/test/browser_boxmodel_edit-position-visible-position-change.js
View File

@ -16,11 +16,11 @@ const TEST_URI = `
height:100px">
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
await selectNode("#mydiv", inspector);
yield selectNode("#mydiv", inspector);
let editPositionButton = boxmodel.document.querySelector(".layout-geometry-editor");
ok(isNodeVisible(editPositionButton), "Edit Position button is visible initially");
@ -37,7 +37,7 @@ add_task(async function() {
EventUtils.synthesizeKey("8", {}, boxmodel.document.defaultView);
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
await onUpdate;
yield onUpdate;
editPositionButton = boxmodel.document.querySelector(".layout-geometry-editor");
ok(isNodeVisible(editPositionButton),
"Edit Position button is still visible after layout change");

90
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel.js
View File

@ -17,28 +17,28 @@ const TEST_URI = "<style>" +
"<div id='div1'></div><div id='div2'></div>" +
"<div id='div3'></div><div id='div4'></div>";
add_task(async function() {
add_task(function* () {
// Make sure the toolbox is tall enough to have empty space below the
// boxmodel-container.
await pushPref("devtools.toolbox.footer.height", 500);
yield pushPref("devtools.toolbox.footer.height", 500);
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = await openLayoutView();
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = yield openLayoutView();
await testEditingMargins(inspector, boxmodel, testActor);
await testKeyBindings(inspector, boxmodel, testActor);
await testEscapeToUndo(inspector, boxmodel, testActor);
await testDeletingValue(inspector, boxmodel, testActor);
await testRefocusingOnClick(inspector, boxmodel, testActor);
yield testEditingMargins(inspector, boxmodel, testActor);
yield testKeyBindings(inspector, boxmodel, testActor);
yield testEscapeToUndo(inspector, boxmodel, testActor);
yield testDeletingValue(inspector, boxmodel, testActor);
yield testRefocusingOnClick(inspector, boxmodel, testActor);
});
async function testEditingMargins(inspector, boxmodel, testActor) {
function* testEditingMargins(inspector, boxmodel, testActor) {
info("Test that editing margin dynamically updates the document, pressing " +
"escape cancels the changes");
is((await getStyle(testActor, "#div1", "margin-top")), "",
is((yield getStyle(testActor, "#div1", "margin-top")), "",
"Should be no margin-top on the element.");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-top > span");
is(span.textContent, 5, "Should have the right value in the box model.");
@ -49,26 +49,26 @@ async function testEditingMargins(inspector, boxmodel, testActor) {
is(editor.value, "5px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("3", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "margin-top")), "3px",
is((yield getStyle(testActor, "#div1", "margin-top")), "3px",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_ESCAPE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "margin-top")), "",
is((yield getStyle(testActor, "#div1", "margin-top")), "",
"Should be no margin-top on the element.");
is(span.textContent, 5, "Should have the right value in the box model.");
}
async function testKeyBindings(inspector, boxmodel, testActor) {
function* testKeyBindings(inspector, boxmodel, testActor) {
info("Test that arrow keys work correctly and pressing enter commits the " +
"changes");
is((await getStyle(testActor, "#div1", "margin-left")), "",
is((yield getStyle(testActor, "#div1", "margin-left")), "",
"Should be no margin-top on the element.");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-left > span");
is(span.textContent, 10, "Should have the right value in the box model.");
@ -79,39 +79,39 @@ async function testKeyBindings(inspector, boxmodel, testActor) {
is(editor.value, "10px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_UP", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "11px", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "margin-left")), "11px",
is((yield getStyle(testActor, "#div1", "margin-left")), "11px",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_DOWN", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "10px", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "margin-left")), "10px",
is((yield getStyle(testActor, "#div1", "margin-left")), "10px",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_UP", { shiftKey: true }, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "20px", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "margin-left")), "20px",
is((yield getStyle(testActor, "#div1", "margin-left")), "20px",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div1", "margin-left")), "20px",
is((yield getStyle(testActor, "#div1", "margin-left")), "20px",
"Should be the right margin-top on the element.");
is(span.textContent, 20, "Should have the right value in the box model.");
}
async function testEscapeToUndo(inspector, boxmodel, testActor) {
function* testEscapeToUndo(inspector, boxmodel, testActor) {
info("Test that deleting the value removes the property but escape undoes " +
"that");
is((await getStyle(testActor, "#div1", "margin-left")), "20px",
is((yield getStyle(testActor, "#div1", "margin-left")), "20px",
"Should be the right margin-top on the element.");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-left > span");
is(span.textContent, 20, "Should have the right value in the box model.");
@ -122,27 +122,27 @@ async function testEscapeToUndo(inspector, boxmodel, testActor) {
is(editor.value, "20px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_DELETE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "margin-left")), "",
is((yield getStyle(testActor, "#div1", "margin-left")), "",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_ESCAPE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "margin-left")), "20px",
is((yield getStyle(testActor, "#div1", "margin-left")), "20px",
"Should be the right margin-top on the element.");
is(span.textContent, 20, "Should have the right value in the box model.");
}
async function testDeletingValue(inspector, boxmodel, testActor) {
function* testDeletingValue(inspector, boxmodel, testActor) {
info("Test that deleting the value removes the property");
await setStyle(testActor, "#div1", "marginRight", "15px");
await waitForUpdate(inspector);
yield setStyle(testActor, "#div1", "marginRight", "15px");
yield waitForUpdate(inspector);
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-right > span");
is(span.textContent, 15, "Should have the right value in the box model.");
@ -153,23 +153,23 @@ async function testDeletingValue(inspector, boxmodel, testActor) {
is(editor.value, "15px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_DELETE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "margin-right")), "",
is((yield getStyle(testActor, "#div1", "margin-right")), "",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div1", "margin-right")), "",
is((yield getStyle(testActor, "#div1", "margin-right")), "",
"Should be the right margin-top on the element.");
is(span.textContent, 10, "Should have the right value in the box model.");
}
async function testRefocusingOnClick(inspector, boxmodel, testActor) {
function* testRefocusingOnClick(inspector, boxmodel, testActor) {
info("Test that clicking in the editor input does not remove focus");
await selectNode("#div4", inspector);
yield selectNode("#div4", inspector);
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-top > span");
is(span.textContent, 1, "Should have the right value in the box model.");
@ -185,14 +185,14 @@ async function testRefocusingOnClick(inspector, boxmodel, testActor) {
info("Check the input can still be used as expected");
EventUtils.synthesizeKey("VK_UP", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "2px", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div4", "margin-top")), "2px",
is((yield getStyle(testActor, "#div4", "margin-top")), "2px",
"Should have updated the margin.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div4", "margin-top")), "2px",
is((yield getStyle(testActor, "#div4", "margin-top")), "2px",
"Should be the right margin-top on the element.");
is(span.textContent, 2, "Should have the right value in the box model.");
}

70
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel_allproperties.js
View File

@ -14,23 +14,23 @@ const TEST_URI = "<style>" +
"</style>" +
"<div id='div1'></div><div id='div2'></div><div id='div3'></div>";
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = yield openLayoutView();
await testEditing(inspector, boxmodel, testActor);
await testEditingAndCanceling(inspector, boxmodel, testActor);
await testDeleting(inspector, boxmodel, testActor);
await testDeletingAndCanceling(inspector, boxmodel, testActor);
yield testEditing(inspector, boxmodel, testActor);
yield testEditingAndCanceling(inspector, boxmodel, testActor);
yield testDeleting(inspector, boxmodel, testActor);
yield testDeletingAndCanceling(inspector, boxmodel, testActor);
});
async function testEditing(inspector, boxmodel, testActor) {
function* testEditing(inspector, boxmodel, testActor) {
info("When all properties are set on the node editing one should work");
await setStyle(testActor, "#div1", "padding", "5px");
await waitForUpdate(inspector);
yield setStyle(testActor, "#div1", "padding", "5px");
yield waitForUpdate(inspector);
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-bottom > span");
is(span.textContent, 5, "Should have the right value in the box model.");
@ -41,27 +41,27 @@ async function testEditing(inspector, boxmodel, testActor) {
is(editor.value, "5px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("7", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "7", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "padding-bottom")), "7px",
is((yield getStyle(testActor, "#div1", "padding-bottom")), "7px",
"Should have updated the padding");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div1", "padding-bottom")), "7px",
is((yield getStyle(testActor, "#div1", "padding-bottom")), "7px",
"Should be the right padding.");
is(span.textContent, 7, "Should have the right value in the box model.");
}
async function testEditingAndCanceling(inspector, boxmodel, testActor) {
function* testEditingAndCanceling(inspector, boxmodel, testActor) {
info("When all properties are set on the node editing one and then " +
"cancelling with ESCAPE should work");
await setStyle(testActor, "#div1", "padding", "5px");
await waitForUpdate(inspector);
yield setStyle(testActor, "#div1", "padding", "5px");
yield waitForUpdate(inspector);
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-left > span");
is(span.textContent, 5, "Should have the right value in the box model.");
@ -72,24 +72,24 @@ async function testEditingAndCanceling(inspector, boxmodel, testActor) {
is(editor.value, "5px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("8", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "8", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "padding-left")), "8px",
is((yield getStyle(testActor, "#div1", "padding-left")), "8px",
"Should have updated the padding");
EventUtils.synthesizeKey("VK_ESCAPE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "padding-left")), "5px",
is((yield getStyle(testActor, "#div1", "padding-left")), "5px",
"Should be the right padding.");
is(span.textContent, 5, "Should have the right value in the box model.");
}
async function testDeleting(inspector, boxmodel, testActor) {
function* testDeleting(inspector, boxmodel, testActor) {
info("When all properties are set on the node deleting one should work");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-left > span");
is(span.textContent, 5, "Should have the right value in the box model.");
@ -100,27 +100,27 @@ async function testDeleting(inspector, boxmodel, testActor) {
is(editor.value, "5px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_DELETE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "padding-left")), "",
is((yield getStyle(testActor, "#div1", "padding-left")), "",
"Should have updated the padding");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div1", "padding-left")), "",
is((yield getStyle(testActor, "#div1", "padding-left")), "",
"Should be the right padding.");
is(span.textContent, 3, "Should have the right value in the box model.");
}
async function testDeletingAndCanceling(inspector, boxmodel, testActor) {
function* testDeletingAndCanceling(inspector, boxmodel, testActor) {
info("When all properties are set on the node deleting one then cancelling " +
"should work");
await setStyle(testActor, "#div1", "padding", "5px");
await waitForUpdate(inspector);
yield setStyle(testActor, "#div1", "padding", "5px");
yield waitForUpdate(inspector);
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-left > span");
is(span.textContent, 5, "Should have the right value in the box model.");
@ -131,16 +131,16 @@ async function testDeletingAndCanceling(inspector, boxmodel, testActor) {
is(editor.value, "5px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_DELETE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "padding-left")), "",
is((yield getStyle(testActor, "#div1", "padding-left")), "",
"Should have updated the padding");
EventUtils.synthesizeKey("VK_ESCAPE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "padding-left")), "5px",
is((yield getStyle(testActor, "#div1", "padding-left")), "5px",
"Should be the right padding.");
is(span.textContent, 5, "Should have the right value in the box model.");
}

22
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel_bluronclick.js
View File

@ -15,20 +15,20 @@ const TEST_URI =
</style>
<div id="div1"></div>`;
add_task(async function() {
add_task(function* () {
// Make sure the toolbox is tall enough to have empty space below the
// boxmodel-container.
await pushPref("devtools.toolbox.footer.height", 500);
yield pushPref("devtools.toolbox.footer.height", 500);
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
await selectNode("#div1", inspector);
await testClickingOutsideEditor(boxmodel);
await testClickingBelowContainer(boxmodel);
yield selectNode("#div1", inspector);
yield testClickingOutsideEditor(boxmodel);
yield testClickingBelowContainer(boxmodel);
});
async function testClickingOutsideEditor(boxmodel) {
function* testClickingOutsideEditor(boxmodel) {
info("Test that clicking outside the editor blurs it");
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-top > span");
is(span.textContent, 10, "Should have the right value in the box model.");
@ -42,13 +42,13 @@ async function testClickingOutsideEditor(boxmodel) {
let rect = editor.getBoundingClientRect();
EventUtils.synthesizeMouse(editor, rect.width + 10, rect.height / 2, {},
boxmodel.document.defaultView);
await onBlur;
yield onBlur;
is(boxmodel.document.querySelector(".styleinspector-propertyeditor"), null,
"Inplace editor has been removed.");
}
async function testClickingBelowContainer(boxmodel) {
function* testClickingBelowContainer(boxmodel) {
info("Test that clicking below the box-model container blurs it");
let span = boxmodel.document.querySelector(".boxmodel-margin.boxmodel-top > span");
is(span.textContent, 10, "Should have the right value in the box model.");
@ -67,7 +67,7 @@ async function testClickingBelowContainer(boxmodel) {
bounds.left + 10,
bounds.top + bounds.height + 10,
{}, boxmodel.document.defaultView);
await onBlur;
yield onBlur;
is(boxmodel.document.querySelector(".styleinspector-propertyeditor"), null,
"Inplace editor has been removed.");

24
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel_border.js
View File

@ -14,15 +14,15 @@ const TEST_URI = "<style>" +
"</style>" +
"<div id='div1'></div><div id='div2'></div><div id='div3'></div>";
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = yield openLayoutView();
is((await getStyle(testActor, "#div1", "border-top-width")), "",
is((yield getStyle(testActor, "#div1", "border-top-width")), "",
"Should have the right border");
is((await getStyle(testActor, "#div1", "border-top-style")), "",
is((yield getStyle(testActor, "#div1", "border-top-style")), "",
"Should have the right border");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-border.boxmodel-top > span");
is(span.textContent, 0, "Should have the right value in the box model.");
@ -33,20 +33,20 @@ add_task(async function() {
is(editor.value, "0", "Should have the right value in the editor.");
EventUtils.synthesizeKey("1", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "1", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "border-top-width")), "1px",
is((yield getStyle(testActor, "#div1", "border-top-width")), "1px",
"Should have the right border");
is((await getStyle(testActor, "#div1", "border-top-style")), "solid",
is((yield getStyle(testActor, "#div1", "border-top-style")), "solid",
"Should have the right border");
EventUtils.synthesizeKey("VK_ESCAPE", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "border-top-width")), "",
is((yield getStyle(testActor, "#div1", "border-top-width")), "",
"Should be the right padding.");
is((await getStyle(testActor, "#div1", "border-top-style")), "",
is((yield getStyle(testActor, "#div1", "border-top-style")), "",
"Should have the right border");
is(span.textContent, 0, "Should have the right value in the box model.");
});

24
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel_pseudo.js
View File

@ -20,30 +20,30 @@ const TEST_URI =
<div class=test></div>
</div>`;
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = yield openLayoutView();
await selectNode(".test", inspector);
yield selectNode(".test", inspector);
// No margin-top defined.
info("Test that margins are not impacted by a pseudo element");
is((await getStyle(testActor, ".test", "margin-top")), "", "margin-top is correct");
await checkValueInBoxModel(".boxmodel-margin.boxmodel-top", "0", boxmodel.document);
is((yield getStyle(testActor, ".test", "margin-top")), "", "margin-top is correct");
yield checkValueInBoxModel(".boxmodel-margin.boxmodel-top", "0", boxmodel.document);
// No padding-top defined.
info("Test that paddings are not impacted by a pseudo element");
is((await getStyle(testActor, ".test", "padding-top")), "", "padding-top is correct");
await checkValueInBoxModel(".boxmodel-padding.boxmodel-top", "0", boxmodel.document);
is((yield getStyle(testActor, ".test", "padding-top")), "", "padding-top is correct");
yield checkValueInBoxModel(".boxmodel-padding.boxmodel-top", "0", boxmodel.document);
// Width should be driven by the parent div.
info("Test that dimensions are not impacted by a pseudo element");
is((await getStyle(testActor, ".test", "width")), "", "width is correct");
await checkValueInBoxModel(".boxmodel-content.boxmodel-width", "200",
is((yield getStyle(testActor, ".test", "width")), "", "width is correct");
yield checkValueInBoxModel(".boxmodel-content.boxmodel-width", "200",
boxmodel.document);
});
async function checkValueInBoxModel(selector, expectedValue, doc) {
function* checkValueInBoxModel(selector, expectedValue, doc) {
let span = doc.querySelector(selector + " > span");
is(span.textContent, expectedValue, "Should have the right value in the box model.");
@ -54,5 +54,5 @@ async function checkValueInBoxModel(selector, expectedValue, doc) {
let onBlur = once(editor, "blur");
EventUtils.synthesizeKey("VK_RETURN", {}, doc.defaultView);
await onBlur;
yield onBlur;
}

50
devtools/client/inspector/boxmodel/test/browser_boxmodel_editablemodel_stylerules.js
View File

@ -15,21 +15,21 @@ const TEST_URI = "<style>" +
"</style>" +
"<div id='div1'></div><div id='div2'></div><div id='div3'></div>";
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel, testActor} = yield openLayoutView();
await testUnits(inspector, boxmodel, testActor);
await testValueComesFromStyleRule(inspector, boxmodel, testActor);
await testShorthandsAreParsed(inspector, boxmodel, testActor);
yield testUnits(inspector, boxmodel, testActor);
yield testValueComesFromStyleRule(inspector, boxmodel, testActor);
yield testShorthandsAreParsed(inspector, boxmodel, testActor);
});
async function testUnits(inspector, boxmodel, testActor) {
function* testUnits(inspector, boxmodel, testActor) {
info("Test that entering units works");
is((await getStyle(testActor, "#div1", "padding-top")), "",
is((yield getStyle(testActor, "#div1", "padding-top")), "",
"Should have the right padding");
await selectNode("#div1", inspector);
yield selectNode("#div1", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-top > span");
is(span.textContent, 3, "Should have the right value in the box model.");
@ -40,33 +40,33 @@ async function testUnits(inspector, boxmodel, testActor) {
is(editor.value, "3px", "Should have the right value in the editor.");
EventUtils.synthesizeKey("1", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
EventUtils.synthesizeKey("e", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is((await getStyle(testActor, "#div1", "padding-top")), "",
is((yield getStyle(testActor, "#div1", "padding-top")), "",
"An invalid value is handled cleanly");
EventUtils.synthesizeKey("m", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "1em", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div1", "padding-top")),
is((yield getStyle(testActor, "#div1", "padding-top")),
"1em", "Should have updated the padding.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div1", "padding-top")), "1em",
is((yield getStyle(testActor, "#div1", "padding-top")), "1em",
"Should be the right padding.");
is(span.textContent, 16, "Should have the right value in the box model.");
}
async function testValueComesFromStyleRule(inspector, boxmodel, testActor) {
function* testValueComesFromStyleRule(inspector, boxmodel, testActor) {
info("Test that we pick up the value from a higher style rule");
is((await getStyle(testActor, "#div2", "border-bottom-width")), "",
is((yield getStyle(testActor, "#div2", "border-bottom-width")), "",
"Should have the right border-bottom-width");
await selectNode("#div2", inspector);
yield selectNode("#div2", inspector);
let span = boxmodel.document.querySelector(".boxmodel-border.boxmodel-bottom > span");
is(span.textContent, 16, "Should have the right value in the box model.");
@ -77,25 +77,25 @@ async function testValueComesFromStyleRule(inspector, boxmodel, testActor) {
is(editor.value, "1em", "Should have the right value in the editor.");
EventUtils.synthesizeKey("0", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "0", "Should have the right value in the editor.");
is((await getStyle(testActor, "#div2", "border-bottom-width")), "0px",
is((yield getStyle(testActor, "#div2", "border-bottom-width")), "0px",
"Should have updated the border.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div2", "border-bottom-width")), "0px",
is((yield getStyle(testActor, "#div2", "border-bottom-width")), "0px",
"Should be the right border-bottom-width.");
is(span.textContent, 0, "Should have the right value in the box model.");
}
async function testShorthandsAreParsed(inspector, boxmodel, testActor) {
function* testShorthandsAreParsed(inspector, boxmodel, testActor) {
info("Test that shorthand properties are parsed correctly");
is((await getStyle(testActor, "#div3", "padding-right")), "",
is((yield getStyle(testActor, "#div3", "padding-right")), "",
"Should have the right padding");
await selectNode("#div3", inspector);
yield selectNode("#div3", inspector);
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-right > span");
is(span.textContent, 32, "Should have the right value in the box model.");
@ -107,7 +107,7 @@ async function testShorthandsAreParsed(inspector, boxmodel, testActor) {
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
is((await getStyle(testActor, "#div3", "padding-right")), "",
is((yield getStyle(testActor, "#div3", "padding-right")), "",
"Should be the right padding.");
is(span.textContent, 32, "Should have the right value in the box model.");
}

22
devtools/client/inspector/boxmodel/test/browser_boxmodel_layout-accordion-state.js
View File

@ -18,19 +18,19 @@ const TEST_URI = `
const BOXMODEL_OPENED_PREF = "devtools.layout.boxmodel.opened";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, toolbox } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, toolbox } = yield openLayoutView();
let { document: doc } = boxmodel;
await testAccordionStateAfterClickingHeader(doc);
await testAccordionStateAfterSwitchingSidebars(inspector, doc);
await testAccordionStateAfterReopeningLayoutView(toolbox);
yield testAccordionStateAfterClickingHeader(doc);
yield testAccordionStateAfterSwitchingSidebars(inspector, doc);
yield testAccordionStateAfterReopeningLayoutView(toolbox);
Services.prefs.clearUserPref(BOXMODEL_OPENED_PREF);
});
function testAccordionStateAfterClickingHeader(doc) {
function* testAccordionStateAfterClickingHeader(doc) {
let header = doc.querySelector("#layout-container .box-model-pane ._header");
let bContent = doc.querySelector("#layout-container .box-model-pane ._content");
@ -48,7 +48,7 @@ function testAccordionStateAfterClickingHeader(doc) {
`${BOXMODEL_OPENED_PREF} is pref off.`);
}
function testAccordionStateAfterSwitchingSidebars(inspector, doc) {
function* testAccordionStateAfterSwitchingSidebars(inspector, doc) {
info("Checking the box model accordion state is persistent after switching sidebars.");
let bContent = doc.querySelector("#layout-container .box-model-pane ._content");
@ -65,15 +65,15 @@ function testAccordionStateAfterSwitchingSidebars(inspector, doc) {
`${BOXMODEL_OPENED_PREF} is pref off.`);
}
async function testAccordionStateAfterReopeningLayoutView(toolbox) {
function* testAccordionStateAfterReopeningLayoutView(toolbox) {
info("Checking the box model accordion state is persistent after closing and "
+ "re-opening the layout view.");
info("Closing the toolbox.");
await toolbox.destroy();
yield toolbox.destroy();
info("Re-opening the layout view.");
let { boxmodel } = await openLayoutView();
let { boxmodel } = yield openLayoutView();
let { document: doc } = boxmodel;
let bContent = doc.querySelector("#layout-container .box-model-pane ._content");

24
devtools/client/inspector/boxmodel/test/browser_boxmodel_navigation.js
View File

@ -15,18 +15,18 @@ const TEST_URI = `
</style><div></div>
`;
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
await selectNode("div", inspector);
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
yield selectNode("div", inspector);
await testInitialFocus(inspector, boxmodel);
await testChangingLevels(inspector, boxmodel);
await testTabbingWrapAround(inspector, boxmodel);
await testChangingLevelsByClicking(inspector, boxmodel);
yield testInitialFocus(inspector, boxmodel);
yield testChangingLevels(inspector, boxmodel);
yield testTabbingWrapAround(inspector, boxmodel);
yield testChangingLevelsByClicking(inspector, boxmodel);
});
function testInitialFocus(inspector, boxmodel) {
function* testInitialFocus(inspector, boxmodel) {
info("Test that the focus is(on margin layout.");
let doc = boxmodel.document;
let container = doc.querySelector(".boxmodel-container");
@ -37,7 +37,7 @@ function testInitialFocus(inspector, boxmodel) {
"Should be set to the position layout.");
}
function testChangingLevels(inspector, boxmodel) {
function* testChangingLevels(inspector, boxmodel) {
info("Test that using arrow keys updates level.");
let doc = boxmodel.document;
let container = doc.querySelector(".boxmodel-container");
@ -78,7 +78,7 @@ function testChangingLevels(inspector, boxmodel) {
"Should be set to the position layout.");
}
function testTabbingWrapAround(inspector, boxmodel) {
function* testTabbingWrapAround(inspector, boxmodel) {
info("Test that using arrow keys updates level.");
let doc = boxmodel.document;
let container = doc.querySelector(".boxmodel-container");
@ -100,7 +100,7 @@ function testTabbingWrapAround(inspector, boxmodel) {
is(editBoxes[3], doc.activeElement, "Left edit box should have focus.");
}
function testChangingLevelsByClicking(inspector, boxmodel) {
function* testChangingLevelsByClicking(inspector, boxmodel) {
info("Test that clicking on levels updates level.");
let doc = boxmodel.document;
let container = doc.querySelector(".boxmodel-container");

22
devtools/client/inspector/boxmodel/test/browser_boxmodel_offsetparent.js
View File

@ -55,38 +55,38 @@ const res2 = [
},
];
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, testActor } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, testActor } = yield openLayoutView();
await testInitialValues(inspector, boxmodel);
await testChangingValues(inspector, boxmodel, testActor);
yield testInitialValues(inspector, boxmodel);
yield testChangingValues(inspector, boxmodel, testActor);
});
async function testInitialValues(inspector, boxmodel) {
function* testInitialValues(inspector, boxmodel) {
info("Test that the initial values of the box model offset parent are correct");
let viewdoc = boxmodel.document;
for (let { selector, offsetParentValue } of res1) {
await selectNode(selector, inspector);
yield selectNode(selector, inspector);
let elt = viewdoc.querySelector(OFFSET_PARENT_SELECTOR);
is(elt && elt.textContent, offsetParentValue, selector + " has the right value.");
}
}
async function testChangingValues(inspector, boxmodel, testActor) {
function* testChangingValues(inspector, boxmodel, testActor) {
info("Test that changing the document updates the box model");
let viewdoc = boxmodel.document;
for (let { selector, update } of updates) {
let onUpdated = waitForUpdate(inspector);
await testActor.setAttribute(selector, "style", update);
await onUpdated;
yield testActor.setAttribute(selector, "style", update);
yield onUpdated;
}
for (let { selector, offsetParentValue } of res2) {
await selectNode(selector, inspector);
yield selectNode(selector, inspector);
let elt = viewdoc.querySelector(OFFSET_PARENT_SELECTOR);
is(elt && elt.textContent, offsetParentValue,

16
devtools/client/inspector/boxmodel/test/browser_boxmodel_positions.js
View File

@ -42,18 +42,18 @@ const res1 = [
},
];
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
let node = await getNodeFront("div", inspector);
let children = await inspector.markup.walker.children(node);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
let node = yield getNodeFront("div", inspector);
let children = yield inspector.markup.walker.children(node);
let beforeElement = children.nodes[0];
await selectNode(beforeElement, inspector);
await testPositionValues(inspector, boxmodel);
yield selectNode(beforeElement, inspector);
yield testPositionValues(inspector, boxmodel);
});
function testPositionValues(inspector, boxmodel) {
function* testPositionValues(inspector, boxmodel) {
info("Test that the position values of the box model are correct");
let doc = boxmodel.document;

20
devtools/client/inspector/boxmodel/test/browser_boxmodel_properties.js
View File

@ -79,16 +79,16 @@ const res2 = [
},
];
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, testActor } = await openLayoutView();
await selectNode("div", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, boxmodel, testActor } = yield openLayoutView();
yield selectNode("div", inspector);
await testInitialValues(inspector, boxmodel);
await testChangingValues(inspector, boxmodel, testActor);
yield testInitialValues(inspector, boxmodel);
yield testChangingValues(inspector, boxmodel, testActor);
});
function testInitialValues(inspector, boxmodel) {
function* testInitialValues(inspector, boxmodel) {
info("Test that the initial values of the box model are correct");
let doc = boxmodel.document;
@ -98,15 +98,15 @@ function testInitialValues(inspector, boxmodel) {
}
}
async function testChangingValues(inspector, boxmodel, testActor) {
function* testChangingValues(inspector, boxmodel, testActor) {
info("Test that changing the document updates the box model");
let doc = boxmodel.document;
let onUpdated = waitForUpdate(inspector);
await testActor.setAttribute("div", "style",
yield testActor.setAttribute("div", "style",
"box-sizing:content-box;float:right;" +
"line-height:10px;position:static;z-index:5;");
await onUpdated;
yield onUpdated;
for (let { property, value } of res2) {
let elt = doc.querySelector(getPropertySelector(property));

16
devtools/client/inspector/boxmodel/test/browser_boxmodel_pseudo-element.js
View File

@ -97,18 +97,18 @@ const res1 = [
},
];
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
let node = await getNodeFront("div", inspector);
let children = await inspector.markup.walker.children(node);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
let node = yield getNodeFront("div", inspector);
let children = yield inspector.markup.walker.children(node);
let beforeElement = children.nodes[0];
await selectNode(beforeElement, inspector);
await testInitialValues(inspector, boxmodel);
yield selectNode(beforeElement, inspector);
yield testInitialValues(inspector, boxmodel);
});
function testInitialValues(inspector, boxmodel) {
function* testInitialValues(inspector, boxmodel) {
info("Test that the initial values of the box model are correct");
let doc = boxmodel.document;

8
devtools/client/inspector/boxmodel/test/browser_boxmodel_rotate-labels-on-sides.js
View File

@ -30,10 +30,10 @@ const TEST_URI = encodeURIComponent([
].join(""));
const LONG_TEXT_ROTATE_LIMIT = 3;
add_task(async function() {
await addTab("data:text/html," + TEST_URI);
let {inspector, boxmodel} = await openLayoutView();
await selectNode("div", inspector);
add_task(function* () {
yield addTab("data:text/html," + TEST_URI);
let {inspector, boxmodel} = yield openLayoutView();
yield selectNode("div", inspector);
for (let i = 0; i < res1.length; i++) {
let elt = boxmodel.document.querySelector(res1[i].selector);

14
devtools/client/inspector/boxmodel/test/browser_boxmodel_sync.js
View File

@ -8,13 +8,13 @@
const TEST_URI = "<p>hello</p>";
add_task(async function() {
await addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
info("When a property is edited, it should sync in the rule view");
await selectNode("p", inspector);
yield selectNode("p", inspector);
info("Modify padding-bottom in box model view");
let span = boxmodel.document.querySelector(".boxmodel-padding.boxmodel-bottom > span");
@ -22,7 +22,7 @@ add_task(async function() {
let editor = boxmodel.document.querySelector(".styleinspector-propertyeditor");
EventUtils.synthesizeKey("7", {}, boxmodel.document.defaultView);
await waitForUpdate(inspector);
yield waitForUpdate(inspector);
is(editor.value, "7", "Should have the right value in the editor.");
EventUtils.synthesizeKey("VK_RETURN", {}, boxmodel.document.defaultView);
@ -32,10 +32,10 @@ add_task(async function() {
let ruleView = selectRuleView(inspector);
info("Wait for the rule view to be selected");
await onRuleViewSelected;
yield onRuleViewSelected;
info("Wait for the rule view to be refreshed");
await onRuleViewRefreshed;
yield onRuleViewRefreshed;
ok(true, "The rule view was refreshed");
let ruleEditor = getRuleViewRuleEditor(ruleView, 0);

8
devtools/client/inspector/boxmodel/test/browser_boxmodel_tooltips.js
View File

@ -70,9 +70,9 @@ const VALUES_TEST_DATA = [{
}]
}];
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, boxmodel} = yield openLayoutView();
info("Checking the regions tooltips");
@ -98,7 +98,7 @@ add_task(async function() {
for (let {selector, values} of VALUES_TEST_DATA) {
info("Selecting " + selector + " and checking the values tooltips");
await selectNode(selector, inspector);
yield selectNode(selector, inspector);
info("Iterate over all values");
for (let key in boxmodel.map) {

44
devtools/client/inspector/boxmodel/test/browser_boxmodel_update-after-navigation.js
View File

@ -10,31 +10,31 @@
const IFRAME1 = URL_ROOT + "doc_boxmodel_iframe1.html";
const IFRAME2 = URL_ROOT + "doc_boxmodel_iframe2.html";
add_task(async function() {
await addTab(IFRAME1);
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab(IFRAME1);
let {inspector, boxmodel, testActor} = yield openLayoutView();
await testFirstPage(inspector, boxmodel, testActor);
yield testFirstPage(inspector, boxmodel, testActor);
info("Navigate to the second page");
let onMarkupLoaded = waitForMarkupLoaded(inspector);
await testActor.eval(`location.href="${IFRAME2}"`);
await onMarkupLoaded;
yield testActor.eval(`location.href="${IFRAME2}"`);
yield onMarkupLoaded;
await testSecondPage(inspector, boxmodel, testActor);
yield testSecondPage(inspector, boxmodel, testActor);
info("Go back to the first page");
onMarkupLoaded = waitForMarkupLoaded(inspector);
await testActor.eval("history.back();");
await onMarkupLoaded;
yield testActor.eval("history.back();");
yield onMarkupLoaded;
await testBackToFirstPage(inspector, boxmodel, testActor);
yield testBackToFirstPage(inspector, boxmodel, testActor);
});
async function testFirstPage(inspector, boxmodel, testActor) {
function* testFirstPage(inspector, boxmodel, testActor) {
info("Test that the box model view works on the first page");
await selectNode("p", inspector);
yield selectNode("p", inspector);
info("Checking that the box model view shows the right value");
let paddingElt = boxmodel.document.querySelector(
@ -43,18 +43,18 @@ async function testFirstPage(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying the padding");
let onUpdated = waitForUpdate(inspector);
await setStyle(testActor, "p", "padding", "20px");
await onUpdated;
yield setStyle(testActor, "p", "padding", "20px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");
is(paddingElt.textContent, "20");
}
async function testSecondPage(inspector, boxmodel, testActor) {
function* testSecondPage(inspector, boxmodel, testActor) {
info("Test that the box model view works on the second page");
await selectNode("p", inspector);
yield selectNode("p", inspector);
info("Checking that the box model view shows the right value");
let sizeElt = boxmodel.document.querySelector(".boxmodel-size > span");
@ -62,18 +62,18 @@ async function testSecondPage(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying the size");
let onUpdated = waitForUpdate(inspector);
await setStyle(testActor, "p", "width", "200px");
await onUpdated;
yield setStyle(testActor, "p", "width", "200px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");
is(sizeElt.textContent, "200" + "\u00D7" + "100");
}
async function testBackToFirstPage(inspector, boxmodel, testActor) {
function* testBackToFirstPage(inspector, boxmodel, testActor) {
info("Test that the box model view works on the first page after going back");
await selectNode("p", inspector);
yield selectNode("p", inspector);
info("Checking that the box model view shows the right value, which is the" +
"modified value from step one because of the bfcache");
@ -83,8 +83,8 @@ async function testBackToFirstPage(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying the padding");
let onUpdated = waitForUpdate(inspector);
await setStyle(testActor, "p", "padding", "100px");
await onUpdated;
yield setStyle(testActor, "p", "padding", "100px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");

22
devtools/client/inspector/boxmodel/test/browser_boxmodel_update-after-reload.js
View File

@ -6,24 +6,24 @@
// Test that the box model view continues to work after the page is reloaded
add_task(async function() {
await addTab(URL_ROOT + "doc_boxmodel_iframe1.html");
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab(URL_ROOT + "doc_boxmodel_iframe1.html");
let {inspector, boxmodel, testActor} = yield openLayoutView();
info("Test that the box model view works on the first page");
await assertBoxModelView(inspector, boxmodel, testActor);
yield assertBoxModelView(inspector, boxmodel, testActor);
info("Reload the page");
let onMarkupLoaded = waitForMarkupLoaded(inspector);
await testActor.reload();
await onMarkupLoaded;
yield testActor.reload();
yield onMarkupLoaded;
info("Test that the box model view works on the reloaded page");
await assertBoxModelView(inspector, boxmodel, testActor);
yield assertBoxModelView(inspector, boxmodel, testActor);
});
async function assertBoxModelView(inspector, boxmodel, testActor) {
await selectNode("p", inspector);
function* assertBoxModelView(inspector, boxmodel, testActor) {
yield selectNode("p", inspector);
info("Checking that the box model view shows the right value");
let paddingElt = boxmodel.document.querySelector(
@ -32,8 +32,8 @@ async function assertBoxModelView(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying the padding");
let onUpdated = waitForUpdate(inspector);
await setStyle(testActor, "p", "padding", "20px");
await onUpdated;
yield setStyle(testActor, "p", "padding", "20px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");

60
devtools/client/inspector/boxmodel/test/browser_boxmodel_update-in-iframes.js
View File

@ -7,19 +7,19 @@
// Test that the box model view for elements within iframes also updates when they
// change
add_task(async function() {
await addTab(URL_ROOT + "doc_boxmodel_iframe1.html");
let {inspector, boxmodel, testActor} = await openLayoutView();
add_task(function* () {
yield addTab(URL_ROOT + "doc_boxmodel_iframe1.html");
let {inspector, boxmodel, testActor} = yield openLayoutView();
await testResizingInIframe(inspector, boxmodel, testActor);
await testReflowsAfterIframeDeletion(inspector, boxmodel, testActor);
yield testResizingInIframe(inspector, boxmodel, testActor);
yield testReflowsAfterIframeDeletion(inspector, boxmodel, testActor);
});
async function testResizingInIframe(inspector, boxmodel, testActor) {
function* testResizingInIframe(inspector, boxmodel, testActor) {
info("Test that resizing an element in an iframe updates its box model");
info("Selecting the nested test node");
await selectNodeInIframe2("div", inspector);
yield selectNodeInIframe2("div", inspector);
info("Checking that the box model view shows the right value");
let sizeElt = boxmodel.document.querySelector(".boxmodel-size > span");
@ -27,25 +27,25 @@ async function testResizingInIframe(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying its size");
let onUpdated = waitForUpdate(inspector);
await setStyleInIframe2(testActor, "div", "width", "200px");
await onUpdated;
yield setStyleInIframe2(testActor, "div", "width", "200px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");
is(sizeElt.textContent, "200\u00D7200");
}
async function testReflowsAfterIframeDeletion(inspector, boxmodel, testActor) {
function* testReflowsAfterIframeDeletion(inspector, boxmodel, testActor) {
info("Test reflows are still sent to the box model view after deleting an " +
"iframe");
info("Deleting the iframe2");
let onInspectorUpdated = inspector.once("inspector-updated");
await removeIframe2(testActor);
await onInspectorUpdated;
yield removeIframe2(testActor);
yield onInspectorUpdated;
info("Selecting the test node in iframe1");
await selectNodeInIframe1("p", inspector);
yield selectNodeInIframe1("p", inspector);
info("Checking that the box model view shows the right value");
let sizeElt = boxmodel.document.querySelector(".boxmodel-size > span");
@ -53,37 +53,37 @@ async function testReflowsAfterIframeDeletion(inspector, boxmodel, testActor) {
info("Listening for box model view changes and modifying its size");
let onUpdated = waitForUpdate(inspector);
await setStyleInIframe1(testActor, "p", "width", "200px");
await onUpdated;
yield setStyleInIframe1(testActor, "p", "width", "200px");
yield onUpdated;
ok(true, "Box model view got updated");
info("Checking that the box model view shows the right value after update");
is(sizeElt.textContent, "200\u00D7100");
}
async function selectNodeInIframe1(selector, inspector) {
let iframe1 = await getNodeFront("iframe", inspector);
let node = await getNodeFrontInFrame(selector, iframe1, inspector);
await selectNode(node, inspector);
function* selectNodeInIframe1(selector, inspector) {
let iframe1 = yield getNodeFront("iframe", inspector);
let node = yield getNodeFrontInFrame(selector, iframe1, inspector);
yield selectNode(node, inspector);
}
async function selectNodeInIframe2(selector, inspector) {
let iframe1 = await getNodeFront("iframe", inspector);
let iframe2 = await getNodeFrontInFrame("iframe", iframe1, inspector);
let node = await getNodeFrontInFrame(selector, iframe2, inspector);
await selectNode(node, inspector);
function* selectNodeInIframe2(selector, inspector) {
let iframe1 = yield getNodeFront("iframe", inspector);
let iframe2 = yield getNodeFrontInFrame("iframe", iframe1, inspector);
let node = yield getNodeFrontInFrame(selector, iframe2, inspector);
yield selectNode(node, inspector);
}
async function setStyleInIframe1(testActor, selector, propertyName, value) {
await testActor.eval(`
function* setStyleInIframe1(testActor, selector, propertyName, value) {
yield testActor.eval(`
content.document.querySelector("iframe")
.contentDocument.querySelector("${selector}")
.style.${propertyName} = "${value}";
`);
}
async function setStyleInIframe2(testActor, selector, propertyName, value) {
await testActor.eval(`
function* setStyleInIframe2(testActor, selector, propertyName, value) {
yield testActor.eval(`
content.document.querySelector("iframe")
.contentDocument
.querySelector("iframe")
@ -92,8 +92,8 @@ async function setStyleInIframe2(testActor, selector, propertyName, value) {
`);
}
async function removeIframe2(testActor) {
await testActor.eval(`
function* removeIframe2(testActor) {
yield testActor.eval(`
content.document.querySelector("iframe")
.contentDocument
.querySelector("iframe")

12
devtools/client/inspector/boxmodel/test/head.js
View File

@ -27,13 +27,13 @@ registerCleanupFunction(() => {
* @return {Promise} a promise that resolves when the inspector is updated with the new
* node.
*/
async function selectAndHighlightNode(selectorOrNodeFront, inspector) {
function* selectAndHighlightNode(selectorOrNodeFront, inspector) {
info("Highlighting and selecting the node " + selectorOrNodeFront);
let nodeFront = await getNodeFront(selectorOrNodeFront, inspector);
let nodeFront = yield getNodeFront(selectorOrNodeFront, inspector);
let updated = inspector.toolbox.once("highlighter-ready");
inspector.selection.setNodeFront(nodeFront, "test-highlight");
await updated;
yield updated;
}
/**
@ -100,8 +100,8 @@ function setStyle(testActor, selector, propertyName, value) {
* finished updating. We also need to wait for the "boxmodel-view-updated" event.
*/
var _selectNode = selectNode;
selectNode = async function(node, inspector, reason) {
selectNode = function* (node, inspector, reason) {
let onUpdate = waitForUpdate(inspector, true);
await _selectNode(node, inspector, reason);
await onUpdate;
yield _selectNode(node, inspector, reason);
yield onUpdate;
};

13
devtools/client/inspector/boxmodel/utils/editing-session.js
View File

@ -4,6 +4,7 @@
"use strict";
const { Task } = require("devtools/shared/task");
const { getCssProperties } = require("devtools/shared/fronts/css-properties");
/**
@ -106,7 +107,7 @@ EditingSession.prototype = {
* is removed.
* @return {Promise} Resolves when the modifications are complete.
*/
async setProperties(properties) {
setProperties: Task.async(function* (properties) {
for (let property of properties) {
// Get a RuleModificationList or RuleRewriter helper object from the
// StyleRuleActor to make changes to CSS properties.
@ -134,16 +135,16 @@ EditingSession.prototype = {
modifications.setProperty(index, property.name, property.value, "");
}
await modifications.apply();
yield modifications.apply();
}
},
}),
/**
* Reverts all of the property changes made by this instance.
*
* @return {Promise} Resolves when all properties have been reverted.
*/
async revert() {
revert: Task.async(function* () {
// Revert each property that we modified previously, one by one. See
// setProperties for information about why.
for (let [property, value] of this._modifications) {
@ -169,9 +170,9 @@ EditingSession.prototype = {
modifications.removeProperty(index, property);
}
await modifications.apply();
yield modifications.apply();
}
},
}),
destroy: function() {
this._doc = null;

10
devtools/client/inspector/computed/test/browser_computed_browser-styles.js
View File

@ -15,10 +15,10 @@ const TEST_URI = `
<span id="matches" class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#matches", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#matches", inspector);
info("Checking the default styles");
is(isPropertyVisible("color", view), true,
@ -31,7 +31,7 @@ add_task(async function() {
let checkbox = doc.querySelector(".includebrowserstyles");
let onRefreshed = inspector.once("computed-view-refreshed");
checkbox.click();
await onRefreshed;
yield onRefreshed;
info("Checking the browser styles");
is(isPropertyVisible("color", view), true,

40
devtools/client/inspector/computed/test/browser_computed_getNodeInfo.js
View File

@ -50,7 +50,7 @@ const TEST_URI = `
const TEST_DATA = [
{
desc: "Testing a null node",
getHoveredNode: function() {
getHoveredNode: function* () {
return null;
},
assertNodeInfo: function(nodeInfo) {
@ -59,7 +59,7 @@ const TEST_DATA = [
},
{
desc: "Testing a useless node",
getHoveredNode: function(view) {
getHoveredNode: function* (view) {
return view.element;
},
assertNodeInfo: function(nodeInfo) {
@ -68,7 +68,7 @@ const TEST_DATA = [
},
{
desc: "Testing a property name",
getHoveredNode: function(view) {
getHoveredNode: function* (view) {
return getComputedViewProperty(view, "color").nameSpan;
},
assertNodeInfo: function(nodeInfo) {
@ -81,7 +81,7 @@ const TEST_DATA = [
},
{
desc: "Testing a property value",
getHoveredNode: function(view) {
getHoveredNode: function* (view) {
return getComputedViewProperty(view, "color").valueSpan;
},
assertNodeInfo: function(nodeInfo) {
@ -94,7 +94,7 @@ const TEST_DATA = [
},
{
desc: "Testing an image url",
getHoveredNode: function(view) {
getHoveredNode: function* (view) {
let {valueSpan} = getComputedViewProperty(view, "background-image");
return valueSpan.querySelector(".theme-link");
},
@ -110,8 +110,8 @@ const TEST_DATA = [
},
{
desc: "Testing a matched rule selector (bestmatch)",
getHoveredNode: async function(view) {
let el = await getComputedViewMatchedRules(view, "background-color");
getHoveredNode: function* (view) {
let el = yield getComputedViewMatchedRules(view, "background-color");
return el.querySelector(".bestmatch");
},
assertNodeInfo: function(nodeInfo) {
@ -121,8 +121,8 @@ const TEST_DATA = [
},
{
desc: "Testing a matched rule selector (matched)",
getHoveredNode: async function(view) {
let el = await getComputedViewMatchedRules(view, "background-color");
getHoveredNode: function* (view) {
let el = yield getComputedViewMatchedRules(view, "background-color");
return el.querySelector(".matched");
},
assertNodeInfo: function(nodeInfo) {
@ -132,8 +132,8 @@ const TEST_DATA = [
},
{
desc: "Testing a matched rule selector (parentmatch)",
getHoveredNode: async function(view) {
let el = await getComputedViewMatchedRules(view, "color");
getHoveredNode: function* (view) {
let el = yield getComputedViewMatchedRules(view, "color");
return el.querySelector(".parentmatch");
},
assertNodeInfo: function(nodeInfo) {
@ -143,8 +143,8 @@ const TEST_DATA = [
},
{
desc: "Testing a matched rule value",
getHoveredNode: async function(view) {
let el = await getComputedViewMatchedRules(view, "color");
getHoveredNode: function* (view) {
let el = yield getComputedViewMatchedRules(view, "color");
return el.querySelector(".computed-other-property-value");
},
assertNodeInfo: function(nodeInfo) {
@ -155,8 +155,8 @@ const TEST_DATA = [
},
{
desc: "Testing a matched rule stylesheet link",
getHoveredNode: async function(view) {
let el = await getComputedViewMatchedRules(view, "color");
getHoveredNode: function* (view) {
let el = yield getComputedViewMatchedRules(view, "color");
return el.querySelector(".rule-link .theme-link");
},
assertNodeInfo: function(nodeInfo) {
@ -165,14 +165,14 @@ const TEST_DATA = [
}
];
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#testElement", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#testElement", inspector);
for (let {desc, getHoveredNode, assertNodeInfo} of TEST_DATA) {
info(desc);
let nodeInfo = view.getNodeInfo(await getHoveredNode(view));
let nodeInfo = view.getNodeInfo(yield getHoveredNode(view));
assertNodeInfo(nodeInfo);
}
});

22
devtools/client/inspector/computed/test/browser_computed_keybindings_01.js
View File

@ -15,10 +15,10 @@ const TEST_URI = `
<span class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode(".matches", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode(".matches", inspector);
let propView = getFirstVisiblePropertyView(view);
let rulesTable = propView.matchedSelectorsContainer;
@ -28,13 +28,13 @@ add_task(async function() {
matchedExpander.scrollIntoView();
let onMatchedExpanderFocus = once(matchedExpander, "focus", true);
EventUtils.synthesizeMouseAtCenter(matchedExpander, {}, view.styleWindow);
await onMatchedExpanderFocus;
yield onMatchedExpanderFocus;
await checkToggleKeyBinding(view.styleWindow, "VK_SPACE", rulesTable,
yield checkToggleKeyBinding(view.styleWindow, "VK_SPACE", rulesTable,
inspector);
await checkToggleKeyBinding(view.styleWindow, "VK_RETURN", rulesTable,
yield checkToggleKeyBinding(view.styleWindow, "VK_RETURN", rulesTable,
inspector);
await checkHelpLinkKeybinding(view);
yield checkHelpLinkKeybinding(view);
});
function getFirstVisiblePropertyView(view) {
@ -50,7 +50,7 @@ function getFirstVisiblePropertyView(view) {
return propView;
}
async function checkToggleKeyBinding(win, key, rulesTable, inspector) {
function* checkToggleKeyBinding(win, key, rulesTable, inspector) {
info("Pressing " + key + " key a couple of times to check that the " +
"property gets expanded/collapsed");
@ -59,12 +59,12 @@ async function checkToggleKeyBinding(win, key, rulesTable, inspector) {
info("Expanding the property");
EventUtils.synthesizeKey(key, {}, win);
await onExpand;
yield onExpand;
isnot(rulesTable.innerHTML, "", "The property has been expanded");
info("Collapsing the property");
EventUtils.synthesizeKey(key, {}, win);
await onCollapse;
yield onCollapse;
is(rulesTable.innerHTML, "", "The property has been collapsed");
}

12
devtools/client/inspector/computed/test/browser_computed_keybindings_02.js
View File

@ -32,10 +32,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("span", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("span", inspector);
info("Selecting the first computed style in the list");
let firstStyle = view.styleDocument.querySelector(".computed-property-view");
@ -46,7 +46,7 @@ add_task(async function() {
let onExpanded = inspector.once("computed-view-property-expanded");
EventUtils.synthesizeKey("KEY_Tab");
EventUtils.synthesizeKey("KEY_Enter");
await onExpanded;
yield onExpanded;
info("Verify the 2nd style has been expanded");
let secondStyleSelectors = view.styleDocument.querySelectorAll(
@ -57,7 +57,7 @@ add_task(async function() {
onExpanded = inspector.once("computed-view-property-expanded");
EventUtils.synthesizeKey("KEY_Tab", {shiftKey: true});
EventUtils.synthesizeKey(" ");
await onExpanded;
yield onExpanded;
info("Verify the 1st style has been expanded too");
let firstStyleSelectors = view.styleDocument.querySelectorAll(

32
devtools/client/inspector/computed/test/browser_computed_matched-selectors-toggle.js
View File

@ -15,18 +15,18 @@ const TEST_URI = `
<h1>Some header text</h1>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("h1", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("h1", inspector);
await testExpandOnTwistyClick(view, inspector);
await testCollapseOnTwistyClick(view, inspector);
await testExpandOnDblClick(view, inspector);
await testCollapseOnDblClick(view, inspector);
yield testExpandOnTwistyClick(view, inspector);
yield testCollapseOnTwistyClick(view, inspector);
yield testExpandOnDblClick(view, inspector);
yield testCollapseOnDblClick(view, inspector);
});
async function testExpandOnTwistyClick({styleDocument, styleWindow}, inspector) {
function* testExpandOnTwistyClick({styleDocument, styleWindow}, inspector) {
info("Testing that a property expands on twisty click");
info("Getting twisty element");
@ -37,7 +37,7 @@ async function testExpandOnTwistyClick({styleDocument, styleWindow}, inspector)
info("Clicking on the twisty element");
twisty.click();
await onExpand;
yield onExpand;
// Expanded means the matchedselectors div is not empty
let div = styleDocument.querySelector(".computed-property-content .matchedselectors");
@ -45,7 +45,7 @@ async function testExpandOnTwistyClick({styleDocument, styleWindow}, inspector)
"Matched selectors are expanded on twisty click");
}
async function testCollapseOnTwistyClick({styleDocument, styleWindow}, inspector) {
function* testCollapseOnTwistyClick({styleDocument, styleWindow}, inspector) {
info("Testing that a property collapses on twisty click");
info("Getting twisty element");
@ -56,7 +56,7 @@ async function testCollapseOnTwistyClick({styleDocument, styleWindow}, inspector
info("Clicking on the twisty element");
twisty.click();
await onCollapse;
yield onCollapse;
// Collapsed means the matchedselectors div is empty
let div = styleDocument.querySelector(".computed-property-content .matchedselectors");
@ -64,7 +64,7 @@ async function testCollapseOnTwistyClick({styleDocument, styleWindow}, inspector
"Matched selectors are collapsed on twisty click");
}
async function testExpandOnDblClick({styleDocument, styleWindow}, inspector) {
function* testExpandOnDblClick({styleDocument, styleWindow}, inspector) {
info("Testing that a property expands on container dbl-click");
info("Getting computed property container");
@ -77,14 +77,14 @@ async function testExpandOnDblClick({styleDocument, styleWindow}, inspector) {
info("Dbl-clicking on the container");
EventUtils.synthesizeMouseAtCenter(container, {clickCount: 2}, styleWindow);
await onExpand;
yield onExpand;
// Expanded means the matchedselectors div is not empty
let div = styleDocument.querySelector(".computed-property-content .matchedselectors");
ok(div.childNodes.length > 0, "Matched selectors are expanded on dblclick");
}
async function testCollapseOnDblClick({styleDocument, styleWindow}, inspector) {
function* testCollapseOnDblClick({styleDocument, styleWindow}, inspector) {
info("Testing that a property collapses on container dbl-click");
info("Getting computed property container");
@ -95,7 +95,7 @@ async function testCollapseOnDblClick({styleDocument, styleWindow}, inspector) {
info("Dbl-clicking on the container");
EventUtils.synthesizeMouseAtCenter(container, {clickCount: 2}, styleWindow);
await onCollapse;
yield onCollapse;
// Collapsed means the matchedselectors div is empty
let div = styleDocument.querySelector(".computed-property-content .matchedselectors");

16
devtools/client/inspector/computed/test/browser_computed_matched-selectors_01.js
View File

@ -10,18 +10,18 @@ const {PropertyView} =
require("devtools/client/inspector/computed/computed");
const TEST_URI = URL_ROOT + "doc_matched_selectors.html";
add_task(async function() {
await addTab(TEST_URI);
let {inspector, view} = await openComputedView();
add_task(function* () {
yield addTab(TEST_URI);
let {inspector, view} = yield openComputedView();
await selectNode("#test", inspector);
await testMatchedSelectors(view, inspector);
yield selectNode("#test", inspector);
yield testMatchedSelectors(view, inspector);
});
async function testMatchedSelectors(view, inspector) {
function* testMatchedSelectors(view, inspector) {
info("checking selector counts, matched rules and titles");
let nodeFront = await getNodeFront("#test", inspector);
let nodeFront = yield getNodeFront("#test", inspector);
is(nodeFront, view._viewedElement,
"style inspector node matches the selected node");
@ -30,7 +30,7 @@ async function testMatchedSelectors(view, inspector) {
propertyView.buildSelectorContainer();
propertyView.matchedExpanded = true;
await propertyView.refreshMatchedSelectors();
yield propertyView.refreshMatchedSelectors();
let numMatchedSelectors = propertyView.matchedSelectors.length;
is(numMatchedSelectors, 6,

10
devtools/client/inspector/computed/test/browser_computed_matched-selectors_02.js
View File

@ -6,10 +6,10 @@
// Tests for matched selector texts in the computed view.
add_task(async function() {
await addTab("data:text/html;charset=utf-8,<div style='color:blue;'></div>");
let {inspector, view} = await openComputedView();
await selectNode("div", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8,<div style='color:blue;'></div>");
let {inspector, view} = yield openComputedView();
yield selectNode("div", inspector);
info("Checking the color property view");
let propertyView = getPropertyView(view, "color");
@ -18,7 +18,7 @@ add_task(async function() {
info("Expanding the matched selectors");
propertyView.matchedExpanded = true;
await propertyView.refreshMatchedSelectors();
yield propertyView.refreshMatchedSelectors();
let span = propertyView.matchedSelectorsContainer
.querySelector("span.rule-text");

10
devtools/client/inspector/computed/test/browser_computed_media-queries.js
View File

@ -11,11 +11,11 @@ const TEST_URI = URL_ROOT + "doc_media_queries.html";
var {PropertyView} = require("devtools/client/inspector/computed/computed");
add_task(async function() {
await addTab(TEST_URI);
let {inspector, view} = await openComputedView();
await selectNode("div", inspector);
await checkPropertyView(view);
add_task(function* () {
yield addTab(TEST_URI);
let {inspector, view} = yield openComputedView();
yield selectNode("div", inspector);
yield checkPropertyView(view);
});
function checkPropertyView(view) {

20
devtools/client/inspector/computed/test/browser_computed_no-results-placeholder.js
View File

@ -15,19 +15,19 @@ const TEST_URI = `
<span id="matches" class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#matches", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#matches", inspector);
await enterInvalidFilter(inspector, view);
yield enterInvalidFilter(inspector, view);
checkNoResultsPlaceholderShown(view);
await clearFilterText(inspector, view);
yield clearFilterText(inspector, view);
checkNoResultsPlaceholderHidden(view);
});
async function enterInvalidFilter(inspector, computedView) {
function* enterInvalidFilter(inspector, computedView) {
let searchbar = computedView.searchField;
let searchTerm = "xxxxx";
@ -36,7 +36,7 @@ async function enterInvalidFilter(inspector, computedView) {
let onRefreshed = inspector.once("computed-view-refreshed");
searchbar.focus();
synthesizeKeys(searchTerm, computedView.styleWindow);
await onRefreshed;
yield onRefreshed;
}
function checkNoResultsPlaceholderShown(computedView) {
@ -48,7 +48,7 @@ function checkNoResultsPlaceholderShown(computedView) {
is(display, "block", "placeholder is visible");
}
async function clearFilterText(inspector, computedView) {
function* clearFilterText(inspector, computedView) {
info("Clearing the filter text");
let searchbar = computedView.searchField;
@ -57,7 +57,7 @@ async function clearFilterText(inspector, computedView) {
searchbar.focus();
searchbar.value = "";
EventUtils.synthesizeKey("c", {}, computedView.styleWindow);
await onRefreshed;
yield onRefreshed;
}
function checkNoResultsPlaceholderHidden(computedView) {

24
devtools/client/inspector/computed/test/browser_computed_original-source-link.js
View File

@ -12,43 +12,43 @@ const PREF = "devtools.source-map.client-service.enabled";
const SCSS_LOC = "doc_sourcemaps.scss:4";
const CSS_LOC = "doc_sourcemaps.css:1";
add_task(async function() {
add_task(function* () {
info("Turning the pref " + PREF + " on");
Services.prefs.setBoolPref(PREF, true);
await addTab(TESTCASE_URI);
let {toolbox, inspector, view} = await openComputedView();
yield addTab(TESTCASE_URI);
let {toolbox, inspector, view} = yield openComputedView();
let onLinksUpdated = inspector.once("computed-view-sourcelinks-updated");
await selectNode("div", inspector);
yield selectNode("div", inspector);
info("Expanding the first property");
await expandComputedViewPropertyByIndex(view, 0);
yield expandComputedViewPropertyByIndex(view, 0);
info("Verifying the link text");
await onLinksUpdated;
yield onLinksUpdated;
verifyLinkText(view, SCSS_LOC);
info("Toggling the pref");
onLinksUpdated = inspector.once("computed-view-sourcelinks-updated");
Services.prefs.setBoolPref(PREF, false);
await onLinksUpdated;
yield onLinksUpdated;
info("Verifying that the link text has changed after the pref change");
await verifyLinkText(view, CSS_LOC);
yield verifyLinkText(view, CSS_LOC);
info("Toggling the pref again");
onLinksUpdated = inspector.once("computed-view-sourcelinks-updated");
Services.prefs.setBoolPref(PREF, true);
await onLinksUpdated;
yield onLinksUpdated;
info("Testing that clicking on the link works");
await testClickingLink(toolbox, view);
yield testClickingLink(toolbox, view);
info("Turning the pref " + PREF + " off");
Services.prefs.clearUserPref(PREF);
});
async function testClickingLink(toolbox, view) {
function* testClickingLink(toolbox, view) {
let onEditor = waitForStyleEditor(toolbox, "doc_sourcemaps.scss");
info("Clicking the computedview stylesheet link");
@ -56,7 +56,7 @@ async function testClickingLink(toolbox, view) {
link.scrollIntoView();
link.click();
let editor = await onEditor;
let editor = yield onEditor;
let {line} = editor.sourceEditor.getCursor();
is(line, 3, "cursor is at correct line number in original source");

20
devtools/client/inspector/computed/test/browser_computed_pseudo-element_01.js
View File

@ -8,30 +8,30 @@
const TEST_URI = URL_ROOT + "doc_pseudoelement.html";
add_task(async function() {
await addTab(TEST_URI);
let {inspector, view} = await openComputedView();
await testTopLeft(inspector, view);
add_task(function* () {
yield addTab(TEST_URI);
let {inspector, view} = yield openComputedView();
yield testTopLeft(inspector, view);
});
async function testTopLeft(inspector, view) {
let node = await getNodeFront("#topleft", inspector.markup);
await selectNode(node, inspector);
function* testTopLeft(inspector, view) {
let node = yield getNodeFront("#topleft", inspector.markup);
yield selectNode(node, inspector);
let float = getComputedViewPropertyValue(view, "float");
is(float, "left", "The computed view shows the correct float");
let children = await inspector.markup.walker.children(node);
let children = yield inspector.markup.walker.children(node);
is(children.nodes.length, 3, "Element has correct number of children");
let beforeElement = children.nodes[0];
await selectNode(beforeElement, inspector);
yield selectNode(beforeElement, inspector);
let top = getComputedViewPropertyValue(view, "top");
is(top, "0px", "The computed view shows the correct top");
let left = getComputedViewPropertyValue(view, "left");
is(left, "0px", "The computed view shows the correct left");
let afterElement = children.nodes[children.nodes.length - 1];
await selectNode(afterElement, inspector);
yield selectNode(afterElement, inspector);
top = getComputedViewPropertyValue(view, "top");
is(top, "96px", "The computed view shows the correct top");
left = getComputedViewPropertyValue(view, "left");

12
devtools/client/inspector/computed/test/browser_computed_refresh-on-style-change_01.js
View File

@ -9,19 +9,19 @@
const TEST_URI = "<div id='testdiv' style='font-size:10px;'>Test div!</div>";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view, testActor} = await openComputedView();
await selectNode("#testdiv", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view, testActor} = yield openComputedView();
yield selectNode("#testdiv", inspector);
let fontSize = getComputedViewPropertyValue(view, "font-size");
is(fontSize, "10px", "The computed view shows the right font-size");
info("Changing the node's style and waiting for the update");
let onUpdated = inspector.once("computed-view-refreshed");
await testActor.setAttribute("#testdiv", "style",
yield testActor.setAttribute("#testdiv", "style",
"font-size: 15px; color: red;");
await onUpdated;
yield onUpdated;
fontSize = getComputedViewPropertyValue(view, "font-size");
is(fontSize, "15px", "The computed view shows the updated font-size");

20
devtools/client/inspector/computed/test/browser_computed_search-filter.js
View File

@ -15,23 +15,23 @@ const TEST_URI = `
<span id="matches" class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#matches", inspector);
await testToggleDefaultStyles(inspector, view);
await testAddTextInFilter(inspector, view);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#matches", inspector);
yield testToggleDefaultStyles(inspector, view);
yield testAddTextInFilter(inspector, view);
});
async function testToggleDefaultStyles(inspector, computedView) {
function* testToggleDefaultStyles(inspector, computedView) {
info("checking \"Browser styles\" checkbox");
let checkbox = computedView.includeBrowserStylesCheckbox;
let onRefreshed = inspector.once("computed-view-refreshed");
checkbox.click();
await onRefreshed;
yield onRefreshed;
}
async function testAddTextInFilter(inspector, computedView) {
function* testAddTextInFilter(inspector, computedView) {
info("setting filter text to \"color\"");
let searchField = computedView.searchField;
let onRefreshed = inspector.once("computed-view-refreshed");
@ -49,7 +49,7 @@ async function testAddTextInFilter(inspector, computedView) {
is(inspector.panelDoc.activeElement, searchField, "Search field is focused");
synthesizeKeys("color", win);
await onRefreshed;
yield onRefreshed;
info("check that the correct properties are visible");

20
devtools/client/inspector/computed/test/browser_computed_search-filter_clear.js
View File

@ -17,15 +17,15 @@ const TEST_URI = `
<span id="matches" class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#matches", inspector);
await testAddTextInFilter(inspector, view);
await testClearSearchFilter(inspector, view);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#matches", inspector);
yield testAddTextInFilter(inspector, view);
yield testClearSearchFilter(inspector, view);
});
async function testAddTextInFilter(inspector, computedView) {
function* testAddTextInFilter(inspector, computedView) {
info("Setting filter text to \"background-color\"");
let win = computedView.styleWindow;
@ -34,7 +34,7 @@ async function testAddTextInFilter(inspector, computedView) {
searchField.focus();
synthesizeKeys("background-color", win);
await inspector.once("computed-view-refreshed");
yield inspector.once("computed-view-refreshed");
info("Check that the correct properties are visible");
@ -45,7 +45,7 @@ async function testAddTextInFilter(inspector, computedView) {
});
}
async function testClearSearchFilter(inspector, computedView) {
function* testClearSearchFilter(inspector, computedView) {
info("Clearing the search filter");
let win = computedView.styleWindow;
@ -55,7 +55,7 @@ async function testClearSearchFilter(inspector, computedView) {
let onRefreshed = inspector.once("computed-view-refreshed");
EventUtils.synthesizeMouseAtCenter(searchClearButton, {}, win);
await onRefreshed;
yield onRefreshed;
info("Check that the correct properties are visible");

22
devtools/client/inspector/computed/test/browser_computed_search-filter_context-menu.js
View File

@ -10,10 +10,10 @@ const TEST_INPUT = "h1";
const TEST_URI = "<h1>test filter context menu</h1>";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {toolbox, inspector, view} = await openComputedView();
await selectNode("h1", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {toolbox, inspector, view} = yield openComputedView();
yield selectNode("h1", inspector);
let win = view.styleWindow;
let searchField = view.searchField;
@ -34,12 +34,12 @@ add_task(async function() {
let onFocus = once(searchField, "focus");
searchField.focus();
await onFocus;
yield onFocus;
let onContextMenuPopup = once(searchContextMenu, "popupshowing");
EventUtils.synthesizeMouse(searchField, 2, 2,
{type: "contextmenu", button: 2}, win);
await onContextMenuPopup;
yield onContextMenuPopup;
is(cmdUndo.getAttribute("disabled"), "true", "cmdUndo is disabled");
is(cmdDelete.getAttribute("disabled"), "true", "cmdDelete is disabled");
@ -54,22 +54,22 @@ add_task(async function() {
info("Closing context menu");
let onContextMenuHidden = once(searchContextMenu, "popuphidden");
searchContextMenu.hidePopup();
await onContextMenuHidden;
yield onContextMenuHidden;
info("Copy text in search field using the context menu");
searchField.setUserInput(TEST_INPUT);
searchField.select();
EventUtils.synthesizeMouse(searchField, 2, 2,
{type: "contextmenu", button: 2}, win);
await onContextMenuPopup;
await waitForClipboardPromise(() => cmdCopy.click(), TEST_INPUT);
yield onContextMenuPopup;
yield waitForClipboardPromise(() => cmdCopy.click(), TEST_INPUT);
searchContextMenu.hidePopup();
await onContextMenuHidden;
yield onContextMenuHidden;
info("Reopen context menu and check command properties");
EventUtils.synthesizeMouse(searchField, 2, 2,
{type: "contextmenu", button: 2}, win);
await onContextMenuPopup;
yield onContextMenuPopup;
is(cmdUndo.getAttribute("disabled"), "", "cmdUndo is enabled");
is(cmdDelete.getAttribute("disabled"), "", "cmdDelete is enabled");

22
devtools/client/inspector/computed/test/browser_computed_search-filter_escape-keypress.js
View File

@ -19,15 +19,15 @@ const TEST_URI = `
<span id="matches" class="matches">Some styled text</span>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("#matches", inspector);
await testAddTextInFilter(inspector, view);
await testEscapeKeypress(inspector, view);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("#matches", inspector);
yield testAddTextInFilter(inspector, view);
yield testEscapeKeypress(inspector, view);
});
async function testAddTextInFilter(inspector, computedView) {
function* testAddTextInFilter(inspector, computedView) {
info("Setting filter text to \"background-color\"");
let win = computedView.styleWindow;
@ -37,11 +37,11 @@ async function testAddTextInFilter(inspector, computedView) {
info("Include browser styles");
checkbox.click();
await inspector.once("computed-view-refreshed");
yield inspector.once("computed-view-refreshed");
searchField.focus();
synthesizeKeys("background-color", win);
await inspector.once("computed-view-refreshed");
yield inspector.once("computed-view-refreshed");
info("Check that the correct properties are visible");
@ -52,7 +52,7 @@ async function testAddTextInFilter(inspector, computedView) {
});
}
async function testEscapeKeypress(inspector, computedView) {
function* testEscapeKeypress(inspector, computedView) {
info("Pressing the escape key on search filter");
let win = computedView.styleWindow;
@ -62,7 +62,7 @@ async function testEscapeKeypress(inspector, computedView) {
searchField.focus();
EventUtils.synthesizeKey("VK_ESCAPE", {}, win);
await onRefreshed;
yield onRefreshed;
info("Check that the correct properties are visible");

22
devtools/client/inspector/computed/test/browser_computed_search-filter_noproperties.js
View File

@ -21,31 +21,31 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
let propertyViews = view.propertyViews;
info("Select the #matches node");
let matchesNode = await getNodeFront("#matches", inspector);
let matchesNode = yield getNodeFront("#matches", inspector);
let onRefresh = inspector.once("computed-view-refreshed");
await selectNode(matchesNode, inspector);
await onRefresh;
yield selectNode(matchesNode, inspector);
yield onRefresh;
ok(propertyViews.filter(p => p.visible).length > 0, "CSS properties are displayed");
ok(view.noResults.hasAttribute("hidden"), "no-results message is hidden");
info("Select a comment node");
let commentNode = await inspector.walker.previousSibling(matchesNode);
await selectNode(commentNode, inspector);
let commentNode = yield inspector.walker.previousSibling(matchesNode);
yield selectNode(commentNode, inspector);
is(propertyViews.filter(p => p.visible).length, 0, "No properties displayed");
ok(!view.noResults.hasAttribute("hidden"), "no-results message is displayed");
info("Select the #matches node again");
onRefresh = inspector.once("computed-view-refreshed");
await selectNode(matchesNode, inspector);
await onRefresh;
yield selectNode(matchesNode, inspector);
yield onRefresh;
ok(propertyViews.filter(p => p.visible).length > 0, "CSS properties are displayed");
ok(view.noResults.hasAttribute("hidden"), "no-results message is hidden");
@ -54,7 +54,7 @@ add_task(async function() {
let searchField = view.searchField;
searchField.focus();
synthesizeKeys("will-not-match", view.styleWindow);
await inspector.once("computed-view-refreshed");
yield inspector.once("computed-view-refreshed");
is(propertyViews.filter(p => p.visible).length, 0, "No properties displayed");
ok(!view.noResults.hasAttribute("hidden"), "no-results message is displayed");

20
devtools/client/inspector/computed/test/browser_computed_select-and-copy-styles-01.js
View File

@ -32,31 +32,31 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("span", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("span", inspector);
await testCopySome(view);
await testCopyAll(view);
yield testCopySome(view);
yield testCopyAll(view);
});
async function testCopySome(view) {
function* testCopySome(view) {
let expectedPattern = "font-family: helvetica, sans-serif;[\\r\\n]+" +
"font-size: 16px;[\\r\\n]+" +
"font-variant-caps: small-caps;[\\r\\n]*";
await copySomeTextAndCheckClipboard(view, {
yield copySomeTextAndCheckClipboard(view, {
start: {prop: 1, offset: 0},
end: {prop: 3, offset: 2}
}, expectedPattern);
}
async function testCopyAll(view) {
function* testCopyAll(view) {
let expectedPattern = "color: rgb\\(255, 255, 0\\);[\\r\\n]+" +
"font-family: helvetica, sans-serif;[\\r\\n]+" +
"font-size: 16px;[\\r\\n]+" +
"font-variant-caps: small-caps;[\\r\\n]*";
await copyAllAndCheckClipboard(view, expectedPattern);
yield copyAllAndCheckClipboard(view, expectedPattern);
}

16
devtools/client/inspector/computed/test/browser_computed_select-and-copy-styles-02.js
View File

@ -8,14 +8,14 @@
const TEST_URI = `<div style="text-align:left;width:25px;">Hello world</div>`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = await openComputedView();
await selectNode("div", inspector);
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let {inspector, view} = yield openComputedView();
yield selectNode("div", inspector);
let expectedPattern = "text-align: left;[\\r\\n]+" +
"width: 25px;[\\r\\n]*";
await copyAllAndCheckClipboard(view, expectedPattern);
yield copyAllAndCheckClipboard(view, expectedPattern);
info("Testing expand then select all copy");
@ -29,8 +29,8 @@ add_task(async function() {
"25px[\\r\\n]*";
info("Expanding computed view properties");
await expandComputedViewPropertyByIndex(view, 0);
await expandComputedViewPropertyByIndex(view, 1);
yield expandComputedViewPropertyByIndex(view, 0);
yield expandComputedViewPropertyByIndex(view, 1);
await copyAllAndCheckClipboard(view, expectedPattern);
yield copyAllAndCheckClipboard(view, expectedPattern);
});

48
devtools/client/inspector/computed/test/browser_computed_style-editor-link.js
View File

@ -41,27 +41,27 @@ const DOCUMENT_URL = "data:text/html;charset=utf-8," + encodeURIComponent(
</body>
</html>`);
add_task(async function() {
await addTab(DOCUMENT_URL);
let {toolbox, inspector, view, testActor} = await openComputedView();
await selectNode("span", inspector);
add_task(function* () {
yield addTab(DOCUMENT_URL);
let {toolbox, inspector, view, testActor} = yield openComputedView();
yield selectNode("span", inspector);
await testInlineStyle(view);
await testFirstInlineStyleSheet(view, toolbox, testActor);
await testSecondInlineStyleSheet(view, toolbox, testActor);
await testExternalStyleSheet(view, toolbox, testActor);
yield testInlineStyle(view);
yield testFirstInlineStyleSheet(view, toolbox, testActor);
yield testSecondInlineStyleSheet(view, toolbox, testActor);
yield testExternalStyleSheet(view, toolbox, testActor);
});
async function testInlineStyle(view) {
function* testInlineStyle(view) {
info("Testing inline style");
await expandComputedViewPropertyByIndex(view, 0);
yield expandComputedViewPropertyByIndex(view, 0);
let onTab = waitForTab();
info("Clicking on the first rule-link in the computed-view");
clickLinkByIndex(view, 0);
let tab = await onTab;
let tab = yield onTab;
let tabURI = tab.linkedBrowser.documentURI.spec;
ok(tabURI.startsWith("view-source:"), "View source tab is open");
@ -69,7 +69,7 @@ async function testInlineStyle(view) {
gBrowser.removeTab(tab);
}
async function testFirstInlineStyleSheet(view, toolbox, testActor) {
function* testFirstInlineStyleSheet(view, toolbox, testActor) {
info("Testing inline stylesheet");
info("Listening for toolbox switch to the styleeditor");
@ -77,14 +77,14 @@ async function testFirstInlineStyleSheet(view, toolbox, testActor) {
info("Clicking an inline stylesheet");
clickLinkByIndex(view, 2);
let editor = await onSwitch;
let editor = yield onSwitch;
ok(true, "Switched to the style-editor panel in the toolbox");
await validateStyleEditorSheet(editor, 0, testActor);
yield validateStyleEditorSheet(editor, 0, testActor);
}
async function testSecondInlineStyleSheet(view, toolbox, testActor) {
function* testSecondInlineStyleSheet(view, toolbox, testActor) {
info("Testing second inline stylesheet");
info("Waiting for the stylesheet editor to be selected");
@ -92,18 +92,18 @@ async function testSecondInlineStyleSheet(view, toolbox, testActor) {
let onSelected = panel.UI.once("editor-selected");
info("Switching back to the inspector panel in the toolbox");
await toolbox.selectTool("inspector");
yield toolbox.selectTool("inspector");
info("Clicking on second inline stylesheet link");
clickLinkByIndex(view, 4);
let editor = await onSelected;
let editor = yield onSelected;
is(toolbox.currentToolId, "styleeditor",
"The style editor is selected again");
await validateStyleEditorSheet(editor, 1, testActor);
yield validateStyleEditorSheet(editor, 1, testActor);
}
async function testExternalStyleSheet(view, toolbox, testActor) {
function* testExternalStyleSheet(view, toolbox, testActor) {
info("Testing external stylesheet");
info("Waiting for the stylesheet editor to be selected");
@ -111,20 +111,20 @@ async function testExternalStyleSheet(view, toolbox, testActor) {
let onSelected = panel.UI.once("editor-selected");
info("Switching back to the inspector panel in the toolbox");
await toolbox.selectTool("inspector");
yield toolbox.selectTool("inspector");
info("Clicking on an external stylesheet link");
clickLinkByIndex(view, 1);
let editor = await onSelected;
let editor = yield onSelected;
is(toolbox.currentToolId, "styleeditor",
"The style editor is selected again");
await validateStyleEditorSheet(editor, 2, testActor);
yield validateStyleEditorSheet(editor, 2, testActor);
}
async function validateStyleEditorSheet(editor, expectedSheetIndex, testActor) {
function* validateStyleEditorSheet(editor, expectedSheetIndex, testActor) {
info("Validating style editor stylesheet");
let expectedHref = await testActor.eval(`
let expectedHref = yield testActor.eval(`
document.styleSheets[${expectedSheetIndex}].href;
`);
is(editor.styleSheet.href, expectedHref,

14
devtools/client/inspector/computed/test/head.js
View File

@ -82,7 +82,7 @@ function getComputedViewPropertyView(view, name) {
* @return {Promise} A promise that resolves to the property matched rules
* container
*/
var getComputedViewMatchedRules = async function(view, name) {
var getComputedViewMatchedRules = Task.async(function* (view, name) {
let expander;
let propertyContent;
for (let property of view.styleDocument.querySelectorAll(".computed-property-view")) {
@ -98,11 +98,11 @@ var getComputedViewMatchedRules = async function(view, name) {
// Need to expand the property
let onExpand = view.inspector.once("computed-view-property-expanded");
expander.click();
await onExpand;
yield onExpand;
}
return propertyContent;
};
});
/**
* Get the text value of the property corresponding to a given name in the
@ -175,14 +175,14 @@ function selectAllText(view) {
* @param {String} expectedPattern
* A regular expression used to check the content of the clipboard
*/
async function copyAllAndCheckClipboard(view, expectedPattern) {
function* copyAllAndCheckClipboard(view, expectedPattern) {
selectAllText(view);
let contentDoc = view.styleDocument;
let prop = contentDoc.querySelector(".computed-property-view");
try {
info("Trigger a copy event and wait for the clipboard content");
await waitForClipboardPromise(() => fireCopyEvent(prop),
yield waitForClipboardPromise(() => fireCopyEvent(prop),
() => checkClipboard(expectedPattern));
} catch (e) {
failClipboardCheck(expectedPattern);
@ -201,7 +201,7 @@ async function copyAllAndCheckClipboard(view, expectedPattern) {
* @param {String} expectedPattern
* A regular expression used to check the content of the clipboard
*/
async function copySomeTextAndCheckClipboard(view, positions, expectedPattern) {
function* copySomeTextAndCheckClipboard(view, positions, expectedPattern) {
info("Testing selection copy");
let contentDocument = view.styleDocument;
@ -215,7 +215,7 @@ async function copySomeTextAndCheckClipboard(view, positions, expectedPattern) {
try {
info("Trigger a copy event and wait for the clipboard content");
await waitForClipboardPromise(() => fireCopyEvent(props[0]),
yield waitForClipboardPromise(() => fireCopyEvent(props[0]),
() => checkClipboard(expectedPattern));
} catch (e) {
failClipboardCheck(expectedPattern);

16
devtools/client/inspector/fonts/test/browser_fontinspector.js
View File

@ -28,21 +28,21 @@ const FONTS = [{
cssName: "barnormal"
}];
add_task(async function() {
let { inspector, view } = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
let { inspector, view } = yield openFontInspectorForURL(TEST_URI);
ok(!!view, "Font inspector document is alive.");
let viewDoc = view.document;
await testBodyFonts(inspector, viewDoc);
await testDivFonts(inspector, viewDoc);
yield testBodyFonts(inspector, viewDoc);
yield testDivFonts(inspector, viewDoc);
});
function isRemote(fontLi) {
return fontLi.querySelector(".font-origin").classList.contains("remote");
}
function testBodyFonts(inspector, viewDoc) {
function* testBodyFonts(inspector, viewDoc) {
let lis = getUsedFontsEls(viewDoc);
is(lis.length, 5, "Found 5 fonts");
@ -70,10 +70,10 @@ function testBodyFonts(inspector, viewDoc) {
ok(!isRemote(lis[4]), "local font is local");
}
async function testDivFonts(inspector, viewDoc) {
function* testDivFonts(inspector, viewDoc) {
let updated = inspector.once("fontinspector-updated");
await selectNode("div", inspector);
await updated;
yield selectNode("div", inspector);
yield updated;
let lis = getUsedFontsEls(viewDoc);
is(lis.length, 1, "Found 1 font on DIV");

10
devtools/client/inspector/fonts/test/browser_fontinspector_edit-previews.js
View File

@ -9,23 +9,23 @@
const TEST_URI = URL_ROOT + "browser_fontinspector.html";
add_task(async function() {
let {view} = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
let {view} = yield openFontInspectorForURL(TEST_URI);
let viewDoc = view.document;
let previews = viewDoc.querySelectorAll("#font-container .font-preview");
let initialPreviews = [...previews].map(p => p.src);
info("Typing 'Abc' to check that the reference previews are correct.");
await updatePreviewText(view, "Abc");
yield updatePreviewText(view, "Abc");
checkPreviewImages(viewDoc, initialPreviews, true);
info("Typing something else to the preview box.");
await updatePreviewText(view, "The quick brown");
yield updatePreviewText(view, "The quick brown");
checkPreviewImages(viewDoc, initialPreviews, false);
info("Blanking the input to restore default previews.");
await updatePreviewText(view, "");
yield updatePreviewText(view, "");
checkPreviewImages(viewDoc, initialPreviews, true);
});

8
devtools/client/inspector/fonts/test/browser_fontinspector_expand-css-code.js
View File

@ -8,8 +8,8 @@
const TEST_URI = URL_ROOT + "browser_fontinspector.html";
add_task(async function() {
let { view } = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
let { view } = yield openFontInspectorForURL(TEST_URI);
let viewDoc = view.document;
info("Checking that the css font-face rule is collapsed by default");
@ -27,7 +27,7 @@ add_task(async function() {
let expander = fontEl.querySelector(".font-css-code .theme-twisty");
expander.click();
await onExpanded;
yield onExpanded;
ok(true, "Font-face rule is now expanded");
@ -45,7 +45,7 @@ add_task(async function() {
expander = fontEl.querySelector(".font-css-code .font-css-code-expander");
expander.click();
await onExpanded;
yield onExpanded;
ok(true, "Font-face rule is now expanded too");
});

10
devtools/client/inspector/fonts/test/browser_fontinspector_other-fonts.js
View File

@ -10,15 +10,15 @@
const TEST_URI = URL_ROOT + "browser_fontinspector.html";
add_task(async function() {
const { inspector, view } = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
const { inspector, view } = yield openFontInspectorForURL(TEST_URI);
const viewDoc = view.document;
let otherFontsAccordion = viewDoc.querySelector("#font-container .accordion");
ok(otherFontsAccordion, "There's an accordion in the panel");
is(otherFontsAccordion.textContent, "Other fonts in page", "It has the right title");
await expandOtherFontsAccordion(viewDoc);
yield expandOtherFontsAccordion(viewDoc);
let otherFontsEls = getOtherFontsEls(viewDoc);
is(otherFontsEls.length, 1, "There is one font listed in the other fonts section");
@ -28,8 +28,8 @@ add_task(async function() {
"The other font listed is the right one");
info("Checking that fonts of the current element aren't listed");
await selectNode(".bold-text", inspector);
await expandOtherFontsAccordion(viewDoc);
yield selectNode(".bold-text", inspector);
yield expandOtherFontsAccordion(viewDoc);
otherFontsEls = getOtherFontsEls(viewDoc);
for (let otherFontEl of otherFontsEls) {

10
devtools/client/inspector/fonts/test/browser_fontinspector_text-node.js
View File

@ -8,14 +8,14 @@
const TEST_URI = URL_ROOT + "browser_fontinspector.html";
add_task(async function() {
let { inspector, view } = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
let { inspector, view } = yield openFontInspectorForURL(TEST_URI);
let viewDoc = view.document;
info("Selecting the first text-node first-child of <body>");
let bodyNode = await getNodeFront("body", inspector);
let { nodes } = await inspector.walker.children(bodyNode);
await selectNode(nodes[0], inspector);
let bodyNode = yield getNodeFront("body", inspector);
let { nodes } = yield inspector.walker.children(bodyNode);
yield selectNode(nodes[0], inspector);
let lis = getUsedFontsEls(viewDoc);
is(lis.length, 1, "Font inspector shows 1 font");

14
devtools/client/inspector/fonts/test/browser_fontinspector_theme-change.js
View File

@ -17,11 +17,11 @@ registerCleanupFunction(() => {
setTheme(originalTheme);
});
add_task(async function() {
let { inspector, view } = await openFontInspectorForURL(TEST_URI);
add_task(function* () {
let { inspector, view } = yield openFontInspectorForURL(TEST_URI);
let { document: doc } = view;
await selectNode(".normal-text", inspector);
yield selectNode(".normal-text", inspector);
// Store the original preview URI for later comparison.
let originalURI = doc.querySelector("#font-container .font-preview").src;
@ -29,11 +29,11 @@ add_task(async function() {
info(`Original theme was '${originalTheme}'.`);
await setThemeAndWaitForUpdate(newTheme, inspector);
yield setThemeAndWaitForUpdate(newTheme, inspector);
isnot(doc.querySelector("#font-container .font-preview").src, originalURI,
"The preview image changed with the theme.");
await setThemeAndWaitForUpdate(originalTheme, inspector);
yield setThemeAndWaitForUpdate(originalTheme, inspector);
is(doc.querySelector("#font-container .font-preview").src, originalURI,
"The preview image is correct after the original theme was restored.");
});
@ -44,12 +44,12 @@ add_task(async function() {
* @param {String} theme - the new theme
* @param {Object} inspector - the inspector panel
*/
async function setThemeAndWaitForUpdate(theme, inspector) {
function* setThemeAndWaitForUpdate(theme, inspector) {
let onUpdated = inspector.once("fontinspector-updated");
info(`Setting theme to '${theme}'.`);
setTheme(theme);
info("Waiting for font-inspector to update.");
await onUpdated;
yield onUpdated;
}

24
devtools/client/inspector/fonts/test/head.js
View File

@ -23,10 +23,10 @@ registerCleanupFunction(() => {
* updating. We also need to wait for the fontinspector-updated event.
*/
var _selectNode = selectNode;
selectNode = async function(node, inspector, reason) {
selectNode = function* (node, inspector, reason) {
let onUpdated = inspector.once("fontinspector-updated");
await _selectNode(node, inspector, reason);
await onUpdated;
yield _selectNode(node, inspector, reason);
yield onUpdated;
};
/**
@ -34,21 +34,21 @@ selectNode = async function(node, inspector, reason) {
* font-inspector tab.
* @return {Promise} resolves to a {toolbox, inspector, view} object
*/
var openFontInspectorForURL = async function(url) {
await addTab(url);
let {toolbox, inspector} = await openInspector();
var openFontInspectorForURL = Task.async(function* (url) {
yield addTab(url);
let {toolbox, inspector} = yield openInspector();
// Call selectNode again here to force a fontinspector update since we don't
// know if the fontinspector-updated event has been sent while the inspector
// was being opened or not.
await selectNode("body", inspector);
yield selectNode("body", inspector);
return {
toolbox,
inspector,
view: inspector.fontinspector
};
};
});
/**
* Focus one of the preview inputs, clear it, type new text into it and wait for the
@ -57,7 +57,7 @@ var openFontInspectorForURL = async function(url) {
* @param {FontInspector} view - The FontInspector instance.
* @param {String} text - The text to preview.
*/
async function updatePreviewText(view, text) {
function* updatePreviewText(view, text) {
info(`Changing the preview text to '${text}'`);
let doc = view.document;
@ -66,7 +66,7 @@ async function updatePreviewText(view, text) {
info("Clicking the font preview element to turn it to edit mode");
let onClick = once(doc, "click");
previewImg.click();
await onClick;
yield onClick;
let input = previewImg.parentNode.querySelector("input");
is(doc.activeElement, input, "The input was focused.");
@ -75,14 +75,14 @@ async function updatePreviewText(view, text) {
while (input.value.length) {
let update = view.inspector.once("fontinspector-updated");
EventUtils.sendKey("BACK_SPACE", doc.defaultView);
await update;
yield update;
}
if (text) {
info("Typing the specified text to the input field.");
let update = waitForNEvents(view.inspector, "fontinspector-updated", text.length);
EventUtils.sendString(text, doc.defaultView);
await update;
yield update;
}
is(input.value, text, "The input now contains the correct text.");

22
devtools/client/inspector/grids/test/browser_grids_accordion-state.js
View File

@ -20,19 +20,19 @@ const TEST_URI = `
const GRID_OPENED_PREF = "devtools.layout.grid.opened";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, toolbox } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, toolbox } = yield openLayoutView();
let { document: doc } = gridInspector;
await testAccordionStateAfterClickingHeader(doc);
await testAccordionStateAfterSwitchingSidebars(inspector, doc);
await testAccordionStateAfterReopeningLayoutView(toolbox);
yield testAccordionStateAfterClickingHeader(doc);
yield testAccordionStateAfterSwitchingSidebars(inspector, doc);
yield testAccordionStateAfterReopeningLayoutView(toolbox);
Services.prefs.clearUserPref(GRID_OPENED_PREF);
});
function testAccordionStateAfterClickingHeader(doc) {
function* testAccordionStateAfterClickingHeader(doc) {
let header = doc.querySelector(".grid-pane ._header");
let gContent = doc.querySelector(".grid-pane ._content");
@ -49,7 +49,7 @@ function testAccordionStateAfterClickingHeader(doc) {
ok(!Services.prefs.getBoolPref(GRID_OPENED_PREF), `${GRID_OPENED_PREF} is pref off.`);
}
function testAccordionStateAfterSwitchingSidebars(inspector, doc) {
function* testAccordionStateAfterSwitchingSidebars(inspector, doc) {
info("Checking the grid accordion state is persistent after switching sidebars.");
let gContent = doc.querySelector(".grid-pane ._content");
@ -65,15 +65,15 @@ function testAccordionStateAfterSwitchingSidebars(inspector, doc) {
ok(!Services.prefs.getBoolPref(GRID_OPENED_PREF), `${GRID_OPENED_PREF} is pref off.`);
}
async function testAccordionStateAfterReopeningLayoutView(toolbox) {
function* testAccordionStateAfterReopeningLayoutView(toolbox) {
info("Checking the grid accordion state is persistent after closing and re-opening the "
+ "layout view.");
info("Closing the toolbox.");
await toolbox.destroy();
yield toolbox.destroy();
info("Re-opening the layout view.");
let { gridInspector } = await openLayoutView();
let { gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let gContent = doc.querySelector(".grid-pane ._content");

18
devtools/client/inspector/grids/test/browser_grids_color-in-rules-grid-toggle.js
View File

@ -18,9 +18,9 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
let cPicker = gridInspector.getSwatchColorPickerTooltip();
@ -33,9 +33,9 @@ add_task(async function() {
info("Opening the color picker by clicking on the #grid color swatch.");
let onColorPickerReady = cPicker.once("ready");
swatch.click();
await onColorPickerReady;
yield onColorPickerReady;
await simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
yield simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
"The color swatch's background was updated.");
@ -45,8 +45,8 @@ add_task(async function() {
state.grids[0].color === "#00FF0080");
let onColorPickerHidden = cPicker.tooltip.once("hidden");
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
await onColorPickerHidden;
await onGridColorUpdate;
yield onColorPickerHidden;
yield onGridColorUpdate;
is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
"The color swatch's background was kept after RETURN.");
@ -55,7 +55,7 @@ add_task(async function() {
let ruleView = selectRuleView(inspector);
let highlighters = ruleView.highlighters;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let container = getRuleViewProperty(ruleView, "#grid", "display").valueSpan;
let gridToggle = container.querySelector(".ruleview-grid");
@ -78,5 +78,5 @@ add_task(async function() {
}
);
gridToggle.click();
await onHighlighterShown;
yield onHighlighterShown;
});

12
devtools/client/inspector/grids/test/browser_grids_display-setting-extend-grid-lines.js
View File

@ -20,13 +20,13 @@ const TEST_URI = `
const SHOW_INFINITE_LINES_PREF = "devtools.gridinspector.showInfiniteLines";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let checkbox = doc.getElementById("grid-setting-extend-grid-lines");
ok(!Services.prefs.getBoolPref(SHOW_INFINITE_LINES_PREF),
@ -36,13 +36,13 @@ add_task(async function() {
let onCheckboxChange = waitUntilState(store, state =>
state.highlighterSettings.showInfiniteLines);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
info("Toggling OFF the 'Extend grid lines infinitely' setting.");
onCheckboxChange = waitUntilState(store, state =>
!state.highlighterSettings.showInfiniteLines);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
ok(!Services.prefs.getBoolPref(SHOW_INFINITE_LINES_PREF),
"'Extend grid lines infinitely' is pref off.");

12
devtools/client/inspector/grids/test/browser_grids_display-setting-show-grid-areas.js
View File

@ -20,13 +20,13 @@ const TEST_URI = `
const SHOW_GRID_AREAS_PREF = "devtools.gridinspector.showGridAreas";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let checkbox = doc.getElementById("grid-setting-show-grid-areas");
ok(!Services.prefs.getBoolPref(SHOW_GRID_AREAS_PREF),
@ -36,13 +36,13 @@ add_task(async function() {
let onCheckboxChange = waitUntilState(store, state =>
state.highlighterSettings.showGridAreasOverlay);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
info("Toggling OFF the 'Display grid areas' setting.");
onCheckboxChange = waitUntilState(store, state =>
!state.highlighterSettings.showGridAreasOverlay);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
ok(!Services.prefs.getBoolPref(SHOW_GRID_AREAS_PREF),
"'Display grid areas' is pref off.");

12
devtools/client/inspector/grids/test/browser_grids_display-setting-show-grid-line-numbers.js
View File

@ -20,13 +20,13 @@ const TEST_URI = `
const SHOW_GRID_LINE_NUMBERS = "devtools.gridinspector.showGridLineNumbers";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let checkbox = doc.getElementById("grid-setting-show-grid-line-numbers");
info("Checking the initial state of the CSS grid highlighter setting.");
@ -37,7 +37,7 @@ add_task(async function() {
let onCheckboxChange = waitUntilState(store, state =>
state.highlighterSettings.showGridLineNumbers);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
ok(Services.prefs.getBoolPref(SHOW_GRID_LINE_NUMBERS),
"'Display numbers on lines' is pref on.");
@ -46,7 +46,7 @@ add_task(async function() {
onCheckboxChange = waitUntilState(store, state =>
!state.highlighterSettings.showGridLineNumbers);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
ok(!Services.prefs.getBoolPref(SHOW_GRID_LINE_NUMBERS),
"'Display numbers on lines' is pref off.");

14
devtools/client/inspector/grids/test/browser_grids_grid-list-color-picker-on-ESC.js
View File

@ -18,9 +18,9 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
let cPicker = gridInspector.getSwatchColorPickerTooltip();
@ -38,9 +38,9 @@ add_task(async function() {
info("Opening the color picker by clicking on the #grid color swatch.");
let onColorPickerReady = cPicker.once("ready");
swatch.click();
await onColorPickerReady;
yield onColorPickerReady;
await simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
yield simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
"The color swatch's background was updated.");
@ -50,8 +50,8 @@ add_task(async function() {
state.grids[0].color === "#9400FF");
let onColorPickerHidden = cPicker.tooltip.once("hidden");
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "ESCAPE");
await onColorPickerHidden;
await onGridColorUpdate;
yield onColorPickerHidden;
yield onGridColorUpdate;
is(swatch.style.backgroundColor, "rgb(148, 0, 255)",
"The color swatch's background was reverted after ESCAPE.");

14
devtools/client/inspector/grids/test/browser_grids_grid-list-color-picker-on-RETURN.js
View File

@ -18,9 +18,9 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
let cPicker = gridInspector.getSwatchColorPickerTooltip();
@ -38,9 +38,9 @@ add_task(async function() {
info("Opening the color picker by clicking on the #grid color swatch.");
let onColorPickerReady = cPicker.once("ready");
swatch.click();
await onColorPickerReady;
yield onColorPickerReady;
await simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
yield simulateColorPickerChange(cPicker, [0, 255, 0, .5]);
is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
"The color swatch's background was updated.");
@ -50,8 +50,8 @@ add_task(async function() {
state.grids[0].color === "#00FF0080");
let onColorPickerHidden = cPicker.tooltip.once("hidden");
focusAndSendKey(spectrum.element.ownerDocument.defaultView, "RETURN");
await onColorPickerHidden;
await onGridColorUpdate;
yield onColorPickerHidden;
yield onGridColorUpdate;
is(swatch.style.backgroundColor, "rgba(0, 255, 0, 0.5)",
"The color swatch's background was kept after RETURN.");

10
devtools/client/inspector/grids/test/browser_grids_grid-list-element-rep.js
View File

@ -18,9 +18,9 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, toolbox } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, toolbox } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
@ -32,7 +32,7 @@ add_task(async function() {
info("Listen to node-highlight event and mouse over the widget");
let onHighlight = toolbox.once("node-highlight");
EventUtils.synthesizeMouse(elementRep, 10, 5, {type: "mouseover"}, doc.defaultView);
let nodeFront = await onHighlight;
let nodeFront = yield onHighlight;
ok(nodeFront, "nodeFront was returned from highlighting the node.");
is(nodeFront.tagName, "DIV", "The highlighted node has the correct tagName.");
@ -42,7 +42,7 @@ add_task(async function() {
let onSelection = inspector.selection.once("new-node-front");
EventUtils.sendMouseEvent({type: "click"}, elementRep, doc.defaultView);
await onSelection;
yield onSelection;
is(inspector.selection.nodeFront, store.getState().grids[0].nodeFront,
"The selected node is the one stored on the grid item's state.");

8
devtools/client/inspector/grids/test/browser_grids_grid-list-no-grids.js
View File

@ -15,13 +15,13 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let noGridList = doc.querySelector(".grid-pane .devtools-sidepanel-no-result");
let gridList = doc.getElementById("grid-list");

20
devtools/client/inspector/grids/test/browser_grids_grid-list-on-iframe-reloaded.js
View File

@ -9,16 +9,16 @@
const TEST_URI = URL_ROOT + "doc_iframe_reloaded.html";
add_task(async function() {
await addTab(TEST_URI);
add_task(function* () {
yield addTab(TEST_URI);
const { inspector, gridInspector, testActor } = await openLayoutView();
const { inspector, gridInspector, testActor } = yield openLayoutView();
const { document: doc } = gridInspector;
const { store, highlighters } = inspector;
const gridList = doc.querySelector("#grid-list");
info("Clicking on the first checkbox to highlight the grid");
await enableTheFirstGrid(doc, inspector);
yield enableTheFirstGrid(doc, inspector);
is(gridList.childNodes.length, 1, "There's one grid in the list");
let checkbox = gridList.querySelector("input");
@ -33,19 +33,19 @@ add_task(async function() {
!state.grids[0].highlighted);
const onHighlighterHidden = highlighters.once("grid-highlighter-hidden");
testActor.eval("window.wrappedJSObject.reloadIFrame();");
await onNewListUnchecked;
await onHighlighterHidden;
yield onNewListUnchecked;
yield onHighlighterHidden;
is(gridList.childNodes.length, 1, "There's still one grid in the list");
info("Highlight the first grid again to make sure this still works");
await enableTheFirstGrid(doc, inspector);
yield enableTheFirstGrid(doc, inspector);
is(gridList.childNodes.length, 1, "There's again one grid in the list");
ok(highlighters.gridHighlighterShown, "There's a highlighter shown");
});
async function enableTheFirstGrid(doc, { highlighters, store }) {
function* enableTheFirstGrid(doc, { highlighters, store }) {
const checkbox = doc.querySelector("#grid-list input");
const onHighlighterShown = highlighters.once("grid-highlighter-shown");
@ -54,6 +54,6 @@ async function enableTheFirstGrid(doc, { highlighters, store }) {
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
}

20
devtools/client/inspector/grids/test/browser_grids_grid-list-on-mutation-element-added.js
View File

@ -21,13 +21,13 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, testActor } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, testActor } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let gridList = doc.getElementById("grid-list");
let checkbox1 = gridList.children[0].querySelector("input");
@ -40,7 +40,7 @@ add_task(async function() {
info("Toggling ON the CSS grid highlighter from the layout panel.");
let onHighlighterShown = highlighters.once("grid-highlighter-shown");
checkbox1.click();
await onHighlighterShown;
yield onHighlighterShown;
info("Checking the CSS grid highlighter is created.");
ok(highlighters.highlighters[HIGHLIGHTER_TYPE],
@ -55,7 +55,7 @@ add_task(async function() {
testActor.eval(`
document.getElementById("grid2").classList.add("grid");
`);
await onGridListUpdate;
yield onGridListUpdate;
info("Checking the new Grid Inspector state.");
is(gridList.childNodes.length, 2, "Two grid containers are listed.");
@ -72,8 +72,8 @@ add_task(async function() {
!state.grids[0].highlighted &&
state.grids[1].highlighted);
checkbox2.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is still shown.");
ok(highlighters.gridHighlighterShown, "CSS grid highlighter is shown.");
@ -85,8 +85,8 @@ add_task(async function() {
!state.grids[0].highlighted &&
!state.grids[1].highlighted);
checkbox2.click();
await onHighlighterHidden;
await onCheckboxChange;
yield onHighlighterHidden;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is not shown.");
ok(!highlighters.gridHighlighterShown, "No CSS grid highlighter is shown.");

16
devtools/client/inspector/grids/test/browser_grids_grid-list-on-mutation-element-removed.js
View File

@ -18,13 +18,13 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, testActor } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, testActor } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let gridList = doc.getElementById("grid-list");
let checkbox = gridList.children[0].querySelector("input");
@ -39,8 +39,8 @@ add_task(async function() {
let onCheckboxChange = waitUntilState(store, state =>
state.grids.length == 1 && state.grids[0].highlighted);
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is created.");
ok(highlighters.highlighters[HIGHLIGHTER_TYPE],
@ -53,8 +53,8 @@ add_task(async function() {
testActor.eval(`
document.getElementById("grid").remove();
`);
await onHighlighterHidden;
await onCheckboxChange;
yield onHighlighterHidden;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is not shown.");
ok(!highlighters.gridHighlighterShown, "No CSS grid highlighter is shown.");

20
devtools/client/inspector/grids/test/browser_grids_grid-list-toggle-multiple-grids.js
View File

@ -22,13 +22,13 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid1", inspector);
yield selectNode("#grid1", inspector);
let gridList = doc.getElementById("grid-list");
let checkbox1 = gridList.children[0].querySelector("input");
let checkbox2 = gridList.children[1].querySelector("input");
@ -48,8 +48,8 @@ add_task(async function() {
state.grids[0].highlighted &&
!state.grids[1].highlighted);
checkbox1.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is created.");
ok(highlighters.highlighters[HIGHLIGHTER_TYPE],
@ -63,8 +63,8 @@ add_task(async function() {
!state.grids[0].highlighted &&
state.grids[1].highlighted);
checkbox2.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is still shown.");
ok(highlighters.gridHighlighterShown, "CSS grid highlighter is shown.");
@ -76,8 +76,8 @@ add_task(async function() {
!state.grids[0].highlighted &&
!state.grids[1].highlighted);
checkbox2.click();
await onHighlighterHidden;
await onCheckboxChange;
yield onHighlighterHidden;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is not shown.");
ok(!highlighters.gridHighlighterShown, "No CSS grid highlighter is shown.");

16
devtools/client/inspector/grids/test/browser_grids_grid-list-toggle-single-grid.js
View File

@ -17,13 +17,13 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { gridInspector, inspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { gridInspector, inspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let gridList = doc.getElementById("grid-list");
let checkbox = gridList.children[0].querySelector("input");
@ -40,8 +40,8 @@ add_task(async function() {
state.grids.length == 1 &&
state.grids[0].highlighted);
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is created.");
ok(highlighters.highlighters[HIGHLIGHTER_TYPE],
@ -54,8 +54,8 @@ add_task(async function() {
state.grids.length == 1 &&
!state.grids[0].highlighted);
checkbox.click();
await onHighlighterHidden;
await onCheckboxChange;
yield onHighlighterHidden;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is not shown.");
ok(!highlighters.gridHighlighterShown, "No CSS grid highlighter is shown.");

14
devtools/client/inspector/grids/test/browser_grids_grid-outline-cannot-show-outline.js
View File

@ -20,14 +20,14 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let outline = doc.getElementById("grid-outline-container");
let gridList = doc.getElementById("grid-list");
let checkbox = gridList.children[0].querySelector("input");
@ -39,9 +39,9 @@ add_task(async function() {
state.grids.length == 1 &&
state.grids[0].highlighted);
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
let elements = await onGridOutlineRendered;
yield onHighlighterShown;
yield onCheckboxChange;
let elements = yield onGridOutlineRendered;
let cannotShowGridOutline = elements[0];

14
devtools/client/inspector/grids/test/browser_grids_grid-outline-highlight-area.js
View File

@ -27,10 +27,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
@ -47,9 +47,9 @@ add_task(async function() {
state.grids.length == 1 &&
state.grids[0].highlighted);
checkbox.click();
await onCheckboxChange;
await onHighlighterShown;
let elements = await onGridOutlineRendered;
yield onCheckboxChange;
yield onHighlighterShown;
let elements = yield onGridOutlineRendered;
let gridCellA = elements[0];
@ -67,5 +67,5 @@ add_task(async function() {
is(showGridArea, "header", "Grid area name should be 'header'.");
});
EventUtils.synthesizeMouse(gridCellA, 1, 1, {type: "mouseover"}, doc.defaultView);
await onCellAHighlight;
yield onCellAHighlight;
});

14
devtools/client/inspector/grids/test/browser_grids_grid-outline-highlight-cell.js
View File

@ -18,10 +18,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
@ -38,9 +38,9 @@ add_task(async function() {
state.grids.length == 1 &&
state.grids[0].highlighted);
checkbox.click();
await onCheckboxChange;
await onHighlighterShown;
let elements = await onGridOutlineRendered;
yield onCheckboxChange;
yield onHighlighterShown;
let elements = yield onGridOutlineRendered;
let gridCellA = elements[0];
@ -56,5 +56,5 @@ add_task(async function() {
is(columnNumber, 1, "Should be the first grid column.");
});
EventUtils.synthesizeMouse(gridCellA, 1, 1, {type: "mouseover"}, doc.defaultView);
await onCellAHighlight;
yield onCellAHighlight;
});

12
devtools/client/inspector/grids/test/browser_grids_grid-outline-selected-grid.js
View File

@ -18,10 +18,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
@ -39,9 +39,9 @@ add_task(async function() {
state.grids[0].highlighted);
let onGridOutlineRendered = waitForDOM(doc, "#grid-cell-group rect", 3);
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
let elements = await onGridOutlineRendered;
yield onHighlighterShown;
yield onCheckboxChange;
let elements = yield onGridOutlineRendered;
info("Checking the grid outline is shown.");
is(elements.length, 3, "Grid outline is shown.");

16
devtools/client/inspector/grids/test/browser_grids_grid-outline-updates-on-grid-change.js
View File

@ -20,10 +20,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector, testActor } = await openLayoutView();
let { inspector, gridInspector, testActor } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
@ -37,9 +37,9 @@ add_task(async function() {
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
let elements = await onGridOutlineRendered;
yield onHighlighterShown;
yield onCheckboxChange;
let elements = yield onGridOutlineRendered;
info("Checking the grid outline is shown.");
is(elements.length, 2, "Grid outline is shown.");
@ -62,8 +62,8 @@ add_task(async function() {
document.querySelector(".container").appendChild(div);
`);
await onReflow;
elements = await onGridOutlineChanged;
yield onReflow;
elements = yield onGridOutlineChanged;
info("Checking the grid outline is correct.");
is(elements.length, 4, "Grid outline was changed.");

12
devtools/client/inspector/grids/test/browser_grids_highlighter-setting-rules-grid-toggle.js
View File

@ -20,9 +20,9 @@ const TEST_URI = `
const SHOW_INFINITE_LINES_PREF = "devtools.gridinspector.showInfiniteLines";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
@ -35,13 +35,13 @@ add_task(async function() {
let onCheckboxChange = waitUntilState(store, state =>
state.highlighterSettings.showInfiniteLines);
checkbox.click();
await onCheckboxChange;
yield onCheckboxChange;
info("Selecting the rule view.");
let ruleView = selectRuleView(inspector);
let highlighters = ruleView.highlighters;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let container = getRuleViewProperty(ruleView, "#grid", "display").valueSpan;
let gridToggle = container.querySelector(".ruleview-grid");
@ -64,7 +64,7 @@ add_task(async function() {
}
);
gridToggle.click();
await onHighlighterShown;
yield onHighlighterShown;
Services.prefs.clearUserPref(SHOW_INFINITE_LINES_PREF);
});

10
devtools/client/inspector/grids/test/browser_grids_no_fragments.js
View File

@ -23,10 +23,10 @@ const TEST_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { inspector, gridInspector } = await openLayoutView();
let { inspector, gridInspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { store } = inspector;
@ -38,12 +38,12 @@ add_task(async function() {
let onCheckbox1Change = waitUntilState(store, state =>
state.grids[0] && state.grids[0].highlighted);
checkbox1.click();
await onCheckbox1Change;
yield onCheckbox1Change;
info("Try to click the second grid's checkbox");
let checkbox2 = gridList.children[1].querySelector("input");
let onCheckbox2Change = waitUntilState(store, state =>
state.grids[1] && state.grids[1].highlighted);
checkbox2.click();
await onCheckbox2Change;
yield onCheckbox2Change;
});

10
devtools/client/inspector/grids/test/browser_grids_number-of-css-grids-telemetry.js
View File

@ -24,18 +24,18 @@ const TEST_URI2 = `
const CSS_GRID_COUNT_HISTOGRAM_ID = "DEVTOOLS_NUMBER_OF_CSS_GRIDS_IN_A_PAGE";
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI1));
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI1));
let { inspector } = await openLayoutView();
let { inspector } = yield openLayoutView();
let { store } = inspector;
info("Navigate to TEST_URI2");
let onGridListUpdate = waitUntilState(store, state => state.grids.length == 1);
await navigateTo(inspector,
yield navigateTo(inspector,
"data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI2));
await onGridListUpdate;
yield onGridListUpdate;
let histogram = Services.telemetry.getHistogramById(CSS_GRID_COUNT_HISTOGRAM_ID);
let snapshot = histogram.snapshot();

24
devtools/client/inspector/grids/test/browser_grids_restored-after-reload.js
View File

@ -32,13 +32,13 @@ const OTHER_URI = `
</div>
`;
add_task(async function() {
await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { gridInspector, inspector } = await openLayoutView();
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
let { gridInspector, inspector } = yield openLayoutView();
let { document: doc } = gridInspector;
let { highlighters, store } = inspector;
await selectNode("#grid", inspector);
yield selectNode("#grid", inspector);
let gridList = doc.getElementById("grid-list");
let checkbox = gridList.children[0].querySelector("input");
@ -48,8 +48,8 @@ add_task(async function() {
state.grids.length == 1 &&
state.grids[0].highlighted);
checkbox.click();
await onHighlighterShown;
await onCheckboxChange;
yield onHighlighterShown;
yield onCheckboxChange;
info("Checking the CSS grid highlighter is created.");
ok(highlighters.highlighters[HIGHLIGHTER_TYPE],
@ -62,9 +62,9 @@ add_task(async function() {
let onGridListRestored = waitUntilState(store, state =>
state.grids.length == 1 &&
state.grids[0].highlighted);
await refreshTab();
let { restored } = await onStateRestored;
await onGridListRestored;
yield refreshTab();
let { restored } = yield onStateRestored;
yield onGridListRestored;
info("Check that the grid highlighter can be displayed after reloading the page");
ok(restored, "The highlighter state was restored");
@ -77,9 +77,9 @@ add_task(async function() {
onGridListRestored = waitUntilState(store, state =>
state.grids.length == 1 &&
!state.grids[0].highlighted);
await navigateTo(inspector, otherUri);
({ restored } = await onStateRestored);
await onGridListRestored;
yield navigateTo(inspector, otherUri);
({ restored } = yield onStateRestored);
yield onGridListRestored;
info("Check that the grid highlighter is hidden after navigating to a different page");
ok(!restored, "The highlighter state was not restored");

6
devtools/client/inspector/grids/test/head.js
View File

@ -32,15 +32,15 @@ const HIGHLIGHTER_TYPE = "CssGridHighlighter";
* @param {Array} newRgba
* Array of the new rgba values to be set in the color widget.
*/
var simulateColorPickerChange = async function(colorPicker, newRgba) {
var simulateColorPickerChange = Task.async(function* (colorPicker, newRgba) {
info("Getting the spectrum colorpicker object");
let spectrum = await colorPicker.spectrum;
let spectrum = yield colorPicker.spectrum;
info("Setting the new color");
spectrum.rgb = newRgba;
info("Applying the change");
spectrum.updateUI();
spectrum.onChange();
};
});
registerCleanupFunction(async function() {
await asyncStorage.removeItem("gridInspectorHostColors");

12
devtools/client/inspector/inspector-commands.js
View File

@ -28,12 +28,12 @@ exports.items = [{
manual: l10n.lookup("inspectNodeManual")
}
],
exec: async function(args, context) {
exec: function* (args, context) {
let target = context.environment.target;
let toolbox = await gDevTools.showToolbox(target, "inspector");
let toolbox = yield gDevTools.showToolbox(target, "inspector");
let walker = toolbox.getCurrentPanel().walker;
let rootNode = await walker.getRootNode();
let nodeFront = await walker.querySelector(rootNode, args.selector);
let rootNode = yield walker.getRootNode();
let nodeFront = yield walker.querySelector(rootNode, args.selector);
toolbox.getCurrentPanel().selection.setNodeFront(nodeFront, "gcli");
},
}, {
@ -57,7 +57,7 @@ exports.items = [{
hidden: true
}]
}],
exec: async function(args, context) {
exec: function* (args, context) {
if (args.hide) {
context.updateExec("eyedropper_server_hide").catch(console.error);
return;
@ -69,7 +69,7 @@ exports.items = [{
if (toolbox) {
let inspector = toolbox.getPanel("inspector");
if (inspector) {
await inspector.hideEyeDropper();
yield inspector.hideEyeDropper();
}
}

7
devtools/client/inspector/inspector-search.js
View File

@ -5,6 +5,7 @@
"use strict";
const promise = require("promise");
const {Task} = require("devtools/shared/task");
const {KeyCodes} = require("devtools/client/shared/keycodes");
const EventEmitter = require("devtools/shared/event-emitter");
@ -74,7 +75,7 @@ InspectorSearch.prototype = {
.catch(console.error);
},
async doFullTextSearch(query, reverse) {
doFullTextSearch: Task.async(function* (query, reverse) {
let lastSearched = this._lastSearched;
this._lastSearched = query;
@ -86,7 +87,7 @@ InspectorSearch.prototype = {
return;
}
let res = await this.walker.search(query, { reverse });
let res = yield this.walker.search(query, { reverse });
// Value has changed since we started this request, we're done.
if (query !== this.searchBox.value) {
@ -103,7 +104,7 @@ InspectorSearch.prototype = {
this.searchBox.classList.add("devtools-style-searchbox-no-match");
this.emit("search-result");
}
},
}),
_onInput: function() {
if (this.searchBox.value.length === 0) {

69
devtools/client/inspector/inspector.js
View File

@ -12,6 +12,7 @@ const Services = require("Services");
const promise = require("promise");
const EventEmitter = require("devtools/shared/event-emitter");
const {executeSoon} = require("devtools/shared/DevToolsUtils");
const {Task} = require("devtools/shared/task");
const {PrefObserver} = require("devtools/client/shared/prefs");
const Telemetry = require("devtools/client/shared/telemetry");
const HighlightersOverlay = require("devtools/client/inspector/shared/highlighters-overlay");
@ -144,21 +145,21 @@ Inspector.prototype = {
/**
* open is effectively an asynchronous constructor
*/
async init() {
init: Task.async(function* () {
// Localize all the nodes containing a data-localization attribute.
localizeMarkup(this.panelDoc);
this._cssProperties = await initCssProperties(this.toolbox);
await this.target.makeRemote();
await this._getPageStyle();
this._cssProperties = yield initCssProperties(this.toolbox);
yield this.target.makeRemote();
yield this._getPageStyle();
// This may throw if the document is still loading and we are
// refering to a dead about:blank document
let defaultSelection = await this._getDefaultNodeForSelection()
let defaultSelection = yield this._getDefaultNodeForSelection()
.catch(this._handleRejectionIfNotDestroyed);
return this._deferredOpen(defaultSelection);
},
return yield this._deferredOpen(defaultSelection);
}),
get toolbox() {
return this._toolbox;
@ -949,14 +950,14 @@ Inspector.prototype = {
* @return {Boolean} true if the eyedropper highlighter is supported by the current
* document.
*/
async supportsEyeDropper() {
supportsEyeDropper: Task.async(function* () {
try {
let hasSupportsHighlighters =
await this.target.actorHasMethod("inspector", "supportsHighlighters");
yield this.target.actorHasMethod("inspector", "supportsHighlighters");
let supportsHighlighters;
if (hasSupportsHighlighters) {
supportsHighlighters = await this.inspector.supportsHighlighters();
supportsHighlighters = yield this.inspector.supportsHighlighters();
} else {
// If the actor does not provide the supportsHighlighter method, fallback to
// check if the selected node's document is a HTML document.
@ -969,9 +970,9 @@ Inspector.prototype = {
console.error(e);
return false;
}
},
}),
async setupToolbar() {
setupToolbar: Task.async(function* () {
this.teardownToolbar();
// Setup the add-node button.
@ -980,7 +981,7 @@ Inspector.prototype = {
this.addNodeButton.addEventListener("click", this.addNode);
// Setup the eye-dropper icon if we're in an HTML document and we have actor support.
let canShowEyeDropper = await this.supportsEyeDropper();
let canShowEyeDropper = yield this.supportsEyeDropper();
// Bail out if the inspector was destroyed in the meantime and panelDoc is no longer
// available.
@ -1017,7 +1018,7 @@ Inspector.prototype = {
let parentBox = this.panelDoc.getElementById("inspector-sidebar-toggle-box");
this.sidebarToggle = this.ReactDOM.render(sidebarToggle, parentBox);
}
},
}),
teardownToolbar: function() {
if (this.addNodeButton) {
@ -1067,7 +1068,7 @@ Inspector.prototype = {
* view is initialized. Expands the current selected node and restores the saved
* highlighter state.
*/
async onMarkupLoaded() {
onMarkupLoaded: Task.async(function* () {
if (!this.markup) {
return;
}
@ -1075,7 +1076,7 @@ Inspector.prototype = {
let onExpand = this.markup.expandNode(this.selection.nodeFront);
// Restore the highlighter states prior to emitting "new-root".
await Promise.all([
yield Promise.all([
this.highlighters.restoreFlexboxState(),
this.highlighters.restoreGridState(),
this.highlighters.restoreShapeState()
@ -1087,7 +1088,7 @@ Inspector.prototype = {
// the markup view is fully emitted before firing 'reloaded'.
// 'reloaded' is used to know when the panel is fully updated
// after a page reload.
await onExpand;
yield onExpand;
this.emit("reloaded");
@ -1102,7 +1103,7 @@ Inspector.prototype = {
}
delete this._newRootStart;
}
},
}),
_selectionCssSelector: null,
@ -1850,7 +1851,7 @@ Inspector.prototype = {
* Create a new node as the last child of the current selection, expand the
* parent and select the new node.
*/
async addNode() {
addNode: Task.async(function* () {
if (!this.canAddHTMLChild()) {
return;
}
@ -1859,12 +1860,12 @@ Inspector.prototype = {
// Insert the html and expect a childList markup mutation.
let onMutations = this.once("markupmutation");
await this.walker.insertAdjacentHTML(this.selection.nodeFront, "beforeEnd", html);
await onMutations;
yield this.walker.insertAdjacentHTML(this.selection.nodeFront, "beforeEnd", html);
yield onMutations;
// Expand the parent node.
this.markup.expandNode(this.selection.nodeFront);
},
}),
/**
* Toggle a pseudo class.
@ -2101,7 +2102,7 @@ Inspector.prototype = {
/**
* Initiate gcli screenshot command on selected node.
*/
async screenshotNode() {
screenshotNode: Task.async(function* () {
const command = Services.prefs.getBoolPref("devtools.screenshot.clipboard.enabled") ?
"screenshot --file --clipboard --selector" :
"screenshot --file --selector";
@ -2110,14 +2111,14 @@ Inspector.prototype = {
// is still visible, therefore showing it in the picture.
// To avoid that, we have to hide it before taking the screenshot. The `hideBoxModel`
// will do that, calling `hide` for the highlighter only if previously shown.
await this.highlighter.hideBoxModel();
yield this.highlighter.hideBoxModel();
// Bug 1180314 - CssSelector might contain white space so need to make sure it is
// passed to screenshot as a single parameter. More work *might* be needed if
// CssSelector could contain escaped single- or double-quotes, backslashes, etc.
CommandUtils.executeOnTarget(this._target,
`${command} '${this.selectionCssSelector}'`);
},
}),
/**
* Scroll the node into view.
@ -2343,7 +2344,7 @@ Inspector.prototype = {
* - reactDOM
* - browserRequire
*/
const buildFakeToolbox = async function(
const buildFakeToolbox = Task.async(function* (
target, createThreadClient, {
React,
ReactDOM,
@ -2396,14 +2397,14 @@ const buildFakeToolbox = async function(
getNotificationBox() {}
};
fakeToolbox.threadClient = await createThreadClient(fakeToolbox);
fakeToolbox.threadClient = yield createThreadClient(fakeToolbox);
let inspector = InspectorFront(target.client, target.form);
let showAllAnonymousContent =
Services.prefs.getBoolPref("devtools.inspector.showAllAnonymousContent");
let walker = await inspector.getWalker({ showAllAnonymousContent });
let walker = yield inspector.getWalker({ showAllAnonymousContent });
let selection = new Selection(walker);
let highlighter = await inspector.getHighlighter(false);
let highlighter = yield inspector.getHighlighter(false);
fakeToolbox.highlighterUtils = getHighlighterUtils(fakeToolbox);
fakeToolbox.inspector = inspector;
@ -2411,7 +2412,7 @@ const buildFakeToolbox = async function(
fakeToolbox.selection = selection;
fakeToolbox.highlighter = highlighter;
return fakeToolbox;
};
});
// URL constructor doesn't support chrome: scheme
let href = window.location.href.replace(/chrome:/, "http://");
@ -2426,16 +2427,16 @@ if (window.location.protocol === "chrome:" && url.search.length > 1) {
const React = browserRequire("devtools/client/shared/vendor/react");
const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
(async function() {
let target = await targetFromURL(url);
let fakeToolbox = await buildFakeToolbox(
Task.spawn(function* () {
let target = yield targetFromURL(url);
let fakeToolbox = yield buildFakeToolbox(
target,
(toolbox) => attachThread(toolbox),
{ React, ReactDOM, browserRequire }
);
let inspectorUI = new Inspector(fakeToolbox);
inspectorUI.init();
})().catch(e => {
}).catch(e => {
window.alert("Unable to start the inspector:" + e.message + "\n" + e.stack);
});
}

5
devtools/client/inspector/markup/markup.js
View File

@ -6,6 +6,7 @@
const promise = require("promise");
const Services = require("Services");
const {Task} = require("devtools/shared/task");
const nodeConstants = require("devtools/shared/dom-node-constants");
const nodeFilterConstants = require("devtools/shared/dom-node-filter-constants");
const EventEmitter = require("devtools/shared/event-emitter");
@ -511,7 +512,7 @@ MarkupView.prototype = {
* @return {Promise} the promise returned by
* MarkupElementContainer._isImagePreviewTarget
*/
async _isImagePreviewTarget(target) {
_isImagePreviewTarget: Task.async(function* (target) {
// From the target passed here, let's find the parent MarkupContainer
// and ask it if the tooltip should be shown
if (this.isDragging) {
@ -534,7 +535,7 @@ MarkupView.prototype = {
}
return false;
},
}),
/**
* Given the known reason, should the current selection be briefly highlighted

14
devtools/client/inspector/markup/test/browser_markup_accessibility_focus_blur.js
View File

@ -7,20 +7,20 @@
// Test inspector markup view handling focus and blur when moving between markup
// view, its root and other containers, and other parts of inspector.
add_task(async function() {
let {inspector, testActor} = await openInspectorForURL(
add_task(function* () {
let {inspector, testActor} = yield openInspectorForURL(
"data:text/html;charset=utf-8,<h1>foo</h1><span>bar</span>");
let markup = inspector.markup;
let doc = markup.doc;
let win = doc.defaultView;
let spanContainer = await getContainerForSelector("span", inspector);
let spanContainer = yield getContainerForSelector("span", inspector);
let rootContainer = markup.getContainer(markup._rootNode);
is(doc.activeElement, doc.body,
"Keyboard focus by default is on document body");
await selectNode("span", inspector);
yield selectNode("span", inspector);
is(doc.activeElement, doc.body,
"Keyboard focus is still on document body");
@ -34,13 +34,13 @@ add_task(async function() {
"Keyboard focus should be on tag element of focused container");
info("Focusing on search box, external to markup view document");
await focusSearchBoxUsingShortcut(inspector.panelWin);
yield focusSearchBoxUsingShortcut(inspector.panelWin);
is(doc.activeElement, doc.body,
"Keyboard focus should be removed from focused container");
info("Selecting the test span node again");
await selectNode("span", inspector);
yield selectNode("span", inspector);
is(doc.activeElement, doc.body,
"Keyboard focus should again be on document body");
@ -53,7 +53,7 @@ add_task(async function() {
is(doc.activeElement, spanContainer.editor.tag,
"Keyboard focus should again be on tag element of focused container");
await clickOnInspectMenuItem(testActor, "h1");
yield clickOnInspectMenuItem(testActor, "h1");
is(doc.activeElement, rootContainer.elt,
"When inspect menu item is used keyboard focus should move to tree.");
});

10
devtools/client/inspector/markup/test/browser_markup_accessibility_navigation.js
View File

@ -241,8 +241,8 @@ const TESTS = [
let containerID = 0;
let elms = {};
add_task(async function() {
let { inspector } = await openInspectorForURL(`data:text/html;charset=utf-8,
add_task(function* () {
let { inspector } = yield openInspectorForURL(`data:text/html;charset=utf-8,
<h1 id="some-id" class="some-class">foo<span>Child span<span></h1>`);
// Record containers that are created after inspector is initialized to be
@ -254,8 +254,8 @@ add_task(async function() {
elms.docBody = inspector.markup.doc.body;
elms.root = inspector.markup.getContainer(inspector.markup._rootNode);
elms.header = await getContainerForSelector("h1", inspector);
elms.body = await getContainerForSelector("body", inspector);
elms.header = yield getContainerForSelector("h1", inspector);
elms.body = yield getContainerForSelector("body", inspector);
// Initial focus is on root element and active descendant should be set on
// body tag line.
@ -265,7 +265,7 @@ add_task(async function() {
elms.root.elt.focus();
for (let testData of TESTS) {
await runAccessibilityNavigationTest(inspector, elms, testData);
yield runAccessibilityNavigationTest(inspector, elms, testData);
}
elms = null;

10
devtools/client/inspector/markup/test/browser_markup_accessibility_navigation_after_edit.js
View File

@ -102,14 +102,14 @@ const TESTS = [
let elms = {};
add_task(async function() {
add_task(function* () {
let url = `data:text/html;charset=utf-8,${TEST_URI}`;
let { inspector } = await openInspectorForURL(url);
let { inspector } = yield openInspectorForURL(url);
elms.docBody = inspector.markup.doc.body;
elms.root = inspector.markup.getContainer(inspector.markup._rootNode);
elms.div = await getContainerForSelector("div", inspector);
elms.body = await getContainerForSelector("body", inspector);
elms.div = yield getContainerForSelector("div", inspector);
elms.body = yield getContainerForSelector("body", inspector);
// Initial focus is on root element and active descendant should be set on
// body tag line.
@ -119,7 +119,7 @@ add_task(async function() {
elms.root.elt.focus();
for (let testData of TESTS) {
await runAccessibilityNavigationTest(inspector, elms, testData);
yield runAccessibilityNavigationTest(inspector, elms, testData);
}
elms = null;

8
devtools/client/inspector/markup/test/browser_markup_accessibility_new_selection.js
View File

@ -8,8 +8,8 @@
// the user keyboard action. In this case markup tree container must receive
// keyboard focus so that further interactions continue within the markup tree.
add_task(async function() {
let { inspector } = await openInspectorForURL(
add_task(function* () {
let { inspector } = yield openInspectorForURL(
"data:text/html;charset=utf-8,<h1>foo</h1><span>bar</span>");
let markup = inspector.markup;
let doc = markup.doc;
@ -17,10 +17,10 @@ add_task(async function() {
is(doc.activeElement, doc.body, "Keyboard focus by default is on document body");
await selectNode("span", inspector, "test");
yield selectNode("span", inspector, "test");
is(doc.activeElement, doc.body, "Keyboard focus remains on document body.");
await selectNode("h1", inspector, "test-keyboard");
yield selectNode("h1", inspector, "test-keyboard");
is(doc.activeElement, rootContainer.elt,
"Keyboard focus must be on the markup tree conainer.");
});

20
devtools/client/inspector/markup/test/browser_markup_anonymous_01.js
View File

@ -7,38 +7,38 @@
// Test native anonymous content in the markupview.
const TEST_URL = URL_ROOT + "doc_markup_anonymous.html";
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
let pseudo = await getNodeFront("#pseudo", inspector);
let pseudo = yield getNodeFront("#pseudo", inspector);
// Markup looks like: <div><::before /><span /><::after /></div>
let children = await inspector.walker.children(pseudo);
let children = yield inspector.walker.children(pseudo);
is(children.nodes.length, 3, "Children returned from walker");
info("Checking the ::before pseudo element");
let before = children.nodes[0];
await isEditingMenuDisabled(before, inspector);
yield isEditingMenuDisabled(before, inspector);
info("Checking the normal child element");
let span = children.nodes[1];
await isEditingMenuEnabled(span, inspector);
yield isEditingMenuEnabled(span, inspector);
info("Checking the ::after pseudo element");
let after = children.nodes[2];
await isEditingMenuDisabled(after, inspector);
yield isEditingMenuDisabled(after, inspector);
let native = await getNodeFront("#native", inspector);
let native = yield getNodeFront("#native", inspector);
// Markup looks like: <div><video controls /></div>
let nativeChildren = await inspector.walker.children(native);
let nativeChildren = yield inspector.walker.children(native);
is(nativeChildren.nodes.length, 1, "Children returned from walker");
info("Checking the video element");
let video = nativeChildren.nodes[0];
ok(!video.isAnonymous, "<video> is not anonymous");
let videoChildren = await inspector.walker.children(video);
let videoChildren = yield inspector.walker.children(video);
is(videoChildren.nodes.length, 0,
"No native children returned from walker for <video> by default");
});

12
devtools/client/inspector/markup/test/browser_markup_anonymous_02.js
View File

@ -9,23 +9,23 @@ requestLongerTimeout(2);
// Test XBL anonymous content in the markupview
const TEST_URL = "chrome://devtools/content/scratchpad/scratchpad.xul";
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
let toolbarbutton = await getNodeFront("toolbarbutton", inspector);
let children = await inspector.walker.children(toolbarbutton);
let toolbarbutton = yield getNodeFront("toolbarbutton", inspector);
let children = yield inspector.walker.children(toolbarbutton);
is(toolbarbutton.numChildren, 3, "Correct number of children");
is(children.nodes.length, 3, "Children returned from walker");
is(toolbarbutton.isAnonymous, false, "Toolbarbutton is not anonymous");
await isEditingMenuEnabled(toolbarbutton, inspector);
yield isEditingMenuEnabled(toolbarbutton, inspector);
for (let node of children.nodes) {
ok(node.isAnonymous, "Child is anonymous");
ok(node._form.isXBLAnonymous, "Child is XBL anonymous");
ok(!node._form.isShadowAnonymous, "Child is not shadow anonymous");
ok(!node._form.isNativeAnonymous, "Child is not native anonymous");
await isEditingMenuDisabled(node, inspector);
yield isEditingMenuDisabled(node, inspector);
}
});

14
devtools/client/inspector/markup/test/browser_markup_anonymous_03.js
View File

@ -9,13 +9,13 @@
// of elements should be working.
const TEST_URL = URL_ROOT + "doc_markup_anonymous.html";
add_task(async function() {
add_task(function* () {
Services.prefs.setBoolPref("dom.webcomponents.shadowdom.enabled", true);
let {inspector} = await openInspectorForURL(TEST_URL);
let {inspector} = yield openInspectorForURL(TEST_URL);
let shadow = await getNodeFront("#shadow", inspector.markup);
let children = await inspector.walker.children(shadow);
let shadow = yield getNodeFront("#shadow", inspector.markup);
let children = yield inspector.walker.children(shadow);
// Bug 1441535.
todo_is(shadow.numChildren, 3, "Children of the shadow root are counted");
@ -23,13 +23,13 @@ add_task(async function() {
info("Checking the ::before pseudo element");
let before = children.nodes[0];
await isEditingMenuDisabled(before, inspector);
yield isEditingMenuDisabled(before, inspector);
info("Checking the <h3> shadow element");
let shadowChild1 = children.nodes[1];
await isEditingMenuDisabled(shadowChild1, inspector);
yield isEditingMenuDisabled(shadowChild1, inspector);
info("Checking the <select> shadow element");
let shadowChild2 = children.nodes[2];
await isEditingMenuDisabled(shadowChild2, inspector);
yield isEditingMenuDisabled(shadowChild2, inspector);
});

12
devtools/client/inspector/markup/test/browser_markup_anonymous_04.js
View File

@ -9,22 +9,22 @@
const TEST_URL = URL_ROOT + "doc_markup_anonymous.html";
const PREF = "devtools.inspector.showAllAnonymousContent";
add_task(async function() {
add_task(function* () {
Services.prefs.setBoolPref(PREF, true);
let {inspector} = await openInspectorForURL(TEST_URL);
let {inspector} = yield openInspectorForURL(TEST_URL);
let native = await getNodeFront("#native", inspector);
let native = yield getNodeFront("#native", inspector);
// Markup looks like: <div><video controls /></div>
let nativeChildren = await inspector.walker.children(native);
let nativeChildren = yield inspector.walker.children(native);
is(nativeChildren.nodes.length, 1, "Children returned from walker");
info("Checking the video element");
let video = nativeChildren.nodes[0];
ok(!video.isAnonymous, "<video> is not anonymous");
let videoChildren = await inspector.walker.children(video);
let videoChildren = yield inspector.walker.children(video);
is(videoChildren.nodes.length, 3, "<video> has native anonymous children");
for (let node of videoChildren.nodes) {
@ -32,6 +32,6 @@ add_task(async function() {
ok(!node._form.isXBLAnonymous, "Child is not XBL anonymous");
ok(!node._form.isShadowAnonymous, "Child is not shadow anonymous");
ok(node._form.isNativeAnonymous, "Child is native anonymous");
await isEditingMenuDisabled(node, inspector);
yield isEditingMenuDisabled(node, inspector);
}
});

34
devtools/client/inspector/markup/test/browser_markup_copy_image_data.js
View File

@ -7,31 +7,31 @@
// Test that image nodes have the "copy data-uri" contextual menu item enabled
// and that clicking it puts the image data into the clipboard
add_task(async function() {
await addTab(URL_ROOT + "doc_markup_image_and_canvas.html");
let {inspector, testActor} = await openInspector();
add_task(function* () {
yield addTab(URL_ROOT + "doc_markup_image_and_canvas.html");
let {inspector, testActor} = yield openInspector();
await selectNode("div", inspector);
await assertCopyImageDataNotAvailable(inspector);
yield selectNode("div", inspector);
yield assertCopyImageDataNotAvailable(inspector);
await selectNode("img", inspector);
await assertCopyImageDataAvailable(inspector);
let expectedSrc = await testActor.getAttribute("img", "src");
await triggerCopyImageUrlAndWaitForClipboard(expectedSrc, inspector);
yield selectNode("img", inspector);
yield assertCopyImageDataAvailable(inspector);
let expectedSrc = yield testActor.getAttribute("img", "src");
yield triggerCopyImageUrlAndWaitForClipboard(expectedSrc, inspector);
await selectNode("canvas", inspector);
await assertCopyImageDataAvailable(inspector);
let expectedURL = await testActor.eval(`
yield selectNode("canvas", inspector);
yield assertCopyImageDataAvailable(inspector);
let expectedURL = yield testActor.eval(`
document.querySelector(".canvas").toDataURL();`);
await triggerCopyImageUrlAndWaitForClipboard(expectedURL, inspector);
yield triggerCopyImageUrlAndWaitForClipboard(expectedURL, inspector);
// Check again that the menu isn't available on the DIV (to make sure our
// menu updating mechanism works)
await selectNode("div", inspector);
await assertCopyImageDataNotAvailable(inspector);
yield selectNode("div", inspector);
yield assertCopyImageDataNotAvailable(inspector);
});
function assertCopyImageDataNotAvailable(inspector) {
function* assertCopyImageDataNotAvailable(inspector) {
let allMenuItems = openContextMenuAndGetAllItems(inspector);
let item = allMenuItems.find(i => i.id === "node-menu-copyimagedatauri");
@ -39,7 +39,7 @@ function assertCopyImageDataNotAvailable(inspector) {
ok(item.disabled, "The menu item is disabled");
}
function assertCopyImageDataAvailable(inspector) {
function* assertCopyImageDataAvailable(inspector) {
let allMenuItems = openContextMenuAndGetAllItems(inspector);
let item = allMenuItems.find(i => i.id === "node-menu-copyimagedatauri");

6
devtools/client/inspector/markup/test/browser_markup_css_completion_style_attribute_01.js
View File

@ -69,8 +69,8 @@ const TEST_DATA = [
-1, -1, false]
];
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
await runStyleAttributeAutocompleteTests(inspector, TEST_DATA);
yield runStyleAttributeAutocompleteTests(inspector, TEST_DATA);
});

10
devtools/client/inspector/markup/test/browser_markup_css_completion_style_attribute_02.js
View File

@ -97,10 +97,10 @@ const TEST_DATA_INNER = [
["VK_RETURN", "style=\"background:url('1'); color:beige\"", -1, -1, false]
];
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
await runStyleAttributeAutocompleteTests(inspector, TEST_DATA_DOUBLE);
await runStyleAttributeAutocompleteTests(inspector, TEST_DATA_SINGLE);
await runStyleAttributeAutocompleteTests(inspector, TEST_DATA_INNER);
yield runStyleAttributeAutocompleteTests(inspector, TEST_DATA_DOUBLE);
yield runStyleAttributeAutocompleteTests(inspector, TEST_DATA_SINGLE);
yield runStyleAttributeAutocompleteTests(inspector, TEST_DATA_INNER);
});

6
devtools/client/inspector/markup/test/browser_markup_css_completion_style_attribute_03.js
View File

@ -47,8 +47,8 @@ const TEST_DATA = [
-1, -1, false]
];
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
await runStyleAttributeAutocompleteTests(inspector, TEST_DATA);
yield runStyleAttributeAutocompleteTests(inspector, TEST_DATA);
});

20
devtools/client/inspector/markup/test/browser_markup_display_node_01.js
View File

@ -24,34 +24,34 @@ const TEST_URI = `
<span>HELLO WORLD</span>
`;
add_task(async function() {
let {inspector} = await openInspectorForURL("data:text/html;charset=utf-8," +
add_task(function* () {
let {inspector} = yield openInspectorForURL("data:text/html;charset=utf-8," +
encodeURIComponent(TEST_URI));
info("Check the display node is shown and the value of #grid.");
await selectNode("#grid", inspector);
let gridContainer = await getContainerForSelector("#grid", inspector);
yield selectNode("#grid", inspector);
let gridContainer = yield getContainerForSelector("#grid", inspector);
let gridDisplayNode = gridContainer.elt.querySelector(".markupview-display");
is(gridDisplayNode.textContent, "grid", "Got the correct display type for #grid.");
is(gridDisplayNode.style.display, "inline-block", "#grid display node is shown.");
info("Check the display node is shown and the value of #flex.");
await selectNode("#flex", inspector);
let flexContainer = await getContainerForSelector("#flex", inspector);
yield selectNode("#flex", inspector);
let flexContainer = yield getContainerForSelector("#flex", inspector);
let flexDisplayNode = flexContainer.elt.querySelector(".markupview-display");
is(flexDisplayNode.textContent, "flex", "Got the correct display type for #flex");
is(flexDisplayNode.style.display, "inline-block", "#flex display node is shown.");
info("Check the display node is shown and the value of #block.");
await selectNode("#block", inspector);
let blockContainer = await getContainerForSelector("#block", inspector);
yield selectNode("#block", inspector);
let blockContainer = yield getContainerForSelector("#block", inspector);
let blockDisplayNode = blockContainer.elt.querySelector(".markupview-display");
is(blockDisplayNode.textContent, "block", "Got the correct display type for #block");
is(blockDisplayNode.style.display, "none", "#block display node is hidden.");
info("Check the display node is shown and the value of span.");
await selectNode("span", inspector);
let spanContainer = await getContainerForSelector("span", inspector);
yield selectNode("span", inspector);
let spanContainer = yield getContainerForSelector("span", inspector);
let spanDisplayNode = spanContainer.elt.querySelector(".markupview-display");
is(spanDisplayNode.textContent, "inline", "Got the correct display type for #span");
is(spanDisplayNode.style.display, "none", "span display node is hidden.");

28
devtools/client/inspector/markup/test/browser_markup_display_node_02.js
View File

@ -35,8 +35,8 @@ const TEST_DATA = [
textContent: "grid",
display: "inline-block"
},
changeStyle: async function(testActor) {
await testActor.eval(`
changeStyle: function* (testActor) {
yield testActor.eval(`
let node = document.getElementById("grid");
node.style.display = "block";
`);
@ -53,8 +53,8 @@ const TEST_DATA = [
textContent: "block",
display: "none"
},
changeStyle: async function(testActor) {
await testActor.eval(`
changeStyle: function* (testActor) {
yield testActor.eval(`
let node = document.getElementById("block");
node.style.display = "grid";
`);
@ -71,8 +71,8 @@ const TEST_DATA = [
textContent: "none",
display: "none"
},
changeStyle: async function(testActor) {
await testActor.eval(`
changeStyle: function* (testActor) {
yield testActor.eval(`
document.getElementById("flex").removeAttribute("hidden");
`);
},
@ -83,20 +83,20 @@ const TEST_DATA = [
}
];
add_task(async function() {
let {inspector, testActor} = await openInspectorForURL("data:text/html;charset=utf-8," +
add_task(function* () {
let {inspector, testActor} = yield openInspectorForURL("data:text/html;charset=utf-8," +
encodeURIComponent(TEST_URI));
for (let data of TEST_DATA) {
info("Running test case: " + data.desc);
await runTestData(inspector, testActor, data);
yield runTestData(inspector, testActor, data);
}
});
async function runTestData(inspector, testActor,
function* runTestData(inspector, testActor,
{selector, before, changeStyle, after}) {
await selectNode(selector, inspector);
let container = await getContainerForSelector(selector, inspector);
yield selectNode(selector, inspector);
let container = yield getContainerForSelector(selector, inspector);
let displayNode = container.elt.querySelector(".markupview-display");
is(displayNode.textContent, before.textContent,
@ -107,8 +107,8 @@ async function runTestData(inspector, testActor,
info("Listening for the display-change event");
let onDisplayChanged = inspector.markup.walker.once("display-change");
info("Making style changes");
await changeStyle(testActor);
let nodes = await onDisplayChanged;
yield changeStyle(testActor);
let nodes = yield onDisplayChanged;
info("Verifying that the list of changed nodes include our container");
ok(nodes.length, "The display-change event was received with a nodes");

24
devtools/client/inspector/markup/test/browser_markup_dragdrop_distance.js
View File

@ -14,31 +14,31 @@ const TEST_NODE = "#test";
// Keep this in sync with DRAG_DROP_MIN_INITIAL_DISTANCE in markup-view.js
const MIN_DISTANCE = 10;
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
info("Drag the test node by half of the minimum distance");
await simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE / 2);
await checkIsDragging(inspector, TEST_NODE, false);
yield simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE / 2);
yield checkIsDragging(inspector, TEST_NODE, false);
info("Drag the test node by exactly the minimum distance");
await simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE);
await checkIsDragging(inspector, TEST_NODE, true);
yield simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE);
yield checkIsDragging(inspector, TEST_NODE, true);
inspector.markup.cancelDragging();
info("Drag the test node by more than the minimum distance");
await simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE * 2);
await checkIsDragging(inspector, TEST_NODE, true);
yield simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE * 2);
yield checkIsDragging(inspector, TEST_NODE, true);
inspector.markup.cancelDragging();
info("Drag the test node by minus the minimum distance");
await simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE * -1);
await checkIsDragging(inspector, TEST_NODE, true);
yield simulateNodeDrag(inspector, TEST_NODE, 0, MIN_DISTANCE * -1);
yield checkIsDragging(inspector, TEST_NODE, true);
inspector.markup.cancelDragging();
});
async function checkIsDragging(inspector, selector, isDragging) {
let container = await getContainerForSelector(selector, inspector);
function* checkIsDragging(inspector, selector, isDragging) {
let container = yield getContainerForSelector(selector, inspector);
if (isDragging) {
ok(container.isDragging, "The container is being dragged");
ok(inspector.markup.isDragging, "And the markup-view knows it");

8
devtools/client/inspector/markup/test/browser_markup_dragdrop_dragRootNode.js
View File

@ -9,14 +9,14 @@
const TEST_URL = URL_ROOT + "doc_markup_dragdrop.html";
const TEST_DATA = ["html", "head", "body"];
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
for (let selector of TEST_DATA) {
info("Try to drag/drop node " + selector);
await simulateNodeDrag(inspector, selector);
yield simulateNodeDrag(inspector, selector);
let container = await getContainerForSelector(selector, inspector);
let container = yield getContainerForSelector(selector, inspector);
ok(!container.isDragging, "The container hasn't been marked as dragging");
}
});

22
devtools/client/inspector/markup/test/browser_markup_dragdrop_draggable.js
View File

@ -22,18 +22,18 @@ const TEST_DATA = [
{ node: "input", draggable: true },
{ node: "div", draggable: true },
{
node: async function(inspector) {
let parentFront = await getNodeFront("#before", inspector);
let {nodes} = await inspector.walker.children(parentFront);
node: function* (inspector) {
let parentFront = yield getNodeFront("#before", inspector);
let {nodes} = yield inspector.walker.children(parentFront);
// Getting the comment node.
return getContainerForNodeFront(nodes[1], inspector);
},
draggable: true
},
{
node: async function(inspector) {
let parentFront = await getNodeFront("#test", inspector);
let {nodes} = await inspector.walker.children(parentFront);
node: function* (inspector) {
let parentFront = yield getNodeFront("#test", inspector);
let {nodes} = yield inspector.walker.children(parentFront);
// Getting the ::before pseudo element.
return getContainerForNodeFront(nodes[0], inspector);
},
@ -41,18 +41,18 @@ const TEST_DATA = [
}
];
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
await inspector.markup.expandAll();
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
yield inspector.markup.expandAll();
for (let {node, draggable} of TEST_DATA) {
let container;
let name;
if (typeof node === "string") {
container = await getContainerForSelector(node, inspector);
container = yield getContainerForSelector(node, inspector);
name = node;
} else {
container = await node(inspector);
container = yield node(inspector);
name = container.toString();
}

10
devtools/client/inspector/markup/test/browser_markup_dragdrop_escapeKeyPress.js
View File

@ -8,16 +8,16 @@
const TEST_URL = URL_ROOT + "doc_markup_dragdrop.html";
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
let {markup} = inspector;
info("Get a test container");
await selectNode("#test", inspector);
let container = await getContainerForSelector("#test", inspector);
yield selectNode("#test", inspector);
let container = yield getContainerForSelector("#test", inspector);
info("Simulate a drag/drop on this container");
await simulateNodeDrag(inspector, "#test");
yield simulateNodeDrag(inspector, "#test");
ok(container.isDragging && markup.isDragging,
"The container is being dragged");

28
devtools/client/inspector/markup/test/browser_markup_dragdrop_invalidNodes.js
View File

@ -9,40 +9,40 @@
const TEST_URL = URL_ROOT + "doc_markup_dragdrop.html";
const PREF = "devtools.inspector.showAllAnonymousContent";
add_task(async function() {
add_task(function* () {
Services.prefs.setBoolPref(PREF, true);
let {inspector} = await openInspectorForURL(TEST_URL);
let {inspector} = yield openInspectorForURL(TEST_URL);
info("Expanding nodes below #test");
let parentFront = await getNodeFront("#test", inspector);
await inspector.markup.expandNode(parentFront);
await waitForMultipleChildrenUpdates(inspector);
let parentFront = yield getNodeFront("#test", inspector);
yield inspector.markup.expandNode(parentFront);
yield waitForMultipleChildrenUpdates(inspector);
info("Getting the ::before pseudo element and selecting it");
let parentContainer = await getContainerForNodeFront(parentFront, inspector);
let parentContainer = yield getContainerForNodeFront(parentFront, inspector);
let beforePseudo = parentContainer.elt.children[1].firstChild.container;
parentContainer.elt.scrollIntoView(true);
await selectNode(beforePseudo.node, inspector);
yield selectNode(beforePseudo.node, inspector);
info("Simulate dragging the ::before pseudo element");
await simulateNodeDrag(inspector, beforePseudo);
yield simulateNodeDrag(inspector, beforePseudo);
ok(!beforePseudo.isDragging, "::before pseudo element isn't dragging");
info("Expanding nodes below #anonymousParent");
let inputFront = await getNodeFront("#anonymousParent", inspector);
await inspector.markup.expandNode(inputFront);
await waitForMultipleChildrenUpdates(inspector);
let inputFront = yield getNodeFront("#anonymousParent", inspector);
yield inspector.markup.expandNode(inputFront);
yield waitForMultipleChildrenUpdates(inspector);
info("Getting the anonymous node and selecting it");
let inputContainer = await getContainerForNodeFront(inputFront, inspector);
let inputContainer = yield getContainerForNodeFront(inputFront, inspector);
let anonymousDiv = inputContainer.elt.children[1].firstChild.container;
inputContainer.elt.scrollIntoView(true);
await selectNode(anonymousDiv.node, inspector);
yield selectNode(anonymousDiv.node, inspector);
info("Simulate dragging the anonymous node");
await simulateNodeDrag(inspector, anonymousDiv);
yield simulateNodeDrag(inspector, anonymousDiv);
ok(!anonymousDiv.isDragging, "anonymous node isn't dragging");
});

54
devtools/client/inspector/markup/test/browser_markup_dragdrop_reorder.js
View File

@ -10,96 +10,96 @@ requestLongerTimeout(2);
const TEST_URL = URL_ROOT + "doc_markup_dragdrop.html";
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
let ids;
info("Expand #test node");
let parentFront = await getNodeFront("#test", inspector);
await inspector.markup.expandNode(parentFront);
await waitForMultipleChildrenUpdates(inspector);
let parentFront = yield getNodeFront("#test", inspector);
yield inspector.markup.expandNode(parentFront);
yield waitForMultipleChildrenUpdates(inspector);
info("Scroll #test into view");
let parentContainer = await getContainerForNodeFront(parentFront, inspector);
let parentContainer = yield getContainerForNodeFront(parentFront, inspector);
parentContainer.elt.scrollIntoView(true);
info("Test putting an element back at its original place");
await dragElementToOriginalLocation("#firstChild", inspector);
ids = await getChildrenIDsOf(parentFront, inspector);
yield dragElementToOriginalLocation("#firstChild", inspector);
ids = yield getChildrenIDsOf(parentFront, inspector);
is(ids[0], "firstChild",
"#firstChild is still the first child of #test");
is(ids[1], "middleChild",
"#middleChild is still the second child of #test");
info("Testing switching elements inside their parent");
await moveElementDown("#firstChild", "#middleChild", inspector);
ids = await getChildrenIDsOf(parentFront, inspector);
yield moveElementDown("#firstChild", "#middleChild", inspector);
ids = yield getChildrenIDsOf(parentFront, inspector);
is(ids[0], "middleChild",
"#firstChild is now the second child of #test");
is(ids[1], "firstChild",
"#middleChild is now the first child of #test");
info("Testing switching elements with a last child");
await moveElementDown("#firstChild", "#lastChild", inspector);
ids = await getChildrenIDsOf(parentFront, inspector);
yield moveElementDown("#firstChild", "#lastChild", inspector);
ids = yield getChildrenIDsOf(parentFront, inspector);
is(ids[1], "lastChild",
"#lastChild is now the second child of #test");
is(ids[2], "firstChild",
"#firstChild is now the last child of #test");
info("Testing appending element to a parent");
await moveElementDown("#before", "#test", inspector);
ids = await getChildrenIDsOf(parentFront, inspector);
yield moveElementDown("#before", "#test", inspector);
ids = yield getChildrenIDsOf(parentFront, inspector);
is(ids.length, 4,
"New element appended to #test");
is(ids[0], "before",
"New element is appended at the right place (currently first child)");
info("Testing moving element to after it's parent");
await moveElementDown("#firstChild", "#test", inspector);
ids = await getChildrenIDsOf(parentFront, inspector);
yield moveElementDown("#firstChild", "#test", inspector);
ids = yield getChildrenIDsOf(parentFront, inspector);
is(ids.length, 3,
"#firstChild is no longer #test's child");
let siblingFront = await inspector.walker.nextSibling(parentFront);
let siblingFront = yield inspector.walker.nextSibling(parentFront);
is(siblingFront.id, "firstChild",
"#firstChild is now #test's nextElementSibling");
});
async function dragElementToOriginalLocation(selector, inspector) {
function* dragElementToOriginalLocation(selector, inspector) {
info("Picking up and putting back down " + selector);
function onMutation() {
ok(false, "Mutation received from dragging a node back to its location");
}
inspector.on("markupmutation", onMutation);
await simulateNodeDragAndDrop(inspector, selector, 0, 0);
yield simulateNodeDragAndDrop(inspector, selector, 0, 0);
// Wait a bit to make sure the event never fires.
// This doesn't need to catch *all* cases, since the mutation
// will cause failure later in the test when it checks element ordering.
await wait(500);
yield wait(500);
inspector.off("markupmutation", onMutation);
}
async function moveElementDown(selector, next, inspector) {
function* moveElementDown(selector, next, inspector) {
info("Switching " + selector + " with " + next);
let container = await getContainerForSelector(next, inspector);
let container = yield getContainerForSelector(next, inspector);
let height = container.tagLine.getBoundingClientRect().height;
let onMutated = inspector.once("markupmutation");
let uiUpdate = inspector.once("inspector-updated");
await simulateNodeDragAndDrop(inspector, selector, 0, Math.round(height) + 2);
yield simulateNodeDragAndDrop(inspector, selector, 0, Math.round(height) + 2);
let mutations = await onMutated;
await uiUpdate;
let mutations = yield onMutated;
yield uiUpdate;
is(mutations.length, 2, "2 mutations were received");
}
async function getChildrenIDsOf(parentFront, {walker}) {
let {nodes} = await walker.children(parentFront);
function* getChildrenIDsOf(parentFront, {walker}) {
let {nodes} = yield walker.children(parentFront);
// Filter out non-element nodes since children also returns pseudo-elements.
return nodes.filter(node => {
return !node.isPseudoElement;

20
devtools/client/inspector/markup/test/browser_markup_dragdrop_tooltip.js
View File

@ -7,29 +7,29 @@
const TEST_URL = "data:text/html;charset=utf8,<img src=\"about:logo\" /><div>";
add_task(async function() {
let {inspector} = await openInspectorForURL(TEST_URL);
add_task(function* () {
let {inspector} = yield openInspectorForURL(TEST_URL);
let {markup} = inspector;
info("Get the tooltip target element for the image's src attribute");
let img = await getContainerForSelector("img", inspector);
let img = yield getContainerForSelector("img", inspector);
let target = img.editor.getAttributeElement("src").querySelector(".link");
info("Check that the src attribute of the image is a valid tooltip target");
await assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
await assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
yield assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
yield assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
info("Start dragging the test div");
await simulateNodeDrag(inspector, "div");
yield simulateNodeDrag(inspector, "div");
info("Now check that the src attribute of the image isn't a valid target");
let isValid = await markup.imagePreviewTooltip._toggle.isValidHoverTarget(target);
let isValid = yield markup.imagePreviewTooltip._toggle.isValidHoverTarget(target);
ok(!isValid, "The element is not a valid tooltip target");
info("Stop dragging the test div");
await simulateNodeDrop(inspector, "div");
yield simulateNodeDrop(inspector, "div");
info("Check again the src attribute of the image");
await assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
await assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
yield assertTooltipShownOnHover(markup.imagePreviewTooltip, target);
yield assertTooltipHiddenOnMouseOut(markup.imagePreviewTooltip, target);
});

Some files were not shown because too many files have changed in this diff Show More