Chromium Code Reviews Chromium Code Reviews
Issue 2759703003:
DevTools: add support for polling for coverage data in CSS agent (Closed)
| OLD | NEW |
|---|---|
| (Empty) | |
| 1 <html> | |
| 2 <head> | |
| 3 <script type="text/javascript" src="../../http/tests/inspector-protocol/inspecto r-protocol-test.js"></script> | |
| 4 <script type="text/javascript" src="../../http/tests/inspector-protocol/css-prot ocol-test.js"></script> | |
| 5 <script type="text/javascript" src="../../http/tests/inspector-protocol/dom-prot ocol-test.js"></script> | |
| 6 <script type="text/javascript"> | |
| 7 | |
| 8 function loadStylesheet(url) | |
| 9 { | |
| 10 var link = document.createElement("link"); | |
| 11 link.rel = "stylesheet"; | |
| 12 link.href = url; | |
| 13 var promise = new Promise(fulfill => { link.addEventListener("load", fulfill ); }); | |
| 14 document.head.appendChild(link); | |
| 15 return promise; | |
| 16 } | |
| 17 | |
| 18 function useMoreCSS(className) { | |
| 19 var div = document.createElement("div"); | |
| 20 div.classList.add(className); | |
| 21 document.body.appendChild(div); | |
| 22 div.offsetHeight; // Force layout & style recalc | |
| 23 return Promise.resolve(); | |
| 24 } | |
| 25 | |
| 26 async function test() | |
| 27 { | |
| 28 var stylesheetIdToURL = new Map(); | |
| 29 InspectorTest.eventHandler["CSS.styleSheetAdded"] = styleSheetAdded; | |
| 30 | |
| 31 InspectorTest.sendCommandPromise("DOM.enable", {}); | |
| 32 await InspectorTest.sendCommandPromise("CSS.enable", {}); | |
| 33 await InspectorTest.sendCommandPromise("CSS.startRuleUsageTracking", {}); | |
| 34 | |
| 35 await doActionAndDump(""); | |
| 36 await doActionAndDump("loadStylesheet('resources/coverage2.css')"); | |
| 37 await doActionAndDump("useMoreCSS('usedSomewhatLater')"); | |
| 38 await InspectorTest.evaluateInPageAsync("useMoreCSS('usedAtTheVeryEnd')"); | |
| 39 | |
| 40 var response = await InspectorTest.sendCommandPromise("CSS.stopRuleUsageTrac king", {}); | |
| 41 | |
| 42 if (!response.result) { | |
|
alph
2017/03/20 20:48:31
nit: if (result) dump...
| |
| 43 InspectorTest.completeTest(); | |
| 44 return; | |
| 45 } | |
| 46 dumpCoverageData(response.result.ruleUsage); | |
| 47 InspectorTest.completeTest(); | |
| 48 | |
| 49 function styleSheetAdded(event) | |
| 50 { | |
| 51 var header = event.params.header; | |
| 52 var url = /(([^/]*\/){2}[^/]*$)/.exec(header.sourceURL)[1]; | |
| 53 stylesheetIdToURL.set(header.styleSheetId, url); | |
| 54 } | |
| 55 | |
| 56 function dumpCoverageData(rules) | |
| 57 { | |
| 58 InspectorTest.log(`Coverage delta (${rules.length} entries)`); | |
| 59 rules.sort((a, b) => | |
| 60 (stylesheetIdToURL.get(a.styleSheetId) || '').localeCompare(styleshe etIdToURL.get(b.styleSheetId)) || a.startOffset - b.startOffset | |
| 61 ); | |
| 62 var lastURL; | |
| 63 var output = ''; | |
| 64 for (var rule of rules) { | |
| 65 var url = stylesheetIdToURL.get(rule.styleSheetId) || '<unknown>'; | |
| 66 if (lastURL !== url) | |
| 67 output += ` ${output ? '\n' : ''}${url}:`; | |
| 68 lastURL = url; | |
| 69 var used = rule.used ? '+' : '-'; | |
| 70 output += ` ${used}${rule.startOffset}-${rule.endOffset}`; | |
| 71 } | |
| 72 InspectorTest.log(output); | |
| 73 } | |
| 74 | |
| 75 async function doActionAndDump(expression) | |
| 76 { | |
| 77 InspectorTest.log(`${expression} =>`); | |
| 78 if (expression) | |
| 79 await InspectorTest.evaluateInPageAsync(expression); | |
| 80 var response = await InspectorTest.sendCommandPromise("CSS.takeCoverageD elta", {}); | |
| 81 if (!response.result) { | |
| 82 InspectorTest.log(`ERROR: ${response.error}`); | |
| 83 InspectorTest.completeTest(); | |
| 84 return; | |
| 85 } | |
| 86 dumpCoverageData(response.result.coverage); | |
| 87 } | |
| 88 } | |
| 89 | |
| 90 </script> | |
| 91 <link rel="stylesheet" href="resources/coverage.css"> | |
| 92 </head> | |
| 93 <body onload="runTest();"> | |
| 94 <h1 class="class">Class Selector</h1> | |
| 95 <p id="id" class="usedStraightAway">ID Selector</p> | |
| 96 <div></div> | |
| 97 | |
| 98 </body> | |
| 99 </html> | |
| OLD | NEW |
