| OLD | NEW |
| 1 <html> | 1 <html> |
| 2 <head> | 2 <head> |
| 3 <script src="../../http/tests/inspector/inspector-test.js"></script> | 3 <script src="../../http/tests/inspector/inspector-test.js"></script> |
| 4 <script src="../../http/tests/inspector/elements-test.js"></script> | 4 <script src="../../http/tests/inspector/elements-test.js"></script> |
| 5 <style> | 5 <style> |
| 6 .border { | 6 .border { |
| 7 border: 1px solid black; | 7 border: 1px solid black; |
| 8 } | 8 } |
| 9 </style> | 9 </style> |
| 10 <script> | 10 <script> |
| 11 | 11 |
| 12 function requestAnimationFramePromise() |
| 13 { |
| 14 return new Promise(fulfill => requestAnimationFrame(fulfill)); |
| 15 } |
| 16 |
| 12 function buildShadowDOM() | 17 function buildShadowDOM() |
| 13 { | 18 { |
| 14 var host = document.querySelector("body"); | 19 var host = document.querySelector("body"); |
| 15 var root = host.createShadowRoot(); | 20 var root = host.createShadowRoot(); |
| 16 var template = document.querySelector("#dom-template"); | 21 var template = document.querySelector("#dom-template"); |
| 17 var clone = document.importNode(template.content, true); | 22 var clone = document.importNode(template.content, true); |
| 18 root.appendChild(clone); | 23 root.appendChild(clone); |
| 19 var second = root.querySelector("#fifth"); | 24 var second = root.querySelector("#fifth"); |
| 20 second.id = "inspected-shadow"; | 25 second.id = "inspected-shadow"; |
| 21 runTest(); | 26 runTest(); |
| (...skipping 13 matching lines...) Expand all Loading... |
| 35 | 40 |
| 36 function onSelected() | 41 function onSelected() |
| 37 { | 42 { |
| 38 resetHighlightCount(onHighlightCountReset); | 43 resetHighlightCount(onHighlightCountReset); |
| 39 } | 44 } |
| 40 | 45 |
| 41 function onHighlightCountReset() | 46 function onHighlightCountReset() |
| 42 { | 47 { |
| 43 var section = InspectorTest.firstMatchedStyleSection(); | 48 var section = InspectorTest.firstMatchedStyleSection(); |
| 44 section._highlight(); | 49 section._highlight(); |
| 45 InspectorTest.waitForOverlayRepaint(onHighlighted); | 50 InspectorTest.callFunctionInPageAsync("requestAnimationFrameProm
ise").then(onHighlighted) |
| 46 } | 51 } |
| 47 | 52 |
| 48 function onHighlighted() | 53 function onHighlighted() |
| 49 { | 54 { |
| 50 dumpHighlightCount(next); | 55 dumpHighlightCount(next); |
| 51 } | 56 } |
| 52 }, | 57 }, |
| 53 | 58 |
| 54 function testShadowDOMNodeSelection(next) | 59 function testShadowDOMNodeSelection(next) |
| 55 { | 60 { |
| 56 InspectorTest.selectNodeAndWaitForStyles("inspected-shadow", onSelec
ted); | 61 InspectorTest.selectNodeAndWaitForStyles("inspected-shadow", onSelec
ted); |
| 57 | 62 |
| 58 function onSelected() | 63 function onSelected() |
| 59 { | 64 { |
| 60 resetHighlightCount(onHighlightCountReset); | 65 resetHighlightCount(onHighlightCountReset); |
| 61 } | 66 } |
| 62 | 67 |
| 63 function onHighlightCountReset() | 68 function onHighlightCountReset() |
| 64 { | 69 { |
| 65 var section = InspectorTest.firstMatchedStyleSection(); | 70 var section = InspectorTest.firstMatchedStyleSection(); |
| 66 section._highlight(); | 71 section._highlight(); |
| 67 InspectorTest.waitForOverlayRepaint(onHighlighted); | 72 InspectorTest.callFunctionInPageAsync("requestAnimationFrameProm
ise").then(onHighlighted) |
| 68 } | 73 } |
| 69 | 74 |
| 70 function onHighlighted() | 75 function onHighlighted() |
| 71 { | 76 { |
| 72 dumpHighlightCount(next); | 77 dumpHighlightCount(next); |
| 73 } | 78 } |
| 74 }, | 79 }, |
| 75 ]); | 80 ]); |
| 76 | 81 |
| 77 function drawHighlightProxy() | 82 function drawHighlightProxy() |
| (...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 129 } | 134 } |
| 130 </style> | 135 </style> |
| 131 <div class="bck">1st</div> | 136 <div class="bck">1st</div> |
| 132 <div class="bck">2nd</div> | 137 <div class="bck">2nd</div> |
| 133 <div class="bck">3rd</div> | 138 <div class="bck">3rd</div> |
| 134 <div class="bck">4th</div> | 139 <div class="bck">4th</div> |
| 135 <div class="bck" id="fifth">5th</div> | 140 <div class="bck" id="fifth">5th</div> |
| 136 </template> | 141 </template> |
| 137 </body> | 142 </body> |
| 138 </html> | 143 </html> |
| OLD | NEW |