Bug 1016285 - Add more unit tests for css coverage; r=harth

This commit is contained in:
Joe Walker 2014-06-17 09:12:16 +01:00
Родитель 992e55c041
Коммит 2e4f3861ec
6 изменённых файлов: 526 добавлений и 55 удалений

Просмотреть файл

@ -20,16 +20,41 @@ let test = asyncTest(function*() {
let usage = yield csscoverage.getUsage(options.target);
yield usage.oneshot();
yield navigate(usage, options);
yield checkPages(usage);
yield checkEditorReport(usage);
yield checkPageReport(usage);
yield helpers.closeToolbar(options);
yield helpers.closeTab(options);
});
/**
* Just check current page
*/
function* navigate(usage, options) {
let running = yield usage._testOnly_isRunning();
ok(!running, "csscoverage not is running");
// Pages visited
yield usage.oneshot();
running = yield usage._testOnly_isRunning();
ok(!running, "csscoverage not is running");
}
/**
* Check the expected pages have been visited
*/
function* checkPages(usage) {
let expectedVisited = [ PAGE_3 ];
let actualVisited = yield usage._testOnly_visitedPages();
isEqualJson(actualVisited, expectedVisited, 'Visited');
}
/**
* Check that createEditorReport returns the expected JSON
*/
function* checkEditorReport(usage) {
// Page1
let expectedPage1 = { reports: [] };
let actualPage1 = yield usage.createEditorReport(PAGE_1 + " \u2192 <style> index 0");
@ -143,11 +168,148 @@ let test = asyncTest(function*() {
};
let actualSheetD = yield usage.createEditorReport(SHEET_D);
isEqualJson(actualSheetD, expectedSheetD, 'SheetD');
}
yield helpers.closeToolbar(options);
yield helpers.closeTab(options);
});
/**
* Check that checkPageReport returns the expected JSON
*/
function* checkPageReport(usage) {
let actualReport = yield usage.createPageReport();
// Quick check on trivial things. See doc comment for checkRuleProperties
actualReport.preload.forEach(page => page.rules.forEach(checkRuleProperties));
actualReport.unused.forEach(page => page.rules.forEach(checkRuleProperties));
// Check the summary
let expectedSummary = { "used": 23, "unused": 9, "preload": 0 };
isEqualJson(actualReport.summary, expectedSummary, 'summary');
// Check the preload header
isEqualJson(actualReport.preload.length, 0, 'preload length');
// Check the unused header
isEqualJson(actualReport.unused.length, 6, 'unused length');
// Check the unused rules
isEqualJson(actualReport.unused[0].url, PAGE_3 + " \u2192 <style> index 0", "unused url 0");
let expectedUnusedRules0 = [
{
"url": PAGE_3 + " \u2192 <style> index 0",
"start": { "line": 9, "column": 5 },
"selectorText": ".page3-test2"
}
];
isEqualJson(actualReport.unused[0].rules, expectedUnusedRules0, 'unused rules 0');
isEqualJson(actualReport.unused[1].url, PAGE_3 + " \u2192 <style> index 1", "unused url 1");
let expectedUnusedRules1 = [
{
"url": PAGE_3 + " \u2192 <style> index 1",
"start": { "line": 3, "column": 5 },
"selectorText": ".page3-test3"
}
];
isEqualJson(actualReport.unused[1].rules, expectedUnusedRules1, 'unused rules 1');
isEqualJson(actualReport.unused[2].url, SHEET_A, "unused url 2");
let expectedUnusedRules2 = [
{
"url": SHEET_A,
"start": { "line": 8, "column": 1 },
"selectorText": ".sheetA-test2"
},
{
"url": SHEET_A,
"start": { "line": 12, "column": 1 },
"selectorText": ".sheetA-test3"
},
{
"url": SHEET_A,
"start": { "line": 16, "column": 1 },
"selectorText": ".sheetA-test4"
}
];
isEqualJson(actualReport.unused[2].rules, expectedUnusedRules2, 'unused rules 2');
isEqualJson(actualReport.unused[3].url, SHEET_B, "unused url 3");
let expectedUnusedRules3 = [
{
"url": SHEET_B,
"start": { "line": 6, "column": 1 },
"selectorText": ".sheetB-test2"
},
{
"url": SHEET_B,
"start": { "line": 10, "column": 1 },
"selectorText": ".sheetB-test3"
},
{
"url": SHEET_B,
"start": { "line": 14, "column": 1 },
"selectorText": ".sheetB-test4"
}
];
isEqualJson(actualReport.unused[3].rules, expectedUnusedRules3, 'unused rules 3');
isEqualJson(actualReport.unused[4].url, SHEET_D, "unused url 4");
let expectedUnusedRules4 = [
{
"url": SHEET_D,
"start": { "line": 6, "column": 1 },
"selectorText": ".sheetD-test2"
},
{
"url": SHEET_D,
"start": { "line": 10, "column": 1 },
"selectorText": ".sheetD-test3"
},
{
"url": SHEET_D,
"start": { "line": 14, "column": 1 },
"selectorText": ".sheetD-test4"
}
];
isEqualJson(actualReport.unused[4].rules, expectedUnusedRules4, 'unused rules 4');
isEqualJson(actualReport.unused[5].url, SHEET_C, "unused url 5");
let expectedUnusedRules5 = [
{
"url": SHEET_C,
"start": { "line": 6, "column": 1 },
"selectorText": ".sheetC-test2"
},
{
"url": SHEET_C,
"start": { "line": 10, "column": 1 },
"selectorText": ".sheetC-test3"
},
{
"url": SHEET_C,
"start": { "line": 14, "column": 1 },
"selectorText": ".sheetC-test4"
}
];
isEqualJson(actualReport.unused[5].rules, expectedUnusedRules5, 'unused rules 5');
}
/**
* We do basic tests on the shortUrl and formattedCssText because they are
* very derivative, and so make for fragile tests, and having done those quick
* existence checks we remove them so the JSON check later can ignore them
*/
function checkRuleProperties(rule, index) {
is(typeof rule.shortUrl, "string", "typeof rule.shortUrl for " + index);
is(rule.shortUrl.indexOf("http://"), -1, "http not in rule.shortUrl for" + index);
delete rule.shortUrl;
is(typeof rule.formattedCssText, "string", "typeof rule.formattedCssText for " + index);
ok(rule.formattedCssText.indexOf("{") > 0, "{ in rule.formattedCssText for " + index);
delete rule.formattedCssText;
}
/**
* Utility to compare JSON structures
*/
function isEqualJson(o1, o2, msg) {
is(JSON.stringify(o1), JSON.stringify(o2), msg);
}

Просмотреть файл

@ -42,11 +42,13 @@
/* How quickly do we rush through this? */
let delay = 500;
window.addEventListener("load", () => {
dump('TEST-INFO | load from browser_cmd_csscoverage_page1.html\n');
setTimeout(() => {
dump('TEST-INFO | timeout from browser_cmd_csscoverage_page1.html\n');
/* This adds <div class=page1-test5></div> */
let parent = document.querySelector("#page1-test5-holder");
let child = document.createElement("div");
child.classList.add("class=page1-test5");
child.classList.add("page1-test5");
parent.appendChild(child);
/* Then navigate to the next step */

Просмотреть файл

@ -26,11 +26,13 @@
/* How quickly do we rush through this? */
let delay = 500;
window.addEventListener("load", () => {
dump('TEST-INFO | load from browser_cmd_csscoverage_page2.html\n');
setTimeout(() => {
dump('TEST-INFO | timeout from browser_cmd_csscoverage_page2.html\n');
/* This adds <div class=page2-test3></div> */
let parent = document.querySelector("#page2-test3-holder");
let child = document.createElement("div");
child.classList.add("class=page2-test3");
child.classList.add("page2-test3");
parent.appendChild(child);
}, delay);
});
@ -41,7 +43,6 @@
<h2>Page 2</h2>
<div class=page2-test1>.page2-test1</div>
<div class=page2-test3>.page2-test3</div>
<div id=page2-test3-holder></div>

Просмотреть файл

@ -23,6 +23,11 @@
</style>
<link rel="stylesheet" type="text/css" href="browser_cmd_csscoverage_sheetA.css">
<link rel="stylesheet" type="text/css" href="browser_cmd_csscoverage_sheetB.css">
<script type="application/javascript;version=1.8">
window.addEventListener("load", () => {
dump('TEST-INFO | load from browser_cmd_csscoverage_page3.html\n');
});
</script>
</head>
<body>

Просмотреть файл

@ -20,30 +20,74 @@ let test = asyncTest(function*() {
let usage = yield csscoverage.getUsage(options.target);
yield navigate(usage, options);
yield checkPages(usage);
yield checkEditorReport(usage);
yield checkPageReport(usage);
yield helpers.closeToolbar(options);
yield helpers.closeTab(options);
});
/**
* Visit all the pages in the test
*/
function* navigate(usage, options) {
yield usage.start();
let running = yield usage._testOnly_isRunning();
ok(running, "csscoverage is running");
yield helpers.navigate(PAGE_3, options);
yield helpers.navigate(PAGE_1, options);
// Wait for the test pages to auto-cycle
let ev = yield helpers.listenOnce(options.browser, "load", true);
is(ev.target.location.href, PAGE_1, "page 1 loaded");
ev = yield helpers.listenOnce(options.browser, "load", true);
is(ev.target.location.href, PAGE_3, "page 3 loaded");
yield usage.stop();
running = yield usage._testOnly_isRunning();
ok(!running, "csscoverage not is running");
}
// Pages visited
let expectedVisited = [ '', PAGE_3 ]; // '' is for the initial location
/**
* Check the expected pages have been visited
*/
function* checkPages(usage) {
// 'load' event order. '' is for the initial location
let expectedVisited = [ '', PAGE_2, PAGE_1, PAGE_3 ];
let actualVisited = yield usage._testOnly_visitedPages();
isEqualJson(actualVisited, expectedVisited, 'Visited');
}
/**
* Check that createEditorReport returns the expected JSON
*/
function* checkEditorReport(usage) {
// Page1
let expectedPage1 = { reports: [] };
let expectedPage1 = {
reports: [
{
selectorText: ".page1-test2",
start: { line: 8, column: 5 },
}
]
};
let actualPage1 = yield usage.createEditorReport(PAGE_1 + " \u2192 <style> index 0");
isEqualJson(actualPage1, expectedPage1, 'Page1');
// Page2
let expectedPage2 = { reports: [] };
let expectedPage2 = {
reports: [
{
selectorText: ".page2-test2",
start: { line: 9, column: 5 },
},
]
};
let actualPage2 = yield usage.createEditorReport(PAGE_2 + " \u2192 <style> index 0");
isEqualJson(actualPage2, expectedPage2, 'Page2');
@ -77,14 +121,6 @@ let test = asyncTest(function*() {
{
selectorText: ".sheetA-test2",
start: { line: 8, column: 1 },
},
{
selectorText: ".sheetA-test3",
start: { line: 12, column: 1 },
},
{
selectorText: ".sheetA-test4",
start: { line: 16, column: 1 },
}
]
};
@ -97,14 +133,6 @@ let test = asyncTest(function*() {
{
selectorText: ".sheetB-test2",
start: { line: 6, column: 1 },
},
{
selectorText: ".sheetB-test3",
start: { line: 10, column: 1 },
},
{
selectorText: ".sheetB-test4",
start: { line: 14, column: 1 },
}
]
};
@ -117,14 +145,6 @@ let test = asyncTest(function*() {
{
selectorText: ".sheetC-test2",
start: { line: 6, column: 1 },
},
{
selectorText: ".sheetC-test3",
start: { line: 10, column: 1 },
},
{
selectorText: ".sheetC-test4",
start: { line: 14, column: 1 },
}
]
};
@ -137,24 +157,303 @@ let test = asyncTest(function*() {
{
selectorText: ".sheetD-test2",
start: { line: 6, column: 1 },
},
{
selectorText: ".sheetD-test3",
start: { line: 10, column: 1 },
},
{
selectorText: ".sheetD-test4",
start: { line: 14, column: 1 },
}
]
};
let actualSheetD = yield usage.createEditorReport(SHEET_D);
isEqualJson(actualSheetD, expectedSheetD, 'SheetD');
}
yield helpers.closeToolbar(options);
yield helpers.closeTab(options);
});
/**
* Check that checkPageReport returns the expected JSON
*/
function* checkPageReport(usage) {
let actualReport = yield usage.createPageReport();
// Quick check on trivial things. See doc comment for checkRuleProperties
actualReport.preload.forEach(page => page.rules.forEach(checkRuleProperties));
actualReport.unused.forEach(page => page.rules.forEach(checkRuleProperties));
// Check the summary
let expectedSummary = { "used": 92, "unused": 22, "preload": 28 };
isEqualJson(actualReport.summary, expectedSummary, 'summary');
checkPageReportPreload(actualReport);
checkPageReportUnused(actualReport);
}
/**
* Check that checkPageReport returns the expected preload JSON
*/
function checkPageReportPreload(actualReport) {
// Check the preload header
isEqualJson(actualReport.preload.length, 3, 'preload length');
// Check the preload rules
isEqualJson(actualReport.preload[0].url, PAGE_2, 'preload url 0');
let expectedPreloadRules0 = [
// TODO: This is already pre-loaded, we should note this
{
url: PAGE_2 + " \u2192 <style> index 0",
start: { line: 5, column: 5 },
selectorText: ".page2-test1"
},
{
url: SHEET_A,
start: { line: 4, column: 1 },
selectorText: ".sheetA-test1"
},
{
url: SHEET_A,
start: { line: 16, column: 1 },
selectorText: ".sheetA-test4"
},
{
url: SHEET_B,
start: { line: 2, column: 1 },
selectorText: ".sheetB-test1"
},
{
url: SHEET_B,
start: { line: 14, column: 1 },
selectorText: ".sheetB-test4"
},
{
url: SHEET_D,
start: { line: 2, column: 1 },
selectorText: ".sheetD-test1"
},
{
url: SHEET_D,
start: { line: 14, column: 1 },
selectorText: ".sheetD-test4"
},
{
url: SHEET_C,
start: { line: 2, column: 1 },
selectorText: ".sheetC-test1"
},
{
url: SHEET_C,
start: { line: 14, column: 1 },
selectorText: ".sheetC-test4"
}
];
isEqualJson(actualReport.preload[0].rules, expectedPreloadRules0, 'preload rules 0');
isEqualJson(actualReport.preload[1].url, PAGE_1, 'preload url 1');
let expectedPreloadRules1 = [
{
url: SHEET_A,
start: { line: 4, column: 1 },
selectorText: ".sheetA-test1"
},
{
url: SHEET_A,
start: { line: 12, column: 1 },
selectorText: ".sheetA-test3"
},
{
url: SHEET_B,
start: { line: 2, column: 1 },
selectorText: ".sheetB-test1"
},
{
url: SHEET_B,
start: { line: 10, column: 1 },
selectorText: ".sheetB-test3"
},
{
url: SHEET_D,
start: { line: 2, column: 1 },
selectorText: ".sheetD-test1"
},
{
url: SHEET_D,
start: { line: 10, column: 1 },
selectorText: ".sheetD-test3"
},
{
url: SHEET_C,
start: { line: 2, column: 1 },
selectorText: ".sheetC-test1"
},
{
url: SHEET_C,
start: { line: 10, column: 1 },
selectorText: ".sheetC-test3"
},
{
url: PAGE_1 + " \u2192 <style> index 0",
start: { line: 4, column: 5 },
selectorText: ".page1-test1"
},
{
url: PAGE_1 + " \u2192 <style> index 0",
start: { line: 12, column: 5 },
selectorText: ".page1-test3:hover"
}
];
isEqualJson(actualReport.preload[1].rules, expectedPreloadRules1, 'preload rules 1');
isEqualJson(actualReport.preload[2].url, PAGE_3, 'preload url 2');
let expectedPreloadRules2 = [
{
url: SHEET_A,
start: { line: 4, column: 1 },
selectorText: ".sheetA-test1"
},
{
url: SHEET_A,
start: { line: 20, column: 1 },
selectorText: ".sheetA-test5"
},
{
url: SHEET_B,
start: { line: 2, column: 1 },
selectorText: ".sheetB-test1"
},
{
url: SHEET_B,
start: { line: 18, column: 1 },
selectorText: ".sheetB-test5"
},
{
url: SHEET_D,
start: { line: 2, column: 1 },
selectorText: ".sheetD-test1"
},
{
url: SHEET_D,
start: { line: 18, column: 1 },
selectorText: ".sheetD-test5"
},
{
url: SHEET_C,
start: { line: 2, column: 1 },
selectorText: ".sheetC-test1"
},
{
url: SHEET_C,
start: { line: 18, column: 1 },
selectorText: ".sheetC-test5"
},
{
url: PAGE_3 + " \u2192 <style> index 0",
start: { line: 5, column: 5 },
selectorText: ".page3-test1"
},
];
isEqualJson(actualReport.preload[2].rules, expectedPreloadRules2, 'preload rules 2');
}
/**
* Check that checkPageReport returns the expected unused JSON
*/
function checkPageReportUnused(actualReport) {
// Check the unused header
isEqualJson(actualReport.unused.length, 8, 'unused length');
// Check the unused rules
isEqualJson(actualReport.unused[0].url, PAGE_2 + " \u2192 <style> index 0", "unused url 0");
let expectedUnusedRules0 = [
{
url: PAGE_2 + " \u2192 <style> index 0",
start: { line: 9, column: 5 },
selectorText: ".page2-test2"
}
];
isEqualJson(actualReport.unused[0].rules, expectedUnusedRules0, 'unused rules 0');
isEqualJson(actualReport.unused[1].url, SHEET_A, "unused url 1");
let expectedUnusedRules1 = [
{
url: SHEET_A,
start: { line: 8, column: 1 },
selectorText: ".sheetA-test2"
}
];
isEqualJson(actualReport.unused[1].rules, expectedUnusedRules1, 'unused rules 1');
isEqualJson(actualReport.unused[2].url, SHEET_B, "unused url 2");
let expectedUnusedRules2 = [
{
url: SHEET_B,
start: { line: 6, column: 1 },
selectorText: ".sheetB-test2"
}
];
isEqualJson(actualReport.unused[2].rules, expectedUnusedRules2, 'unused rules 2');
isEqualJson(actualReport.unused[3].url, SHEET_D, "unused url 3");
let expectedUnusedRules3 = [
{
url: SHEET_D,
start: { line: 6, column: 1 },
selectorText: ".sheetD-test2"
}
];
isEqualJson(actualReport.unused[3].rules, expectedUnusedRules3, 'unused rules 3');
isEqualJson(actualReport.unused[4].url, SHEET_C, "unused url 4");
let expectedUnusedRules4 = [
{
url: SHEET_C,
start: { line: 6, column: 1 },
selectorText: ".sheetC-test2"
}
];
isEqualJson(actualReport.unused[4].rules, expectedUnusedRules4, 'unused rules 4');
isEqualJson(actualReport.unused[5].url, PAGE_1 + " \u2192 <style> index 0", "unused url 5");
let expectedUnusedRules5 = [
{
url: PAGE_1 + " \u2192 <style> index 0",
start: { line: 8, column: 5 },
selectorText: ".page1-test2"
}
];
isEqualJson(actualReport.unused[5].rules, expectedUnusedRules5, 'unused rules 5');
isEqualJson(actualReport.unused[6].url, PAGE_3 + " \u2192 <style> index 0", "unused url 6");
let expectedUnusedRules6 = [
{
url: PAGE_3 + " \u2192 <style> index 0",
start: { line: 9, column: 5 },
selectorText: ".page3-test2"
}
];
isEqualJson(actualReport.unused[6].rules, expectedUnusedRules6, 'unused rules 6');
isEqualJson(actualReport.unused[7].url, PAGE_3 + " \u2192 <style> index 1", "unused url 7");
let expectedUnusedRules7 = [
{
url: PAGE_3 + " \u2192 <style> index 1",
start: { line: 3, column: 5 },
selectorText: ".page3-test3"
}
];
isEqualJson(actualReport.unused[7].rules, expectedUnusedRules7, 'unused rules 7');
}
/**
* We do basic tests on the shortUrl and formattedCssText because they are
* very derivative, and so make for fragile tests, and having done those quick
* existence checks we remove them so the JSON check later can ignore them
*/
function checkRuleProperties(rule, index) {
is(typeof rule.shortUrl, "string", "typeof rule.shortUrl for " + index);
is(rule.shortUrl.indexOf("http://"), -1, "http not in rule.shortUrl for" + index);
delete rule.shortUrl;
is(typeof rule.formattedCssText, "string", "typeof rule.formattedCssText for " + index);
ok(rule.formattedCssText.indexOf("{") > 0, "{ in rule.formattedCssText for " + index);
delete rule.formattedCssText;
}
/**
* Utility to compare JSON structures
*/
function isEqualJson(o1, o2, msg) {
is(JSON.stringify(o1), JSON.stringify(o2), msg);
}

Просмотреть файл

@ -179,7 +179,8 @@ let UsageReportActor = protocol.ActorClass({
observer.observe(document, {
attributes: true,
childList: true,
characterData: false
characterData: false,
subtree: true
});
},
@ -363,7 +364,7 @@ let UsageReportActor = protocol.ActorClass({
const ruleToRuleReport = function(rule, ruleData) {
return {
url: rule.url,
shortUrl: rule.url.split("/").slice(-1),
shortUrl: rule.url.split("/").slice(-1)[0],
start: { line: rule.line, column: rule.column },
selectorText: ruleData.selectorText,
formattedCssText: CssLogic.prettifyCSS(ruleData.cssText)
@ -646,10 +647,11 @@ const SEL_MEDIA = [ "blank", "first", "left", "right" ];
* we think should not have to match in order for the selector to be relevant.
*/
function getTestSelector(selector) {
let replacement = selector;
let replaceSelector = pseudo => {
selector = selector.replace(" :" + selector, " *")
.replace("(:" + selector, "(*")
.replace(":" + selector, "");
replacement = replacement.replace(" :" + pseudo, " *")
.replace("(:" + pseudo, "(*")
.replace(":" + pseudo, "");
};
SEL_EXTERNAL.forEach(replaceSelector);
@ -658,10 +660,10 @@ function getTestSelector(selector) {
// Pseudo elements work in : and :: forms
SEL_ELEMENT.forEach(pseudo => {
selector = selector.replace("::" + selector, "");
replacement = replacement.replace("::" + pseudo, "");
});
return selector;
return replacement;
}
/**