OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <!-- | 2 <!-- |
3 Distributed under both the W3C Test Suite License [1] and the W3C | 3 Distributed under both the W3C Test Suite License [1] and the W3C |
4 3-clause BSD License [2]. To contribute to a W3C Test Suite, see the | 4 3-clause BSD License [2]. To contribute to a W3C Test Suite, see the |
5 policies and contribution forms [3]. | 5 policies and contribution forms [3]. |
6 | 6 |
7 [1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license | 7 [1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license |
8 [2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license | 8 [2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license |
9 [3] http://www.w3.org/2004/10/27-testcases | 9 [3] http://www.w3.org/2004/10/27-testcases |
10 --> | 10 --> |
11 <html> | 11 <html> |
12 <head> | 12 <head> |
13 <meta charset="utf-8"> | 13 <meta charset="utf-8"> |
14 <title>Shadow DOM Test - Tests a reprojection.</title> | 14 <title>Shadow DOM Test - Tests a reprojection.</title> |
15 <link rel="match" href="reprojection-001-ref.html"> | 15 <link rel="match" href="reprojection-001-ref.html"> |
16 <link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> | 16 <link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> |
17 <link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> | 17 <link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> |
18 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#reproje
ction"> | 18 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#reproje
ction"> |
19 <meta name="assert" content="a node is distributed into more than one insertion
point."> | 19 <meta name="assert" content="a node is distributed into more than one insertion
point."> |
20 <script src="../../../../html/resources/common.js"></script> | 20 <script src="../../../../html/resources/common.js"></script> |
21 <style> | 21 <style> |
22 .pass { color: green; } | 22 .pass { color: green; } |
23 </style> | 23 </style> |
24 </head> | 24 </head> |
25 <body> | 25 <body> |
26 <p>You should see green text saying "Apple" and "Orange" below.</p> | 26 <p>You should see green text saying "Apple" and "Orange" below.</p> |
27 <div id="host"> | 27 <div id="host"> |
28 <div class="pass">Apple.</div> | 28 <div class="pass">Apple.</div> |
29 <div class="pass">Orange.</div> | 29 <div class="pass">Orange.</div> |
30 </div> | 30 </div> |
31 <script> | 31 <script> |
32 var shadowRoot = host.attachShadow({mode: 'open'}); | 32 var shadowRoot = host.attachShadow({mode: 'open'}); |
33 shadowRoot.innerHTML = '<div id="host2">Hello a Shadow Root.<slot></slot><div>
Banana.</div></div>'; | 33 shadowRoot.innerHTML = '<div id="host2">Hello a Shadow Root.<slot></slot><div>
Banana.</div></div>'; |
34 var host2 = shadowRoot.getElementById("host2"); | 34 var host2 = shadowRoot.getElementById("host2"); |
35 var shadowRoot2 = host2.attachShadow({mode: 'open'}); | 35 var shadowRoot2 = host2.attachShadow({mode: 'open'}); |
36 shadowRoot2.innerHTML = '<div>Hello a Shadow Root2.</div><div><slot></slot></d
iv>'; | 36 shadowRoot2.innerHTML = '<div>Hello a Shadow Root2.</div><div><slot></slot></d
iv>'; |
37 </script> | 37 </script> |
38 </body> | 38 </body> |
39 </html> | 39 </html> |
OLD | NEW |