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

Side by Side Diff: third_party/WebKit/LayoutTests/imported/csswg-test/css-scoping-1/css-scoping-shadow-slotted-rule.html

Issue 1922043004: Import csswg-test@b2daa426addd5ccb8e9ce1c5d800f9d82603f1ec (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: Update W3CImportExpectations and make me owner for css-scoping-1 Created 4 years, 7 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
OLDNEW
(Empty)
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <title>CSS Scoping Module Level 1 - :slotted pseudo element must allow selec ting elements assigned to a slot element</title>
5 <link rel="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org"/>
6 <link rel="help" href="http://www.w3.org/TR/css-scoping-1/#slotted-pseudo">
7 <link rel="match" href="reference/green-box.html"/>
8 </head>
9 <body>
10 <style>
11 my-host {
12 display: block;
13 width: 100px;
14 height: 100px;
15 color: red;
16 background: green;
17 }
18 my-host > div, nested-host {
19 display: block;
20 width: 100px;
21 height: 25px;
22 }
23 </style>
24 <p>Test passes if you see a single 100px by 100px green box below.</p>
25 <my-host>
26 <div class="green">FAIL1</div>
27 <myelem><span>FAIL2</span></myelem>
28 <nested-host>
29 <span>FAIL3</span>
30 </nested-host>
31 <another-host>
32 <b>FAIL4</b>
33 </another-host>
34 </my-host>
35 <script>
36
37 try {
38 var shadowHost = document.querySelector('my-host');
39 shadowRoot = shadowHost.attachShadow({mode: 'open'});
40 shadowRoot.innerHTML = '<slot></slot><style> ::slotted(.green), ::sl otted(myelem) { color:green; } </style>';
41
42 shadowHost = document.querySelector('nested-host');
43 shadowRoot = shadowHost.attachShadow({mode: 'open'});
44 shadowRoot.innerHTML = '<style> .mydiv ::slotted(*) { color:green; } </style><div class=mydiv><slot></slot></div>';
45
46 shadowHost = document.querySelector('another-host');
47 shadowRoot = shadowHost.attachShadow({mode: 'open'});
48 shadowRoot.innerHTML = '<style> ::slotted(*) { color:green; } </styl e><slot></slot>';
49 } catch (exception) {
50 document.body.appendChild(document.createTextNode(exception));
51 }
52
53 </script>
54 </body>
55 </html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698