SGH / COMPONENTS

Blame view

bower_components/paper-radio-group/test/basic.html 8.64 KB
Edit Raw Normal View History
73bcce88   luigser   COMPONENTS 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
  <!doctype html>
  <!--
  @license
  Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
  This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
  The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
  The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
  Code distributed by Google as part of the polymer project is also
  subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  -->
  <html>
    <head>
      <meta charset="UTF-8">
      <title>paper-radio-group basic tests</title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  
      <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
      <script src="../../web-component-tester/browser.js"></script>
73bcce88   luigser   COMPONENTS 
19
 
      <script src="../../iron-test-helpers/mock-interactions.js"></script>
73bcce88   luigser   COMPONENTS 
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
 
      <link rel="import" href="../paper-radio-group.html">
  
    </head>
    <body>
  
      <test-fixture id="NoSelection">
        <template>
          <paper-radio-group>
            <paper-radio-button name="r1">r1</paper-radio-button>
            <paper-radio-button name="r2">r2</paper-radio-button>
            <paper-radio-button name="r3">r3</paper-radio-button>
          </paper-radio-group>
        </template>
      </test-fixture>
  
      <test-fixture id="WithSelection">
        <template>
          <paper-radio-group selected="r1">
            <paper-radio-button name="r1">r1</paper-radio-button>
            <paper-radio-button name="r2">r2</paper-radio-button>
            <paper-radio-button name="r3">r3</paper-radio-button>
          </paper-radio-group>
        </template>
      </test-fixture>
  
      <test-fixture id="WithDisabled">
        <template>
          <paper-radio-group selected="r1">
            <paper-radio-button name="r1">r1</paper-radio-button>
            <paper-radio-button name="r2" disabled>r2</paper-radio-button>
            <paper-radio-button name="r3">r3</paper-radio-button>
          </paper-radio-group>
        </template>
      </test-fixture>
  
      <script>
        suite('defaults', function() {
          var LEFT_ARROW = 37;
          var RIGHT_ARROW = 39;
a1a3bc73   Luigi Serra   graphs updates 
60
 
          test('group can have no selection', function (done) {
73bcce88   luigser   COMPONENTS 
61
 
            var g = fixture('NoSelection');
73bcce88   luigser   COMPONENTS 
62
a1a3bc73   Luigi Serra   graphs updates 
63
64
65
66
67
68
69
70
71
72
73
74
75
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              expect(g.selected).to.not.be.ok;
              var items = g.items;
              expect(items.length).to.be.equal(3);
  
              expect(items[0].checked).to.be.equal(false);
              expect(items[1].checked).to.be.equal(false);
              expect(items[2].checked).to.be.equal(false);
  
              done();
            }, 1);
73bcce88   luigser   COMPONENTS 
76
77
 
          });
a1a3bc73   Luigi Serra   graphs updates 
78
 
          test('group can have a selection', function (done) {
73bcce88   luigser   COMPONENTS 
79
 
            var g = fixture('WithSelection');
73bcce88   luigser   COMPONENTS 
80
a1a3bc73   Luigi Serra   graphs updates 
81
82
83
84
85
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              expect(g.selected).to.be.ok;
              var items = g.items;
              expect(items.length).to.be.equal(3);
73bcce88   luigser   COMPONENTS 
86
a1a3bc73   Luigi Serra   graphs updates 
87
88
 
              expect(items[0].checked).to.be.equal(true);
              expect(items[1].checked).to.be.equal(false);
73bcce88   luigser   COMPONENTS 
89
 
              expect(items[2].checked).to.be.equal(false);
a1a3bc73   Luigi Serra   graphs updates 
90
91
 
              expect(items[0].getAttribute('name')).to.be.equal(g.selected);
73bcce88   luigser   COMPONENTS 
92
 
              done();
a1a3bc73   Luigi Serra   graphs updates 
93
94
95
96
97
98
99
100
101
102
 
            }, 1);
          });
  
          test('right arrow advances the selection', function (done) {
            var g = fixture('WithSelection');
  
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
              expect(items[0].checked).to.be.equal(true);
73bcce88   luigser   COMPONENTS 
103
a1a3bc73   Luigi Serra   graphs updates 
104
105
106
107
108
109
110
111
 
              g.addEventListener('paper-radio-group-changed', function () {
                expect(items[0].checked).to.be.equal(false);
                expect(items[1].checked).to.be.equal(true);
                expect(items[2].checked).to.be.equal(false);
                done();
              });
              MockInteractions.keyDownOn(g, RIGHT_ARROW);
            }, 1);
73bcce88   luigser   COMPONENTS 
112
113
114
115
 
          });
  
          test('left arrow reverses the selection', function (done) {
            var g = fixture('WithSelection');
73bcce88   luigser   COMPONENTS 
116
a1a3bc73   Luigi Serra   graphs updates 
117
118
119
120
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
              expect(items[0].checked).to.be.equal(true);
73bcce88   luigser   COMPONENTS 
121
a1a3bc73   Luigi Serra   graphs updates 
122
123
124
125
126
127
128
129
 
              g.addEventListener('paper-radio-group-changed', function () {
                expect(items[0].checked).to.be.equal(false);
                expect(items[1].checked).to.be.equal(false);
                expect(items[2].checked).to.be.equal(true);
                done();
              });
              MockInteractions.keyDownOn(g, LEFT_ARROW);
            }, 1);
73bcce88   luigser   COMPONENTS 
130
131
132
133
 
          });
  
          test('selection should skip disabled items', function (done) {
            var g = fixture('WithDisabled');
73bcce88   luigser   COMPONENTS 
134
a1a3bc73   Luigi Serra   graphs updates 
135
136
137
138
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
              expect(items[0].checked).to.be.equal(true);
73bcce88   luigser   COMPONENTS 
139
a1a3bc73   Luigi Serra   graphs updates 
140
141
142
143
144
145
146
147
 
              g.addEventListener('paper-radio-group-changed', function () {
                expect(items[0].checked).to.be.equal(false);
                expect(items[1].checked).to.be.equal(false);
                expect(items[2].checked).to.be.equal(true);
                done();
              });
              MockInteractions.keyDownOn(g, RIGHT_ARROW);
            }, 1);
73bcce88   luigser   COMPONENTS 
148
149
150
151
 
          });
  
          test('clicking should change the selection', function (done) {
            var g = fixture('WithSelection');
73bcce88   luigser   COMPONENTS 
152
a1a3bc73   Luigi Serra   graphs updates 
153
154
155
156
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
              expect(items[0].checked).to.be.equal(true);
73bcce88   luigser   COMPONENTS 
157
a1a3bc73   Luigi Serra   graphs updates 
158
159
160
161
162
163
164
165
 
              g.addEventListener('paper-radio-group-changed', function () {
                expect(items[0].checked).to.be.equal(false);
                expect(items[1].checked).to.be.equal(true);
                expect(items[2].checked).to.be.equal(false);
                done();
              });
              MockInteractions.tap(items[1]);
            }, 1);
73bcce88   luigser   COMPONENTS 
166
167
168
169
 
          });
  
          test('clicking the selected item should not deselect', function (done) {
            var g = fixture('WithSelection');
73bcce88   luigser   COMPONENTS 
170
a1a3bc73   Luigi Serra   graphs updates 
171
172
173
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
eb240478   Luigi Serra   public room cards... 
174
 
              expect(items[0].checked).to.be.equal(true);
a1a3bc73   Luigi Serra   graphs updates 
175
176
177
178
179
180
181
182
183
184
 
  
              // The selection should not change, but wait for a little bit just
              // in case it would and an event would be fired.
              setTimeout(function() {
                expect(items[0].checked).to.be.equal(true);
                expect(items[1].checked).to.be.equal(false);
                expect(items[2].checked).to.be.equal(false);
                done();
              }, 1);
              MockInteractions.tap(items[0]);
eb240478   Luigi Serra   public room cards... 
185
186
187
188
189
190
 
            }, 1);
          });
  
          test('clicking the selected item should deselect if allow-empty-selection is set', function (done) {
            var g = fixture('WithSelection');
            g.allowEmptySelection = true;
eb240478   Luigi Serra   public room cards... 
191
a1a3bc73   Luigi Serra   graphs updates 
192
193
194
195
 
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              var items = g.items;
              expect(items[0].checked).to.be.equal(true);
eb240478   Luigi Serra   public room cards... 
196
a1a3bc73   Luigi Serra   graphs updates 
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
 
              // The selection should not change, but wait for a little bit just
              // in case it would and an event would be fired.
              setTimeout(function() {
                expect(items[0].checked).to.be.equal(false);
                expect(items[1].checked).to.be.equal(false);
                expect(items[2].checked).to.be.equal(false);
                done();
              }, 1);
              MockInteractions.tap(items[0]);
            }, 1);
          });
  
          test('arrow keys cause iron-activate events', function(done) {
            var g = fixture('WithSelection');
  
            // Needs to be async since the underlying iron-selector uses observeNodes.
            Polymer.Base.async(function() {
              g.items[0].focus();
  
              var i = 0;
              g.addEventListener('iron-activate', function() {
                switch (i++) {
                  case 0:
                    MockInteractions.pressAndReleaseKeyOn(g, 38);
                  break;
  
                  case 1:
                    MockInteractions.pressAndReleaseKeyOn(g, 39);
                  break;
  
                  case 2:
                    MockInteractions.pressAndReleaseKeyOn(g, 40);
                  break;
  
                  default:
                    done();
                }
              });
  
              MockInteractions.pressAndReleaseKeyOn(g, 37);
eb240478   Luigi Serra   public room cards... 
237
 
            }, 1);
73bcce88   luigser   COMPONENTS 
238
239
240
241
242
243
 
          });
  
        });
      </script>
    </body>
  </html>