nagai/fune
3
0
Fork 0
forked from mirrors/gecko-dev
Code Pull requests Activity

Bug 1267015 - ESLint cleanup of devtools/client/styleinspector/shared/test; r=bgrins

Browse source 
MozReview-Commit-ID: GKnRmlqIBxb

--HG--
extra : rebase_source : 69109deafb0af8113a31832b604208817a224dbb
This commit is contained in:
Patrick Brosset 2016-05-13 10:16:45 +02:00
parent b2488b6603
commit e4149a2ab9
18 changed files with 121 additions and 101 deletions
repo.diff.show_diff_stats Download patch file Download diff file Expand all files Collapse all files

1
.eslintignore
View file

@ -84,7 +84,6 @@ devtools/client/framework/**
# devtools/client/inspector/shared/*.js files are eslint-clean, so they aren't
# included in the ignore list.
devtools/client/inspector/fonts/**
devtools/client/inspector/shared/test/**
devtools/client/inspector/test/**
devtools/client/inspector/*.js
!devtools/client/inspector/breadcrumbs.js

85
devtools/client/inspector/shared/test/browser_styleinspector_context-menu-copy-urls.js
View file

@ -11,28 +11,25 @@ const TEST_DATA_URI = "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQA
// Invalid URL still needs to be reachable otherwise getImageDataUrl will
// timeout. DevTools chrome:// URLs aren't content accessible, so use some
// random resource:// URL here.
const INVALID_IMAGE_URI =
"resource://devtools/client/definitions.js";
const INVALID_IMAGE_URI = "resource://devtools/client/definitions.js";
const ERROR_MESSAGE = Services.strings
.createBundle(PROPERTIES_URL)
.GetStringFromName("styleinspector.copyImageDataUrlError");
add_task(function* () {
const PAGE_CONTENT = [
"<style type=\"text/css\">",
" .valid-background {",
" background-image: url(" + TEST_DATA_URI + ");",
" }",
" .invalid-background {",
" background-image: url(" + INVALID_IMAGE_URI + ");",
" }",
"</style>",
"<div class=\"valid-background\">Valid background image</div>",
"<div class=\"invalid-background\">Invalid background image</div>"
].join("\n");
const TEST_URI = `<style type="text/css">
.valid-background {
background-image: url(${TEST_DATA_URI});
}
.invalid-background {
background-image: url(${INVALID_IMAGE_URI});
}
</style>
<div class="valid-background">Valid background image</div>
<div class="invalid-background">Invalid background image</div>`;
yield addTab("data:text/html;charset=utf8," + encodeURIComponent(PAGE_CONTENT));
yield addTab("data:text/html;charset=utf8," + encodeURIComponent(TEST_URI));
yield startTest();
});
@ -42,28 +39,39 @@ function* startTest() {
let {inspector, view} = yield openRuleView();
info("Test valid background image URL in rule view");
yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".valid-background", TEST_DATA_URI);
yield testCopyUrlToClipboard({view, inspector}, "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({view, inspector}, "data-uri", ".invalid-background", ERROR_MESSAGE);
yield testCopyUrlToClipboard({view, inspector}, "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");
view = selectComputedView(inspector);
info("Test valid background image URL in computed view");
yield testCopyUrlToClipboard({view, inspector}, "data-uri", ".valid-background", TEST_DATA_URI);
yield testCopyUrlToClipboard({view, inspector}, "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({view, inspector}, "data-uri", ".invalid-background", ERROR_MESSAGE);
yield testCopyUrlToClipboard({view, inspector}, "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");
info("Retrieve background-image link for selected node in current " +
"styleinspector view");
let property = getBackgroundImageProperty(view, selector);
let imageLink = property.valueSpan.querySelector(".theme-link");
ok(imageLink, "Background-image link element found");
@ -71,26 +79,36 @@ function* testCopyUrlToClipboard({view, inspector}, type, selector, expected) {
info("Simulate right click on the background-image URL");
let popup = once(view._contextmenu._menupopup, "popupshown");
// Cannot rely on synthesizeMouseAtCenter here. The image URL can be displayed on several lines.
// A click simulated at the exact center may click between the lines and miss the target
// Instead, using the top-left corner of first client rect, with an offset of 2 pixels.
// Cannot rely on synthesizeMouseAtCenter here. The image URL can be displayed
// on several lines. A click simulated at the exact center may click between
// the lines and miss the target. Instead, using the top-left corner of first
// client rect, with an offset of 2 pixels.
let rect = imageLink.getClientRects()[0];
let x = rect.left + 2;
let y = rect.top + 2;
EventUtils.synthesizeMouseAtPoint(x, y, {button: 2, type: "contextmenu"}, getViewWindow(view));
EventUtils.synthesizeMouseAtPoint(x, y, {
button: 2,
type: "contextmenu"
}, getViewWindow(view));
yield popup;
info("Context menu is displayed");
ok(!view._contextmenu.menuitemCopyUrl.hidden, "\"Copy URL\" menu entry is displayed");
ok(!view._contextmenu.menuitemCopyImageDataUrl.hidden, "\"Copy Image Data-URL\" menu entry is displayed");
ok(!view._contextmenu.menuitemCopyUrl.hidden,
"\"Copy URL\" menu entry is displayed");
ok(!view._contextmenu.menuitemCopyImageDataUrl.hidden,
"\"Copy Image Data-URL\" menu entry is displayed");
if (type == "data-uri") {
info("Click Copy Data URI and wait for clipboard");
yield waitForClipboard(() => view._contextmenu.menuitemCopyImageDataUrl.click(), expected);
yield waitForClipboard(() => {
return view._contextmenu.menuitemCopyImageDataUrl.click();
}, expected);
} else {
info("Click Copy URL and wait for clipboard");
yield waitForClipboard(() => view._contextmenu.menuitemCopyUrl.click(), expected);
yield waitForClipboard(() => {
return view._contextmenu.menuitemCopyUrl.click();
}, expected);
}
info("Hide context menu");
@ -101,9 +119,8 @@ function getBackgroundImageProperty(view, selector) {
let isRuleView = view instanceof CssRuleView;
if (isRuleView) {
return getRuleViewProperty(view, selector, "background-image");
} else {
return getComputedViewProperty(view, "background-image");
}
return getComputedViewProperty(view, "background-image");
}
/**

13
devtools/client/inspector/shared/test/browser_styleinspector_output-parser.js
View file

@ -145,7 +145,9 @@ const TEST_DATA = [
},
{
name: "background",
value: "linear-gradient(to right, rgba(183,222,237,1) 0%, rgba(33,180,226,1) 30%, rgba(31,170,217,.5) 44%, #F06 75%, red 100%)",
value: "linear-gradient(to right, rgba(183,222,237,1) 0%, " +
"rgba(33,180,226,1) 30%, rgba(31,170,217,.5) 44%, " +
"#F06 75%, red 100%)",
test: fragment => {
is(countAll(fragment), 10);
let allSwatches = fragment.querySelectorAll("." + COLOR_CLASS);
@ -159,7 +161,8 @@ const TEST_DATA = [
},
{
name: "background",
value: "-moz-radial-gradient(center 45deg, circle closest-side, orange 0%, red 100%)",
value: "-moz-radial-gradient(center 45deg, circle closest-side, " +
"orange 0%, red 100%)",
test: fragment => {
is(countAll(fragment), 6);
let colorSwatches = fragment.querySelectorAll("." + COLOR_CLASS);
@ -207,10 +210,12 @@ const TEST_DATA = [
},
{
name: "background-image",
value: "url(../../../look/at/this/folder/structure/../../red.blue.green.svg )",
value: "url(../../../look/at/this/folder/structure/../" +
"../red.blue.green.svg )",
test: fragment => {
is(countAll(fragment), 1);
is(getUrl(fragment), "../../../look/at/this/folder/structure/../../red.blue.green.svg");
is(getUrl(fragment), "../../../look/at/this/folder/structure/../" +
"../red.blue.green.svg");
}
},
{

8
devtools/client/inspector/shared/test/doc_author-sheet.html
View file

@ -3,16 +3,15 @@
<html>
<head>
<title>authored sheet test</title>
<style>
#target {
color: chartreuse;
}
</style>
<script>
"use strict";
var gIOService = SpecialPowers.Cc["@mozilla.org/network/io-service;1"]
.getService(SpecialPowers.Ci.nsIIOService)
.getService(SpecialPowers.Ci.nsIIOService);
var style = "data:text/css,div { background-color: seagreen; }";
var uri = gIOService.newURI(style, null, null);
@ -20,13 +19,10 @@ var windowUtils = SpecialPowers.wrap(window)
.QueryInterface(SpecialPowers.Ci.nsIInterfaceRequestor)
.getInterface(SpecialPowers.Ci.nsIDOMWindowUtils);
windowUtils.loadSheet(uri, windowUtils.AUTHOR_SHEET);
</script>
</head>
<body>
<div id="target"> the ocean </div>
<input type=text placeholder=test></input>
<input type=color></input>
<input type=range></input>

13
devtools/client/inspector/shared/test/doc_content_stylesheet.html
View file

@ -1,20 +1,19 @@
<html>
<head>
<title>test</title>
<link href="./doc_content_stylesheet_linked.css" rel="stylesheet" type="text/css">
<script>
/* exported loadCSS */
"use strict";
// Load script.css
function loadCSS() {
var link = document.createElement('link');
link.rel = 'stylesheet';
link.type = 'text/css';
let link = document.createElement("link");
link.rel = "stylesheet";
link.type = "text/css";
link.href = "./doc_content_stylesheet_script.css";
document.getElementsByTagName('head')[0].appendChild(link);
document.getElementsByTagName("head")[0].appendChild(link);
}
</script>
<style>
table {
border: 1px solid #000;

22
devtools/client/inspector/shared/test/doc_frame_script.js
View file

@ -1,6 +1,7 @@
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/* globals addMessageListener, sendAsyncMessage */
"use strict";
@ -10,12 +11,12 @@
// then execute code upon receiving, and immediately send back a message.
// This is so that chrome test code can execute code in content and wait for a
// response this way:
// let response = yield executeInContent(browser, "Test:MessageName", data, true);
// The response message should have the same name "Test:MessageName"
// let response = yield executeInContent(browser, "Test:MsgName", data, true);
// The response message should have the same name "Test:MsgName"
//
// Some listeners do not send a response message back.
var {classes: Cc, interfaces: Ci, utils: Cu, results: Cr} = Components;
var {classes: Cc, interfaces: Ci, utils: Cu} = Components;
var {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
var {CssLogic} = require("devtools/shared/inspector/css-logic");
@ -84,8 +85,10 @@ addMessageListener("Test:GetStyleSheetsInfoForNode", function(msg) {
*/
addMessageListener("Test:GetComputedStylePropertyValue", function (msg) {
let {selector, pseudo, name} = msg.data;
let element = content.document.querySelector(selector);
let value = content.document.defaultView.getComputedStyle(element, pseudo).getPropertyValue(name);
let doc = content.document;
let element = doc.querySelector(selector);
let value = content.getComputedStyle(element, pseudo).getPropertyValue(name);
sendAsyncMessage("Test:GetComputedStylePropertyValue", value);
});
@ -108,9 +111,8 @@ addMessageListener("Test:WaitForComputedStylePropertyValue", function(msg) {
return value === expected;
}).then(() => {
sendAsyncMessage("Test:WaitForComputedStylePropertyValue");
})
});
});
var dumpn = msg => dump(msg + "\n");
@ -128,11 +130,11 @@ var dumpn = msg => dump(msg + "\n");
function waitForSuccess(validatorFn, name = "untitled") {
let def = promise.defer();
function wait(validatorFn) {
if (validatorFn()) {
function wait(fn) {
if (fn()) {
def.resolve();
} else {
setTimeout(() => wait(validatorFn), 200);
setTimeout(() => wait(fn), 200);
}
}
wait(validatorFn);

4
devtools/client/inspector/shared/test/head.js
View file

@ -1,6 +1,7 @@
/* vim: set ft=javascript ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/* eslint no-unused-vars: [2, {"vars": "local"}] */
/* import-globals-from ../../test/head.js */
"use strict";
@ -125,7 +126,8 @@ function waitForContentMessage(name) {
* @return {Promise} Resolves to the response data if a response is expected,
* immediately resolves otherwise
*/
function executeInContent(name, data={}, objects={}, expectResponse=true) {
function executeInContent(name, data = {}, objects = {},
expectResponse = true) {
info("Sending message " + name + " to content");
let mm = gBrowser.selectedBrowser.messageManager;