OLD | NEW |
| (Empty) |
1 <!doctype html> | |
2 <!-- | |
3 Copyright (c) 2014 The Polymer Project Authors. All rights reserved. | |
4 This code may only be used under the BSD style license found at http://polymer.g
ithub.io/LICENSE.txt | |
5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt | |
6 The complete set of contributors may be found at http://polymer.github.io/CONTRI
BUTORS.txt | |
7 Code distributed by Google as part of the polymer project is also | |
8 subject to an additional IP rights grant found at http://polymer.github.io/PATEN
TS.txt | |
9 --> | |
10 <html> | |
11 <head> | |
12 <meta charset="UTF-8"> | |
13 <title>core-dropdown-menu basic tests</title> | |
14 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-
scale=1.0"> | |
15 | |
16 <script src="../../webcomponentsjs/webcomponents.js"></script> | |
17 <script src="../../web-component-tester/browser.js"></script> | |
18 | |
19 <link href="../../core-dropdown/core-dropdown.html" rel="import"> | |
20 <link href="../../core-item/core-item.html" rel="import"> | |
21 <link href="../../core-menu/core-menu.html" rel="import"> | |
22 | |
23 <link href="../core-dropdown-menu.html" rel="import"> | |
24 | |
25 <style> | |
26 core-collapse { | |
27 border: 1px solid black; | |
28 } | |
29 </style> | |
30 | |
31 </head> | |
32 <body> | |
33 | |
34 <core-dropdown-menu id="dropdown1" label="Your favorite dessert"> | |
35 <core-dropdown class="dropdown"> | |
36 <core-menu id="menu1"> | |
37 <core-item foo="c">Cupcake</core-item> | |
38 <core-item foo="d">Donut</core-item> | |
39 <core-item foo="e">Eclair</core-item> | |
40 <core-item foo="f">Froyo</core-item> | |
41 <core-item foo="g">Gingerbread</core-item> | |
42 <core-item foo="h">Honeycomb</core-item> | |
43 <core-item foo="i">Ice cream sandwich</core-item> | |
44 <core-item foo="j">Jellybean</core-item> | |
45 <core-item foo="k">Kit Kat</core-item> | |
46 <core-item foo="l">Lollipop</core-item> | |
47 </core-menu> | |
48 </core-dropdown> | |
49 </core-dropdown-menu> | |
50 | |
51 <script> | |
52 | |
53 function flushLayoutAndRender(callback) { | |
54 flush(function() { | |
55 document.body.offsetTop; | |
56 requestAnimationFrame(function() { | |
57 callback(); | |
58 }); | |
59 }); | |
60 } | |
61 | |
62 var d1 = document.getElementById('dropdown1'); | |
63 var m1 = document.getElementById('menu1'); | |
64 | |
65 test('shows the label when nothing selected', function(done) { | |
66 m1.selected = null; | |
67 flushLayoutAndRender(function() { | |
68 assert.strictEqual(d1.$.label.textContent, d1.label); | |
69 done(); | |
70 }); | |
71 }); | |
72 | |
73 test('shows the selected item', function(done) { | |
74 m1.selected = 2; | |
75 flushLayoutAndRender(function() { | |
76 assert.strictEqual(d1.$.label.textContent, m1.selectedItem.textContent); | |
77 done(); | |
78 }); | |
79 }); | |
80 | |
81 test('can clear the selected item', function(done) { | |
82 m1.selected = 2; | |
83 flushLayoutAndRender(function() { | |
84 assert.strictEqual(d1.$.label.textContent, m1.selectedItem.textContent); | |
85 | |
86 m1.selected = null; | |
87 flushLayoutAndRender(function() { | |
88 assert.strictEqual(d1.$.label.textContent, d1.label); | |
89 done(); | |
90 }); | |
91 }); | |
92 }); | |
93 | |
94 test('use the valueattr attribute', function(done) { | |
95 m1.valueattr = "foo"; | |
96 m1.selected = "l"; | |
97 flushLayoutAndRender(function() { | |
98 assert.strictEqual(d1.$.label.textContent, m1.selectedItem.textContent); | |
99 done(); | |
100 }); | |
101 }); | |
102 | |
103 </script> | |
104 | |
105 </body> | |
106 </html> | |
OLD | NEW |