OLD | NEW |
1 <!doctype html> | 1 <!doctype html> |
2 <script src="../../../resources/js-test.js"></script> | 2 <script src="../../../resources/js-test.js"></script> |
3 <script src="resources/shadow-dom.js"></script> | 3 <script src="resources/shadow-dom.js"></script> |
4 <style id="style1"> | 4 <style id="style1"> |
5 </style> | 5 </style> |
6 <body></body> | 6 <body></body> |
7 <script> | 7 <script> |
8 function prepareShadowTree(hostId, mode1, mode2, div1, div2, div3) { | 8 function prepareShadowTree(hostId, mode1, mode2, div1, div2, div3) { |
9 var parent = document.body; | 9 var parent = document.body; |
10 parent.appendChild( | 10 parent.appendChild( |
(...skipping 59 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
70 backgroundColorShouldBe('host_closed_open/div5', 'rgba(0, 0, 0, 0)'); | 70 backgroundColorShouldBe('host_closed_open/div5', 'rgba(0, 0, 0, 0)'); |
71 backgroundColorShouldBe('host_closed_open/div5/div6', 'rgba(0, 0, 0, 0)'); | 71 backgroundColorShouldBe('host_closed_open/div5/div6', 'rgba(0, 0, 0, 0)'); |
72 backgroundColorShouldBe('host_closed_open/div5b', 'rgba(0, 0, 0, 0)'); | 72 backgroundColorShouldBe('host_closed_open/div5b', 'rgba(0, 0, 0, 0)'); |
73 backgroundColorShouldBe('host_closed_closed', 'rgba(0, 0, 0, 0)'); | 73 backgroundColorShouldBe('host_closed_closed', 'rgba(0, 0, 0, 0)'); |
74 backgroundColorShouldBe('host_closed_closed/div7', 'rgba(0, 0, 0, 0)'); | 74 backgroundColorShouldBe('host_closed_closed/div7', 'rgba(0, 0, 0, 0)'); |
75 backgroundColorShouldBe('host_closed_closed/div7/div8', 'rgba(0, 0, 0, 0)'); | 75 backgroundColorShouldBe('host_closed_closed/div7/div8', 'rgba(0, 0, 0, 0)'); |
76 backgroundColorShouldBe('host_closed_closed/div7b', 'rgba(0, 0, 0, 0)'); | 76 backgroundColorShouldBe('host_closed_closed/div7b', 'rgba(0, 0, 0, 0)'); |
77 | 77 |
78 debug('(3/6) /deep/ style on shadow tree.'); | 78 debug('(3/6) /deep/ style on shadow tree.'); |
79 styleElement.innerHTML = ''; | 79 styleElement.innerHTML = ''; |
80 var div1 = getNodeInTreeOfTrees('host_open_open/div1'); | 80 var div1 = getNodeInComposedTree('host_open_open/div1'); |
81 div1.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); | 81 div1.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); |
82 backgroundColorShouldBe('host_open_open/div1', 'rgba(0, 0, 0, 0)'); | 82 backgroundColorShouldBe('host_open_open/div1', 'rgba(0, 0, 0, 0)'); |
83 backgroundColorShouldBe('host_open_open/div1/div2', 'rgba(0, 0, 0, 0)'); | 83 backgroundColorShouldBe('host_open_open/div1/div2', 'rgba(0, 0, 0, 0)'); |
84 backgroundColorShouldBe('host_open_open/div1b', 'rgb(0, 0, 255)'); | 84 backgroundColorShouldBe('host_open_open/div1b', 'rgb(0, 0, 255)'); |
85 div1.removeChild(div1.firstElementChild); | 85 div1.removeChild(div1.firstElementChild); |
86 | 86 |
87 var div3 = getNodeInTreeOfTrees('host_open_closed/div3'); | 87 var div3 = getNodeInComposedTree('host_open_closed/div3'); |
88 div3.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); | 88 div3.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); |
89 backgroundColorShouldBe('host_open_closed/div3', 'rgba(0, 0, 0, 0)'); | 89 backgroundColorShouldBe('host_open_closed/div3', 'rgba(0, 0, 0, 0)'); |
90 backgroundColorShouldBe('host_open_closed/div3/div4', 'rgba(0, 0, 0, 0)'); | 90 backgroundColorShouldBe('host_open_closed/div3/div4', 'rgba(0, 0, 0, 0)'); |
91 backgroundColorShouldBe('host_open_closed/div3b', 'rgb(0, 0, 255)'); | 91 backgroundColorShouldBe('host_open_closed/div3b', 'rgb(0, 0, 255)'); |
92 div3.removeChild(div3.firstElementChild); | 92 div3.removeChild(div3.firstElementChild); |
93 | 93 |
94 var div5 = getNodeInTreeOfTrees('host_closed_open/div5'); | 94 var div5 = getNodeInComposedTree('host_closed_open/div5'); |
95 div5.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); | 95 div5.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); |
96 backgroundColorShouldBe('host_closed_open/div5', 'rgba(0, 0, 0, 0)'); | 96 backgroundColorShouldBe('host_closed_open/div5', 'rgba(0, 0, 0, 0)'); |
97 backgroundColorShouldBe('host_closed_open/div5/div6', 'rgba(0, 0, 0, 0)'); | 97 backgroundColorShouldBe('host_closed_open/div5/div6', 'rgba(0, 0, 0, 0)'); |
98 backgroundColorShouldBe('host_closed_open/div5b', 'rgb(0, 0, 255)'); | 98 backgroundColorShouldBe('host_closed_open/div5b', 'rgb(0, 0, 255)'); |
99 div5.removeChild(div5.firstElementChild); | 99 div5.removeChild(div5.firstElementChild); |
100 | 100 |
101 var div7 = getNodeInTreeOfTrees('host_closed_closed/div7'); | 101 var div7 = getNodeInComposedTree('host_closed_closed/div7'); |
102 div7.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); | 102 div7.insertAdjacentHTML('afterbegin', '<style>div /deep/ div { background-color:
blue; }</style>'); |
103 backgroundColorShouldBe('host_closed_closed/div7', 'rgba(0, 0, 0, 0)'); | 103 backgroundColorShouldBe('host_closed_closed/div7', 'rgba(0, 0, 0, 0)'); |
104 backgroundColorShouldBe('host_closed_closed/div7/div8', 'rgba(0, 0, 0, 0)'); | 104 backgroundColorShouldBe('host_closed_closed/div7/div8', 'rgba(0, 0, 0, 0)'); |
105 backgroundColorShouldBe('host_closed_closed/div7b', 'rgb(0, 0, 255)'); | 105 backgroundColorShouldBe('host_closed_closed/div7b', 'rgb(0, 0, 255)'); |
106 div7.removeChild(div7.firstElementChild); | 106 div7.removeChild(div7.firstElementChild); |
107 | 107 |
108 debug('(4/6) ::shadow style on shadow tree.'); | 108 debug('(4/6) ::shadow style on shadow tree.'); |
109 div1.insertAdjacentHTML('afterbegin', '<style>div::shadow div { background-color
: green; }</style>'); | 109 div1.insertAdjacentHTML('afterbegin', '<style>div::shadow div { background-color
: green; }</style>'); |
110 backgroundColorShouldBe('host_open_open/div1', 'rgba(0, 0, 0, 0)'); | 110 backgroundColorShouldBe('host_open_open/div1', 'rgba(0, 0, 0, 0)'); |
111 backgroundColorShouldBe('host_open_open/div1/div2', 'rgba(0, 0, 0, 0)'); | 111 backgroundColorShouldBe('host_open_open/div1/div2', 'rgba(0, 0, 0, 0)'); |
(...skipping 33 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
145 shouldBe('host_open_open.querySelectorAll("div::shadow div").length', '0'); | 145 shouldBe('host_open_open.querySelectorAll("div::shadow div").length', '0'); |
146 shouldBe('host_open_closed.querySelectorAll("div::shadow div").length', '0'); | 146 shouldBe('host_open_closed.querySelectorAll("div::shadow div").length', '0'); |
147 shouldBe('host_closed_open.querySelectorAll("div::shadow div").length', '0'); | 147 shouldBe('host_closed_open.querySelectorAll("div::shadow div").length', '0'); |
148 shouldBe('host_closed_closed.querySelectorAll("div::shadow div").length', '0'); | 148 shouldBe('host_closed_closed.querySelectorAll("div::shadow div").length', '0'); |
149 | 149 |
150 shouldBe('div1.querySelectorAll("div::shadow div").length', '0'); | 150 shouldBe('div1.querySelectorAll("div::shadow div").length', '0'); |
151 shouldBe('div3.querySelectorAll("div::shadow div").length', '0'); | 151 shouldBe('div3.querySelectorAll("div::shadow div").length', '0'); |
152 shouldBe('div5.querySelectorAll("div::shadow div").length', '0'); | 152 shouldBe('div5.querySelectorAll("div::shadow div").length', '0'); |
153 shouldBe('div7.querySelectorAll("div::shadow div").length', '0'); | 153 shouldBe('div7.querySelectorAll("div::shadow div").length', '0'); |
154 </script> | 154 </script> |
OLD | NEW |