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

Side by Side Diff: LayoutTests/fast/dom/shadow/content-combinator-with-shadow-deep.html

Issue 187353003: Implement /content/ combinator. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Patch for landing 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
1 <!doctype html> 1 <!doctype html>
2 <html> 2 <html>
3 <head> 3 <head>
4 <script src="resources/shadow-dom.js"></script> 4 <script src="resources/shadow-dom.js"></script>
5 <script src="../../../resources/js-test.js"></script> 5 <script src="../../../resources/js-test.js"></script>
6 </head> 6 </head>
7 <body class="bodyClass"> 7 <body class="bodyClass">
8 <div id="sandbox"></div> 8 <div id="sandbox"></div>
9 <pre id="console"></pre> 9 <pre id="console"></pre>
10 </body> 10 </body>
11 <script> 11 <script>
12 description("Test for ::content with /shadow-deep/ and :host."); 12 description("Test for /content/ with /shadow-deep/ and :host.");
13 13
14 var sandbox = document.getElementById('sandbox'); 14 var sandbox = document.getElementById('sandbox');
15 15
16 function colorOf(selector)
17 {
18 return document.defaultView.getComputedStyle(document.querySelector(selector ), null).getPropertyValue('color');
19 }
20
16 function cleanUp() 21 function cleanUp()
17 { 22 {
18 sandbox.innerHTML = ''; 23 sandbox.innerHTML = '';
19 } 24 }
20 25
21 sandbox.appendChild( 26 sandbox.appendChild(
22 createDOM('div', {'id': 'host1'}, 27 createDOM('div', {'id': 'host1'},
23 createShadowRoot( 28 createShadowRoot(
24 createDOM('style', {}, 29 createDOM('style', {},
25 document.createTextNode( 30 document.createTextNode(
26 ':host(#host1) /shadow-deep/ #content1::content > .content { color: green; }')), 31 ':host(#host1) /shadow-deep/ #content1 /content/ .content { color: green; }')),
27 createDOM('div', {}, 32 createDOM('div', {},
28 createDOM('div', {'id': 'host2'}, 33 createDOM('div', {'id': 'host2'},
29 createShadowRoot( 34 createShadowRoot(
30 createDOM('content', {'id': 'content2'})), 35 createDOM('content', {'id': 'content2'})),
31 createDOM('div', {'id': 'parentOfContent1'}, 36 createDOM('div', {'id': 'parentOfContent1'},
32 createDOM('content', {'id': 'content1'}))))), 37 createDOM('content', {'id': 'content1'}))))),
33 createDOM('div', {'class': 'content'}, 38 createDOM('div', {'class': 'content'},
34 document.createTextNode('content')))); 39 document.createTextNode('content'))));
35 40
36 shouldBe('window.getComputedStyle(document.querySelector("#host1 > .content")).c olor', '"rgb(0, 128, 0)"'); 41 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"');
37 42
38 cleanUp(); 43 cleanUp();
39 44
40 sandbox.appendChild( 45 sandbox.appendChild(
41 createDOM('div', {'id': 'host1'}, 46 createDOM('div', {'id': 'host1'},
42 createShadowRoot( 47 createShadowRoot(
43 createDOM('style', {}, 48 createDOM('style', {},
44 document.createTextNode( 49 document.createTextNode(
45 '#host2 /shadow-deep/ #content2::content > #parentOfContent1 > #content1::content > .content { color: green; }')), 50 '#host2 /shadow-deep/ #content2 /content/ #parentOfContent1 > #content1 /content/ .content { color: green; }')),
46 createDOM('div', {}, 51 createDOM('div', {},
47 createDOM('div', {'id': 'host2'}, 52 createDOM('div', {'id': 'host2'},
48 createShadowRoot( 53 createShadowRoot(
49 createDOM('content', {'id': 'content2'})), 54 createDOM('content', {'id': 'content2'})),
50 createDOM('div', {'id': 'parentOfContent1'}, 55 createDOM('div', {'id': 'parentOfContent1'},
51 createDOM('content', {'id': 'content1'}))))), 56 createDOM('content', {'id': 'content1'}))))),
52 createDOM('div', {'class': 'content'}, 57 createDOM('div', {'class': 'content'},
53 document.createTextNode('content')))); 58 document.createTextNode('content'))));
54 59
55 shouldBe('window.getComputedStyle(document.querySelector("#host1 > .content")).c olor', '"rgb(0, 128, 0)"'); 60 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"');
56 61
57 cleanUp(); 62 cleanUp();
58 63
59 sandbox.appendChild( 64 sandbox.appendChild(
60 createDOM('div', {'id': 'host1'}, 65 createDOM('div', {'id': 'host1'},
61 createShadowRoot( 66 createShadowRoot(
62 createDOM('style', {}, 67 createDOM('style', {},
63 document.createTextNode( 68 document.createTextNode(
64 ':host /shadow-deep/ #content2::content > #parentOfShadow1 > #shadow1::content > .content { color: green; }' + 69 ':host /shadow-deep/ #content2 /content/ #parentOfShadow1 > #shadow1 /content/ .content { color: green; }' +
65 ':host /shadow-deep/ #content2::content > #shadow1::content > #content1::content > .content { color: red; }')), 70 ':host /shadow-deep/ #content2 /content/ #shadow1 /content/ #content1 /content/ .content { color: red; }')),
66 createDOM('content', {'id': 'content1'})), 71 createDOM('content', {'id': 'content1'})),
67 createShadowRoot( 72 createShadowRoot(
68 createDOM('div', {}, 73 createDOM('div', {},
69 createDOM('div', {'id': 'host2'}, 74 createDOM('div', {'id': 'host2'},
70 createShadowRoot( 75 createShadowRoot(
71 createDOM('content', {'id': 'content2'})), 76 createDOM('content', {'id': 'content2'})),
72 createDOM('div', {'id': 'parentOfShadow1'}, 77 createDOM('div', {'id': 'parentOfShadow1'},
73 createDOM('shadow', {'id': 'shadow1'}, 78 createDOM('shadow', {'id': 'shadow1'},
74 createDOM('content', {})))))), 79 createDOM('content', {})))))),
75 createDOM('div', {'class': 'content'}, 80 createDOM('div', {'class': 'content'},
76 document.createTextNode('content')))); 81 document.createTextNode('content'))));
77 82
78 shouldBe('window.getComputedStyle(document.querySelector("#host1 > .content")).c olor', '"rgb(0, 128, 0)"'); 83 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"');
79 84
80 cleanUp(); 85 cleanUp();
81 86
82 sandbox.appendChild( 87 sandbox.appendChild(
83 createDOM('div', {'id': 'host1'}, 88 createDOM('div', {'id': 'host1'},
84 createShadowRoot( 89 createShadowRoot(
85 createDOM('style', {}, 90 createDOM('style', {},
86 document.createTextNode( 91 document.createTextNode(
87 ':host /shadow-deep/ :host > #content2::content > #shadow1:: content > #content1::content > .content { color: red; }')), 92 ':host /shadow-deep/ :host > #content2 /content/ #shadow1 /c ontent/ #content1 /content/ .content { color: red; }')),
88 createDOM('content', {'id': 'content1'})), 93 createDOM('content', {'id': 'content1'})),
89 createShadowRoot( 94 createShadowRoot(
90 createDOM('div', {}, 95 createDOM('div', {},
91 createDOM('div', {'id': 'host2'}, 96 createDOM('div', {'id': 'host2'},
92 createShadowRoot( 97 createShadowRoot(
93 createDOM('content', {'id': 'content2'})), 98 createDOM('content', {'id': 'content2'})),
94 createDOM('div', {'id': 'parentOfShadow1'}, 99 createDOM('div', {'id': 'parentOfShadow1'},
95 createDOM('shadow', {'id': 'shadow1'}, 100 createDOM('shadow', {'id': 'shadow1'},
96 createDOM('content', {})))))), 101 createDOM('content', {})))))),
97 createDOM('div', {'class': 'content'}, 102 createDOM('div', {'class': 'content'},
98 document.createTextNode('content')))); 103 document.createTextNode('content'))));
99 104
100 shouldNotBe('window.getComputedStyle(document.querySelector("#host1 > .content") ).color', '"rgb(255, 0, 0)"'); 105 shouldNotBe('colorOf("#host1 > .content")', '"rgb(255, 0, 0)"');
101 106
102 cleanUp(); 107 cleanUp();
103 108
104 sandbox.appendChild( 109 sandbox.appendChild(
105 createDOM('div', {'id': 'host1'}, 110 createDOM('div', {'id': 'host1'},
106 createShadowRoot( 111 createShadowRoot(
107 createDOM('style', {}, 112 createDOM('style', {},
108 document.createTextNode( 113 document.createTextNode(
109 ':host /shadow-deep/ #content2::content > #parentOfContent1 > #content1::content > .content { color: green; }')), 114 ':host /shadow-deep/ #content2 /content/ #parentOfContent1 > #content1 /content/ .content { color: green; }')),
110 createDOM('div', {}, 115 createDOM('div', {},
111 createDOM('div', {'id': 'host2'}, 116 createDOM('div', {'id': 'host2'},
112 createShadowRoot( 117 createShadowRoot(
113 createDOM('content', {'id': 'content2'})), 118 createDOM('content', {'id': 'content2'})),
114 createDOM('div', {'id': 'parentOfContent1'}, 119 createDOM('div', {'id': 'parentOfContent1'},
115 createDOM('content', {'id': 'content1'}))))), 120 createDOM('content', {'id': 'content1'}))))),
116 createDOM('div', {'class': 'content'}, 121 createDOM('div', {'class': 'content'},
117 document.createTextNode('content')))); 122 document.createTextNode('content'))));
118 123
119 shouldBe('window.getComputedStyle(document.querySelector("#host1 > .content")).c olor', '"rgb(0, 128, 0)"'); 124 shouldBe('colorOf("#host1 > .content")', '"rgb(0, 128, 0)"');
120 125
121 cleanUp(); 126 cleanUp();
122 127
123 </script> 128 </script>
124 </html> 129 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698