| Index: third_party/WebKit/LayoutTests/inspector-protocol/css/css-coverage-poll.html
|
| diff --git a/third_party/WebKit/LayoutTests/inspector-protocol/css/css-coverage-poll.html b/third_party/WebKit/LayoutTests/inspector-protocol/css/css-coverage-poll.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..7c4eb75c2c87faadff089e9c6d9ab45ad937ca17
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/inspector-protocol/css/css-coverage-poll.html
|
| @@ -0,0 +1,99 @@
|
| +<html>
|
| +<head>
|
| +<script type="text/javascript" src="../../http/tests/inspector-protocol/inspector-protocol-test.js"></script>
|
| +<script type="text/javascript" src="../../http/tests/inspector-protocol/css-protocol-test.js"></script>
|
| +<script type="text/javascript" src="../../http/tests/inspector-protocol/dom-protocol-test.js"></script>
|
| +<script type="text/javascript">
|
| +
|
| +function loadStylesheet(url)
|
| +{
|
| + var link = document.createElement("link");
|
| + link.rel = "stylesheet";
|
| + link.href = url;
|
| + var promise = new Promise(fulfill => {
|
| + link.addEventListener("load", requestAnimationFrame.bind(window, fulfill));
|
| + });
|
| + document.head.appendChild(link);
|
| + return promise;
|
| +}
|
| +
|
| +function useMoreCSS(className) {
|
| + var div = document.createElement("div");
|
| + div.classList.add(className);
|
| + document.body.appendChild(div);
|
| + div.offsetHeight; // Force layout & style recalc
|
| + return Promise.resolve();
|
| +}
|
| +
|
| +async function test()
|
| +{
|
| + var stylesheetIdToURL = new Map();
|
| + InspectorTest.eventHandler["CSS.styleSheetAdded"] = styleSheetAdded;
|
| +
|
| + InspectorTest.sendCommandPromise("DOM.enable", {});
|
| + await InspectorTest.sendCommandPromise("CSS.enable", {});
|
| + await InspectorTest.sendCommandPromise("CSS.startRuleUsageTracking", {});
|
| +
|
| + await doActionAndDump("");
|
| + await doActionAndDump("loadStylesheet('resources/coverage2.css')");
|
| + await doActionAndDump("useMoreCSS('usedSomewhatLater')");
|
| + await InspectorTest.evaluateInPageAsync("useMoreCSS('usedAtTheVeryEnd')");
|
| +
|
| + var response = await InspectorTest.sendCommandPromise("CSS.stopRuleUsageTracking", {});
|
| +
|
| + if (response.result)
|
| + dumpCoverageData(response.result.ruleUsage);
|
| +
|
| + InspectorTest.completeTest();
|
| +
|
| + function styleSheetAdded(event)
|
| + {
|
| + var header = event.params.header;
|
| + var url = /(([^/]*\/){2}[^/]*$)/.exec(header.sourceURL)[1];
|
| + stylesheetIdToURL.set(header.styleSheetId, url);
|
| + }
|
| +
|
| + function dumpCoverageData(rules)
|
| + {
|
| + InspectorTest.log(`Coverage delta (${rules.length} entries)`);
|
| + rules.sort((a, b) =>
|
| + (stylesheetIdToURL.get(a.styleSheetId) || '').localeCompare(stylesheetIdToURL.get(b.styleSheetId)) || a.startOffset - b.startOffset
|
| + );
|
| + var lastURL;
|
| + var output = '';
|
| + for (var rule of rules) {
|
| + var url = stylesheetIdToURL.get(rule.styleSheetId) || '<unknown>';
|
| + if (lastURL !== url)
|
| + output += ` ${output ? '\n' : ''}${url}:`;
|
| + lastURL = url;
|
| + var used = rule.used ? '+' : '-';
|
| + output += ` ${used}${rule.startOffset}-${rule.endOffset}`;
|
| + }
|
| + InspectorTest.log(output);
|
| + }
|
| +
|
| + async function doActionAndDump(expression)
|
| + {
|
| + InspectorTest.log(`${expression} =>`);
|
| + if (expression)
|
| + await InspectorTest.evaluateInPageAsync(expression);
|
| + var response = await InspectorTest.sendCommandPromise("CSS.takeCoverageDelta", {});
|
| + if (!response.result) {
|
| + InspectorTest.log(`ERROR: ${response.error}`);
|
| + InspectorTest.completeTest();
|
| + return;
|
| + }
|
| + dumpCoverageData(response.result.coverage);
|
| + }
|
| +}
|
| +
|
| +</script>
|
| +<link rel="stylesheet" href="resources/coverage.css">
|
| +</head>
|
| +<body onload="runTest();">
|
| +<h1 class="class">Class Selector</h1>
|
| +<p id="id" class="usedStraightAway">ID Selector</p>
|
| +<div></div>
|
| +
|
| +</body>
|
| +</html>
|
|
|
Chromium Code Reviews
Issue 2759703003:
DevTools: add support for polling for coverage data in CSS agent (Closed)
