Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(406)

Side by Side Diff: LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance.html

Issue 201683003: Remove resetStyleInheritance. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Resolve conflicts Created 6 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 div.resetTest {
6 background-color: #eef;
7 color: #fee;
8 }
9 </style>
10 <script src="../../../resources/js-test.js"></script>
11 <script>
12 function testNoResetStyleInheritance() {
13 debug("Test case: no reset-style-inheritance. color value should be inherite d from the shadow host.");
14 var div = document.getElementById('no-reset-style-inheritance');
15
16 var shadowRoot = div.createShadowRoot();
17 shadowRoot.innerHTML = '<content id="content"></content>';
18
19 shadowRoot.getElementById('content').resetStyleInheritance = false;
20 shouldBe('window.getComputedStyle(document.getElementById("no-reset-style-in heritance").firstChild).color', '"rgb(255, 238, 238)"');
21 shouldBe('window.getComputedStyle(document.getElementById("no-reset-style-in heritance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
22 }
23
24 function testResetStyleInheritance() {
25 debug("Test case: reset-style-inhertiace basic test. color value should be i nitial because insertion point's resetStyleInheritance is true.");
26 var div = document.getElementById('reset-style-inheritance');
27
28 var shadowRoot = div.createShadowRoot();
29 shadowRoot.innerHTML = '<content id="content"></content>';
30
31 shadowRoot.getElementById('content').resetStyleInheritance = true;
32 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).color', '"rgb(0, 0, 0)"');
33 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
34 }
35
36 function testResetStyleInheritanceWithAttribute() {
37 debug("Test case: make a content element reset-style-inhertiace by using its attribute. color value should be initial because insertion point's resetStyleIn heritance is true.");
38 var div = document.getElementById('reset-style-inheritance');
39
40 var shadowRoot = div.createShadowRoot();
41 shadowRoot.innerHTML = '<content id="content" reset-style-inheritance></cont ent>';
42
43 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).color', '"rgb(0, 0, 0)"');
44 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
45 }
46
47 function testShadowResetStyleInheritanceWithAttribute() {
48 debug("Test case: make a shadow element reset-style-inhertiace by using its attribute. color value should be initial because insertion point's resetStyleInh eritance is true.");
49 var div = document.getElementById('reset-style-inheritance');
50
51 var shadowRoot = div.createShadowRoot();
52 shadowRoot.innerHTML = '<shadow id="content" reset-style-inheritance><conten t></content></shadow>';
53
54 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).color', '"rgb(0, 0, 0)"');
55 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
56 }
57
58 function testResetStyleInheritanceDynamic() {
59 debug("Test case: reset-style-inhertiace changes dynamically. Firstly color value should be inherited. Next, initial. At last, inherited.");
60 var div = document.getElementById('reset-style-inheritance-dynamic');
61
62 var shadowRoot = div.createShadowRoot();
63 shadowRoot.innerHTML = '<content id="content"></content>';
64
65 shadowRoot.getElementById('content').resetStyleInheritance = false;
66 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).color', '"rgb(255, 238, 238)"');
67 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
68
69 shadowRoot.getElementById('content').resetStyleInheritance = true;
70 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).color', '"rgb(0, 0, 0)"');
71 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
72
73 shadowRoot.getElementById('content').resetStyleInheritance = false;
74 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).color', '"rgb(255, 238, 238)"');
75 shouldBe('window.getComputedStyle(document.getElementById("reset-style-inher itance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
76 }
77
78 function testResetStyleInheritanceWithoutCrossingUpperBoundary() {
79 debug("Test case: the parent node of the distributed node is in the same sha dow dom subtree as the insertion point. color value should be initial. reset-sty le-inheritance doesn't depend on whether parent style node is in the same treesc ope or not.");
80 var div = document.getElementById('reset-but-not-cross-upper-boundary');
81 var shadowRoot = div.createShadowRoot();
82
83 shadowRoot.innerHTML = '<div style="color:blue; background-color:green;"><co ntent id="content"></content></div>';
84
85 shadowRoot.getElementById('content').resetStyleInheritance = true;
86 shouldBe('window.getComputedStyle(document.getElementById("reset-but-not-cro ss-upper-boundary").firstChild).color', '"rgb(0, 0, 0)"');
87 shouldBe('window.getComputedStyle(document.getElementById("reset-but-not-cro ss-upper-boundary").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
88 }
89
90 function testResetStyleInheritanceWithMultipleShadowRoots() {
91 debug("Test case: reset-style-inheritance with multiple shadow roots. color value should be initial, because reset-style-inheritance of the insertion point in the youngest shadow root is true.");
92 var div = document.getElementById('multiple-shadow-roots');
93 var oldestShadowRoot = div.createShadowRoot();
94 oldestShadowRoot.innerHTML = '<content id="content"></content>';
95
96 var youngerShadowRoot = div.createShadowRoot();
97 youngerShadowRoot.innerHTML = '<shadow id="shadow"><content></content></shad ow>';
98
99 var youngestShadowRoot = div.createShadowRoot();
100 youngestShadowRoot.innerHTML = '<shadow id="shadow"><content></content></sha dow>';
101
102 oldestShadowRoot.getElementById('content').resetStyleInheritance = false;
103 youngerShadowRoot.getElementById('shadow').resetStyleInheritance = false;
104 youngestShadowRoot.getElementById('shadow').resetStyleInheritance = true;
105 shouldBe('window.getComputedStyle(document.getElementById("multiple-shadow-r oots").firstChild).color', '"rgb(0, 0, 0)"');
106 shouldBe('window.getComputedStyle(document.getElementById("multiple-shadow-r oots").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
107 }
108
109 function testResetStyleInheritanceWithMultipleInsertionPoints() {
110 debug("Test case: multiple insertion points in the same shadow dom subtree.. Each reset-style-inheritance should be checked.");
111 var div = document.getElementById('multiple-insertion-points');
112 var oldestShadowRoot = div.createShadowRoot();
113 oldestShadowRoot.innerHTML = '<content id="content"></content>';
114
115 var youngestShadowRoot = div.createShadowRoot();
116 youngestShadowRoot.innerHTML = '<content select=":first-child" id="content"> </content><shadow id="shadow"><content></content></shadow>';
117
118 youngestShadowRoot.getElementById('content').resetStyleInheritance = false;
119 youngestShadowRoot.getElementById('shadow').resetStyleInheritance = true;
120
121 shouldBe('window.getComputedStyle(document.getElementById("multiple-insertio n-points").firstChild).color', '"rgb(255, 238, 238)"');
122 shouldBe('window.getComputedStyle(document.getElementById("multiple-insertio n-points").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
123 shouldBe('window.getComputedStyle(document.getElementById("multiple-insertio n-points").lastChild).color', '"rgb(0, 0, 0)"');
124 shouldBe('window.getComputedStyle(document.getElementById("multiple-insertio n-points").lastChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
125 }
126
127 function runTests() {
128 testNoResetStyleInheritance();
129 testResetStyleInheritance();
130 testResetStyleInheritanceWithAttribute();
131 testShadowResetStyleInheritanceWithAttribute();
132 testResetStyleInheritanceDynamic();
133 testResetStyleInheritanceWithoutCrossingUpperBoundary()
134 testResetStyleInheritanceWithMultipleShadowRoots();
135 testResetStyleInheritanceWithMultipleInsertionPoints();
136 document.getElementById('test-cases').innerHTML = 'DONE';
137 }
138 </script>
139 </head>
140 <body onload="runTests()">
141 <div id="test-cases">
142 <div id="no-reset-style-inheritance" class="resetTest"><span>first-child</span ></div>
143 <div id="reset-style-inheritance" class="resetTest"><span>first-child</span></ div>
144 <div id="reset-style-inheritance-dynamic" class="resetTest"><span>first-child< /span></div>
145 <div id="reset-but-not-cross-upper-boundary" class="resetTest"><span>first-chi ld</span></div>
146 <div id="multiple-shadow-roots" class="resetTest"><span>first-child</span></di v>
147 <div id="multiple-insertion-points" class="resetTest"><span>first-child</span> <span>last-child</span></div>
148 </div>
149 </body>
150 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698