OLD | NEW |
1 // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file | 1 // Copyright (c) 2011, the Dart project authors. Please see the AUTHORS file |
2 // for details. All rights reserved. Use of this source code is governed by a | 2 // for details. All rights reserved. Use of this source code is governed by a |
3 // BSD-style license that can be found in the LICENSE file. | 3 // BSD-style license that can be found in the LICENSE file. |
4 | 4 |
5 library ShadowDOMTest; | 5 library ShadowDOMTest; |
6 | 6 |
7 import 'dart:html'; | 7 import 'dart:html'; |
8 | 8 |
9 // Test that children of a shadow host get distributed properly to the | 9 // Test that children of a shadow host get distributed properly to the |
10 // insertion points of a shadow subtree. Output should be three boxes, | 10 // insertion points of a shadow subtree. Output should be three boxes, |
11 // ordered blue, red, green down the page. | 11 // ordered blue, red, green down the page. |
12 main() { | 12 main() { |
13 var div = new DivElement(); | 13 var div = new DivElement(); |
14 document.body.children.add(div); | 14 document.body.children.add(div); |
15 | 15 |
16 // build some DOM elements | 16 // build some DOM elements |
17 var bluebox = _colorBox('blue', 40, 20); | 17 var bluebox = _colorBox('blue', 40, 20); |
18 bluebox.classes.add('foo'); | 18 bluebox.classes.add('foo'); |
19 var redbox = _colorBox('red', 30, 30); | 19 var redbox = _colorBox('red', 30, 30); |
20 var greenbox = _colorBox('green', 60, 10); | 20 var greenbox = _colorBox('green', 60, 10); |
21 | 21 |
22 // assemble DOM | 22 // assemble DOM |
23 var sRoot = div.createShadowRoot(); | 23 var sRoot = div.createShadowRoot(); |
24 sRoot.nodes.add(new Element.html('<content select=".foo"></content>')); | 24 sRoot.append(new Element.html('<content select=".foo"></content>')); |
25 sRoot.nodes.add(redbox); | 25 sRoot.append(redbox); |
26 sRoot.nodes.add(new Element.tag('content')); | 26 sRoot.append(new Element.tag('content')); |
27 | 27 |
28 div.nodes.add(bluebox); | 28 div.append(bluebox); |
29 div.nodes.add(greenbox); | 29 div.append(greenbox); |
30 } | 30 } |
31 | 31 |
32 DivElement _colorBox(String color, int width, int height) { | 32 DivElement _colorBox(String color, int width, int height) { |
33 var style = ('background-color:$color; ' | 33 var style = ('background-color:$color; ' |
34 'width:${width}px; height:${height}px;'); | 34 'width:${width}px; height:${height}px;'); |
35 return new Element.html('<div style="$style"></div>'); | 35 return new Element.html('<div style="$style"></div>'); |
36 } | 36 } |
OLD | NEW |