--- a/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-color_01.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-color_01.js
@@ -6,41 +6,29 @@
// Test "Copy color" item of the context menu #1: Test _isColorPopup.
const TEST_URI = `
<div style="color: #123ABC; margin: 0px; background: span[data-color];">
Test "Copy color" context menu option
</div>
`;
-const TEST_CASES = [
- {
- viewName: "RuleView",
- initializer: openRuleView
- },
- {
- viewName: "ComputedView",
- initializer: openComputedView
- }
-];
-
add_task(function* () {
// Test is slow on Linux EC2 instances - Bug 1137765
requestLongerTimeout(2);
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
-
- for (let test of TEST_CASES) {
- yield testView(test);
- }
+ let {inspector} = yield openInspector();
+ yield testView("ruleview", inspector);
+ yield testView("computedview", inspector);
});
-function* testView({viewName, initializer}) {
- info("Testing " + viewName);
+function* testView(viewId, inspector) {
+ info("Testing " + viewId);
- let {inspector, view} = yield initializer();
+ let view = selectInspectorView(viewId, inspector);
yield selectNode("div", inspector);
testIsColorValueNode(view);
testIsColorPopupOnAllNodes(view);
yield clearCurrentNodeSelection(inspector);
}
/**
--- a/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-color_02.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-color_02.js
@@ -13,17 +13,19 @@ const TEST_URI = `
}
</style>
<div>Testing the color picker tooltip!</div>
`;
add_task(function* () {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
+
yield testCopyToClipboard(inspector, view);
yield testManualEdit(inspector, view);
yield testColorPickerEdit(inspector, view);
});
function* testCopyToClipboard(inspector, view) {
info("Testing that color is copied to clipboard");
--- a/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-urls.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-urls.js
@@ -33,35 +33,37 @@ add_task(function*() {
].join("\n");
yield addTab("data:text/html;charset=utf8," + encodeURIComponent(PAGE_CONTENT));
yield startTest();
});
function* startTest() {
+ let {inspector} = yield openInspector();
+
info("Opening rule view");
- let ruleViewData = yield openRuleView();
+ let view = selectInspectorView("ruleview", inspector);
info("Test valid background image URL in rule view");
- yield testCopyUrlToClipboard(ruleViewData, "data-uri", ".valid-background", TEST_DATA_URI);
- yield testCopyUrlToClipboard(ruleViewData, "url", ".valid-background", TEST_DATA_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".valid-background", TEST_DATA_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "url", ".valid-background", TEST_DATA_URI);
info("Test invalid background image URL in rue view");
- yield testCopyUrlToClipboard(ruleViewData, "data-uri", ".invalid-background", ERROR_MESSAGE);
- yield testCopyUrlToClipboard(ruleViewData, "url", ".invalid-background", INVALID_IMAGE_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".invalid-background", ERROR_MESSAGE);
+ yield testCopyUrlToClipboard({view, inspector}, "url", ".invalid-background", INVALID_IMAGE_URI);
info("Opening computed view");
- let computedViewData = yield openComputedView();
+ view = selectInspectorView("computedview", inspector);
info("Test valid background image URL in computed view");
- yield testCopyUrlToClipboard(computedViewData, "data-uri", ".valid-background", TEST_DATA_URI);
- yield testCopyUrlToClipboard(computedViewData, "url", ".valid-background", TEST_DATA_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".valid-background", TEST_DATA_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "url", ".valid-background", TEST_DATA_URI);
info("Test invalid background image URL in computed view");
- yield testCopyUrlToClipboard(computedViewData, "data-uri", ".invalid-background", ERROR_MESSAGE);
- yield testCopyUrlToClipboard(computedViewData, "url", ".invalid-background", INVALID_IMAGE_URI);
+ yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".invalid-background", ERROR_MESSAGE);
+ yield testCopyUrlToClipboard({view, inspector}, "url", ".invalid-background", INVALID_IMAGE_URI);
}
function* testCopyUrlToClipboard({view, inspector}, type, selector, expected) {
info("Select node in inspector panel");
yield selectNode(selector, inspector);
info("Retrieve background-image link for selected node in current styleinspector view");
let property = getBackgroundImageProperty(view, selector);
--- a/devtools/client/inspector/shared/test/browser_styleinspector_csslogic-content-stylesheets.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_csslogic-content-stylesheets.js
@@ -22,36 +22,36 @@ const XUL_PRINCIPAL = ssm.createCodebase
add_task(function*() {
requestLongerTimeout(2);
info("Checking stylesheets on HTML document");
yield addTab(TEST_URI_HTML);
let target = getNode("#target");
- let {inspector} = yield openRuleView();
+ let {inspector} = yield openInspector();
yield selectNode("#target", inspector);
info("Checking stylesheets");
yield checkSheets(target);
info("Checking authored stylesheets");
yield addTab(TEST_URI_AUTHOR);
- ({inspector} = yield openRuleView());
+ ({inspector} = yield openInspector());
target = getNode("#target");
yield selectNode("#target", inspector);
yield checkSheets(target);
info("Checking stylesheets on XUL document");
info("Allowing XUL content");
allowXUL();
yield addTab(TEST_URI_XUL);
- ({inspector} = yield openRuleView());
+ ({inspector} = yield openInspector());
target = getNode("#target");
yield selectNode("#target", inspector);
yield checkSheets(target);
info("Disallowing XUL content");
disallowXUL();
});
--- a/devtools/client/inspector/shared/test/browser_styleinspector_refresh_when_active.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_refresh_when_active.js
@@ -8,29 +8,31 @@
const TEST_URI = `
<div id="one" style="color:red;">one</div>
<div id="two" style="color:blue;">two</div>
`;
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
+
yield selectNode("#one", inspector);
is(getRuleViewPropertyValue(view, "element", "color"), "red",
"The rule-view shows the properties for test node one");
let cView = inspector.computedview.view;
let prop = getComputedViewProperty(cView, "color");
ok(!prop, "The computed-view doesn't show the properties for test node one");
info("Switching to the computed-view");
let onComputedViewReady = inspector.once("computed-view-refreshed");
- yield openComputedView();
+ selectInspectorView("computedview", inspector);
yield onComputedViewReady;
ok(getComputedViewPropertyValue(cView, "color"), "#F00",
"The computed-view shows the properties for test node one");
info("Selecting test node two");
yield selectNode("#two", inspector);
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-background-image.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-background-image.js
@@ -22,33 +22,34 @@ const TEST_URI = `
padding-left: 70px;
}
</style>
<div class="test-element">test element</div>
`;
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
info("Testing the background-image property on the body rule");
yield testBodyRuleView(view);
info("Selecting the test div node");
yield selectNode(".test-element", inspector);
info("Testing the the background property on the .test-element rule");
yield testDivRuleView(view);
info("Testing that image preview tooltips show even when there are " +
"fields being edited");
yield testTooltipAppearsEvenInEditMode(view);
info("Switching over to the computed-view");
let onComputedViewReady = inspector.once("computed-view-refreshed");
- ({view} = yield openComputedView());
+ view = selectInspectorView("computedview", inspector);
yield onComputedViewReady;
info("Testing that the background-image computed style has a tooltip too");
yield testComputedView(view);
});
function* testBodyRuleView(view) {
info("Testing tooltips in the rule view");
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-closes-on-new-selection.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-closes-on-new-selection.js
@@ -5,24 +5,25 @@
"use strict";
// Test that if a tooltip is visible when a new selection is made, it closes
const TEST_URI = "<div class='one'>el 1</div><div class='two'>el 2</div>";
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
yield selectNode(".one", inspector);
info("Testing rule view tooltip closes on new selection");
yield testRuleView(view, inspector);
info("Testing computed view tooltip closes on new selection");
- ({view} = yield openComputedView());
+ view = selectInspectorView("computedview", inspector);
yield testComputedView(view, inspector);
});
function* testRuleView(ruleView, inspector) {
info("Showing the tooltip");
let tooltip = ruleView.tooltips.previewTooltip;
tooltip.setTextContent({messages: ["rule-view tooltip"]});
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-longhand-fontfamily.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-longhand-fontfamily.js
@@ -14,23 +14,24 @@ const TEST_URI = `
padding-left: 70px;
}
</style>
<div id="testElement">test element</div>
`;
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
yield selectNode("#testElement", inspector);
yield testRuleView(view, inspector.selection.nodeFront);
info("Opening the computed view");
let onComputedViewReady = inspector.once("computed-view-refreshed");
- ({inspector, view} = yield openComputedView());
+ view = selectInspectorView("computedview", inspector);
yield onComputedViewReady;
yield testComputedView(view, inspector.selection.nodeFront);
yield testExpandedComputedViewProperty(view, inspector.selection.nodeFront);
});
function* testRuleView(ruleView, nodeFront) {
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-multiple-background-images.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-multiple-background-images.js
@@ -20,35 +20,37 @@ add_task(function* () {
let TEST_STYLE = "h1 {background: url(" + YELLOW_DOT + "), url(" + BLUE_DOT + ");}";
let PAGE_CONTENT = "<style>" + TEST_STYLE + "</style>" +
"<h1>browser_styleinspector_tooltip-multiple-background-images.js</h1>";
yield addTab("data:text/html;charset=utf-8,background image tooltip test");
content.document.body.innerHTML = PAGE_CONTENT;
- yield testRuleViewUrls();
- yield testComputedViewUrls();
+ let {inspector} = yield openInspector();
+ yield testRuleViewUrls(inspector);
+ yield testComputedViewUrls(inspector);
});
-function* testRuleViewUrls() {
+function* testRuleViewUrls(inspector) {
info("Testing tooltips in the rule view");
-
- let {view, inspector} = yield openRuleView();
+ let view = selectInspectorView("ruleview", inspector);
yield selectNode("h1", inspector);
let {valueSpan} = getRuleViewProperty(view, "h1", "background");
yield performChecks(view, valueSpan);
}
-function* testComputedViewUrls() {
+function* testComputedViewUrls(inspector) {
info("Testing tooltips in the computed view");
- let {view, inspector} = yield openComputedView();
- yield inspector.once("computed-view-refreshed");
+ let onComputedViewReady = inspector.once("computed-view-refreshed");
+ let view = selectInspectorView("computedview", inspector);
+ yield onComputedViewReady;
+
let {valueSpan} = getComputedViewProperty(view, "background-image");
yield performChecks(view, valueSpan);
}
/**
* A helper that checks url() tooltips contain correct images
*/
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-shorthand-fontfamily.js
@@ -12,17 +12,19 @@ const TEST_URI = `
font: italic bold .8em/1.2 Arial;
}
</style>
<div id="testElement">test element</div>
`;
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
+
yield selectNode("#testElement", inspector);
yield testRuleView(view, inspector.selection.nodeFront);
});
function* testRuleView(ruleView, nodeFront) {
info("Testing font-family tooltips in the rule view");
let tooltip = ruleView.tooltips.previewTooltip;
--- a/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-size.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_tooltip-size.js
@@ -14,17 +14,18 @@ const TEST_URI = `
background: red url(chrome://global/skin/icons/warning-64.png);
}
</style>
<div></div>
`;
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
yield selectNode("div", inspector);
yield testImageDimension(view);
yield testPickerDimension(view);
});
function* testImageDimension(ruleView) {
info("Testing background-image tooltip dimensions");
--- a/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-01.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-01.js
@@ -14,30 +14,32 @@ const TEST_URI = `
</style>
Test the css transform highlighter
`;
const TYPE = "CssTransformHighlighter";
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
+
let overlay = view.highlighters;
ok(!overlay.highlighters[TYPE], "No highlighter exists in the rule-view");
let h = yield overlay._getHighlighter(TYPE);
ok(overlay.highlighters[TYPE],
"The highlighter has been created in the rule-view");
is(h, overlay.highlighters[TYPE], "The right highlighter has been created");
let h2 = yield overlay._getHighlighter(TYPE);
is(h, h2,
"The same instance of highlighter is returned everytime in the rule-view");
let onComputedViewReady = inspector.once("computed-view-refreshed");
- let {view: cView} = yield openComputedView();
+ let cView = selectInspectorView("computedview", inspector);
yield onComputedViewReady;
overlay = cView.highlighters;
ok(!overlay.highlighters[TYPE], "No highlighter exists in the computed-view");
h = yield overlay._getHighlighter(TYPE);
ok(overlay.highlighters[TYPE],
"The highlighter has been created in the computed-view");
is(h, overlay.highlighters[TYPE], "The right highlighter has been created");
--- a/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-02.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-02.js
@@ -16,34 +16,35 @@ const TEST_URI = `
</style>
Test the css transform highlighter
`;
var TYPE = "CssTransformHighlighter";
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
let hs = view.highlighters;
ok(!hs.highlighters[TYPE], "No highlighter exists in the rule-view (1)");
info("Faking a mousemove on a non-transform property");
let {valueSpan} = getRuleViewProperty(view, "body", "color");
hs._onMouseMove({target: valueSpan});
ok(!hs.highlighters[TYPE], "No highlighter exists in the rule-view (2)");
info("Faking a mousemove on a transform property");
({valueSpan} = getRuleViewProperty(view, "body", "transform"));
let onHighlighterShown = hs.once("highlighter-shown");
hs._onMouseMove({target: valueSpan});
yield onHighlighterShown;
let onComputedViewReady = inspector.once("computed-view-refreshed");
- let {view: cView} = yield openComputedView();
+ let cView = selectInspectorView("computedview", inspector);
yield onComputedViewReady;
hs = cView.highlighters;
ok(!hs.highlighters[TYPE], "No highlighter exists in the computed-view (1)");
info("Faking a mousemove on a non-transform property");
({valueSpan} = getComputedViewProperty(cView, "color"));
hs._onMouseMove({target: valueSpan});
--- a/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-03.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-03.js
@@ -22,17 +22,18 @@ const TEST_URI = `
</style>
Test the css transform highlighter
`;
const TYPE = "CssTransformHighlighter";
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
// Mock the highlighter front to get the reference of the NodeFront
let HighlighterFront = {
isShown: false,
nodeFront: null,
nbOfTimesShown: 0,
show: function(nodeFront) {
this.nodeFront = nodeFront;
--- a/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-04.js
+++ b/devtools/client/inspector/shared/test/browser_styleinspector_transform-highlighter-04.js
@@ -24,17 +24,18 @@ const TEST_URI = `
</style>
<div class="test"></div>
`;
const TYPE = "CssTransformHighlighter";
add_task(function*() {
yield addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI));
- let {inspector, view} = yield openRuleView();
+ let {inspector} = yield openInspector();
+ let view = selectInspectorView("ruleview", inspector);
yield selectNode(".test", inspector);
let hs = view.highlighters;
info("Faking a mousemove on the overriden property");
let {valueSpan} = getRuleViewProperty(view, "div", "transform");
hs._onMouseMove({target: valueSpan});
ok(!hs.highlighters[TYPE],
--- a/devtools/client/inspector/shared/test/head.js
+++ b/devtools/client/inspector/shared/test/head.js
@@ -34,18 +34,19 @@ registerCleanupFunction(() => {
* (the instance of the current toolbox, or inspector panel for instance).
*
* Most of these functions are async too and return promises.
*
* All tests should follow the following pattern:
*
* add_task(function*() {
* yield addTab(TEST_URI);
- * let {toolbox, inspector, view} = yield openComputedView();
- *
+ * let {toolbox, inspector, view} = yield openInspector();
+ * inspector.sidebar.select(viewId);
+ * let view = inspector[viewId].view;
* yield selectNode("#test", inspector);
* yield someAsyncTestFunction(view);
* });
*
* add_task is the way to define the testcase in the test file. It accepts
* a single generator-function argument.
* The generator function should yield any async call.
*
@@ -80,112 +81,19 @@ addTab = function(url) {
return _addTab(url).then(tab => {
info("Loading the helper frame script " + FRAME_SCRIPT_URL);
let browser = tab.linkedBrowser;
browser.messageManager.loadFrameScript(FRAME_SCRIPT_URL, false);
return tab;
});
};
-/**
- * Open the toolbox, with the inspector tool visible.
- *
- * @return a promise that resolves when the inspector is ready
- */
-var openInspector = Task.async(function*() {
- info("Opening the inspector");
- let target = TargetFactory.forTab(gBrowser.selectedTab);
-
- let inspector, toolbox;
-
- // Checking if the toolbox and the inspector are already loaded
- // The inspector-updated event should only be waited for if the inspector
- // isn't loaded yet
- toolbox = gDevTools.getToolbox(target);
- if (toolbox) {
- inspector = toolbox.getPanel("inspector");
- if (inspector) {
- info("Toolbox and inspector already open");
- return {
- toolbox: toolbox,
- inspector: inspector
- };
- }
- }
-
- info("Opening the toolbox");
- toolbox = yield gDevTools.showToolbox(target, "inspector");
- yield waitForToolboxFrameFocus(toolbox);
- inspector = toolbox.getPanel("inspector");
-
- info("Waiting for the inspector to update");
- if (inspector._updateProgress) {
- yield inspector.once("inspector-updated");
- }
-
- return {
- toolbox: toolbox,
- inspector: inspector
- };
-});
-
-/**
- * Wait for the toolbox frame to receive focus after it loads
- *
- * @param {Toolbox} toolbox
- * @return a promise that resolves when focus has been received
- */
-function waitForToolboxFrameFocus(toolbox) {
- info("Making sure that the toolbox's frame is focused");
- let def = promise.defer();
- let win = toolbox.frame.contentWindow;
- waitForFocus(def.resolve, win);
- return def.promise;
-}
-
-/**
- * Open the toolbox, with the inspector tool visible, and the sidebar that
- * corresponds to the given id selected
- *
- * @return a promise that resolves when the inspector is ready and the sidebar
- * view is visible and ready
- */
-var openInspectorSideBar = Task.async(function*(id) {
- let {toolbox, inspector} = yield openInspector();
-
- info("Selecting the " + id + " sidebar");
- inspector.sidebar.select(id);
-
- return {
- toolbox: toolbox,
- inspector: inspector,
- view: inspector[id].view
- };
-});
-
-/**
- * Open the toolbox, with the inspector tool visible, and the computed-view
- * sidebar tab selected.
- *
- * @return a promise that resolves when the inspector is ready and the computed
- * view is visible and ready
- */
-function openComputedView() {
- return openInspectorSideBar("computedview");
-}
-
-/**
- * Open the toolbox, with the inspector tool visible, and the rule-view
- * sidebar tab selected.
- *
- * @return a promise that resolves when the inspector is ready and the rule
- * view is visible and ready
- */
-function openRuleView() {
- return openInspectorSideBar("ruleview");
+function selectInspectorView(viewId, inspector) {
+ inspector.sidebar.select(viewId);
+ return inspector[viewId].view;
}
/**
* Wait for a content -> chrome message on the message manager (the window
* messagemanager is used).
*
* @param {String} name
* The message name