| OLD | NEW |
|---|
| (Empty) | |
| 1 <html> |
| 2 <body> |
| 3 <H1>Page for Shadow DOM chromedriver tests</H1> |
| 4 The page has a shadow root that in turn contains two shadow roots. So we can che
ck behaviour with both nested roots and younger/older sibling roots. |
| 5 <div id="outerDiv"> |
| 6 <div id="innerDiv" style="border-style:solid;border-color:yellow"> |
| 7 stuff |
| 8 </div> |
| 9 </div> |
| 10 |
| 11 <template id="parentTemplate"> |
| 12 <div id="parentDiv"> |
| 13 <div style="border-style:solid;border-color:green"> |
| 14 <H3>Parent</H3> |
| 15 <H4>Parent Contents</H4> |
| 16 <content></content> |
| 17 </div> |
| 18 </div> |
| 19 </template> |
| 20 <template id="olderChildTemplate"> |
| 21 <div id="olderChildDiv"> |
| 22 <div style="border-style:solid;border-color:red"> |
| 23 <H3 id="olderHeading">Older Child</H3> |
| 24 As the older child of a nested shadow root, this is the most likely to g
o |
| 25 wrong bit of the page, so we'll concentrate our tests here. |
| 26 <H4>Older Child Contents Begin</H4> |
| 27 <content></content> |
| 28 <input id="olderTextBox" type="text" value="foo"/> |
| 29 <input type="button" onClick="buttonWasClicked()" value="button" id="old
erButton"/> |
| 30 </div> |
| 31 </div> |
| 32 </template> |
| 33 <template id="youngerChildTemplate"> |
| 34 <div id="youngerChildDiv"> |
| 35 <div style="border-style:solid;border-color:blue"> |
| 36 <H3>Younger Child</H3> |
| 37 <div style="border-style:dotted;border-color:blue"> |
| 38 <H4>Younger Child Contents</H4> |
| 39 <content></content> |
| 40 </div> |
| 41 <div style="border-style:dashed;border-color:blue"> |
| 42 <H4>Younger Child Shadow</H4> |
| 43 <shadow></shadow> |
| 44 </div> |
| 45 </div> |
| 46 </div> |
| 47 </template> |
| 48 <script type="text/javascript">var CLOSURE_NO_DEPS=true</script> |
| 49 <script type="text/javascript" src="../../../third_party/chromevox/third_party/c
losure-library/closure/goog/base.js"></script> |
| 50 <script type="text/javascript"> |
| 51 var parentShadowRoot = document.querySelector('#innerDiv').createShadowRoot(); |
| 52 parentShadowRoot.appendChild(document.querySelector('#parentTemplate').content.c
loneNode(true)); |
| 53 var olderShadowRoot = parentShadowRoot.querySelector("#parentDiv").createShadowR
oot(); |
| 54 olderShadowRoot.appendChild(document.querySelector('#olderChildTemplate').conten
t.cloneNode(true)); |
| 55 var youngerShadowRoot = parentShadowRoot.querySelector("#parentDiv").createShado
wRoot(); |
| 56 youngerShadowRoot.appendChild(document.querySelector('#youngerChildTemplate').co
ntent.cloneNode(true)); |
| 57 function buttonWasClicked() { |
| 58 document.querySelector("* /deep/ #olderTextBox").value="Button Was Clicked"; |
| 59 } |
| 60 </script> |
| 61 </body> |
| 62 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 480483002:
[chromedriver] Add shadow DOM support to chromedriver. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master