@spectrum-web-components/action-group 0.6.0 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/package.json +5 -5
  2. package/test/action-group-tooltip.test-vrt.js +0 -15
  3. package/test/action-group-tooltip.test-vrt.js.map +0 -1
  4. package/test/action-group.test-vrt.js +0 -15
  5. package/test/action-group.test-vrt.js.map +0 -1
  6. package/test/action-group.test.js +0 -510
  7. package/test/action-group.test.js.map +0 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/action-group",
3
- "version": "0.6.0",
3
+ "version": "0.6.1",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -44,17 +44,17 @@
44
44
  "lit-html"
45
45
  ],
46
46
  "dependencies": {
47
- "@spectrum-web-components/action-button": "^0.7.0",
48
- "@spectrum-web-components/base": "^0.5.0",
47
+ "@spectrum-web-components/action-button": "^0.7.1",
48
+ "@spectrum-web-components/base": "^0.5.1",
49
49
  "tslib": "^2.0.0"
50
50
  },
51
51
  "devDependencies": {
52
- "@spectrum-css/actiongroup": "^1.0.5"
52
+ "@spectrum-css/actiongroup": "^1.0.10"
53
53
  },
54
54
  "types": "./src/index.d.ts",
55
55
  "customElements": "custom-elements.json",
56
56
  "sideEffects": [
57
57
  "./sp-*.js"
58
58
  ],
59
- "gitHead": "7ce77352f6894043bceac9ef92b21e5f85420969"
59
+ "gitHead": "df3f333ee26a45f9fc247716b6e8ef051dca630b"
60
60
  }
package/test/action-group-tooltip.test-vrt.js DELETED
@@ -1,15 +0,0 @@
1
- /*
2
- Copyright 2020 Adobe. All rights reserved.
3
- This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
- you may not use this file except in compliance with the License. You may obtain a copy
5
- of the License at http://www.apache.org/licenses/LICENSE-2.0
6
-
7
- Unless required by applicable law or agreed to in writing, software distributed under
8
- the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- OF ANY KIND, either express or implied. See the License for the specific language
10
- governing permissions and limitations under the License.
11
- */
12
- import * as stories from '../stories/action-group-tooltip.stories.js';
13
- import { regressVisuals } from '../../../test/visual/test.js';
14
- regressVisuals('ActionGroupTooltipStories', stories);
15
- //# sourceMappingURL=action-group-tooltip.test-vrt.js.map
package/test/action-group-tooltip.test-vrt.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"action-group-tooltip.test-vrt.js","sourceRoot":"","sources":["action-group-tooltip.test-vrt.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,KAAK,OAAO,MAAM,4CAA4C,CAAC;AACtE,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,cAAc,CAAC,2BAA2B,EAAE,OAAO,CAAC,CAAC","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport * as stories from '../stories/action-group-tooltip.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('ActionGroupTooltipStories', stories);\n"]}
package/test/action-group.test-vrt.js DELETED
@@ -1,15 +0,0 @@
1
- /*
2
- Copyright 2020 Adobe. All rights reserved.
3
- This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
- you may not use this file except in compliance with the License. You may obtain a copy
5
- of the License at http://www.apache.org/licenses/LICENSE-2.0
6
-
7
- Unless required by applicable law or agreed to in writing, software distributed under
8
- the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- OF ANY KIND, either express or implied. See the License for the specific language
10
- governing permissions and limitations under the License.
11
- */
12
- import * as stories from '../stories/action-group.stories.js';
13
- import { regressVisuals } from '../../../test/visual/test.js';
14
- regressVisuals('ActionGroupStories', stories);
15
- //# sourceMappingURL=action-group.test-vrt.js.map
package/test/action-group.test-vrt.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"action-group.test-vrt.js","sourceRoot":"","sources":["action-group.test-vrt.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,KAAK,OAAO,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,cAAc,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport * as stories from '../stories/action-group.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('ActionGroupStories', stories);\n"]}
package/test/action-group.test.js DELETED
@@ -1,510 +0,0 @@
1
- /*
2
- Copyright 2020 Adobe. All rights reserved.
3
- This file is licensed to you under the Apache License, Version 2.0 (the "License");
4
- you may not use this file except in compliance with the License. You may obtain a copy
5
- of the License at http://www.apache.org/licenses/LICENSE-2.0
6
-
7
- Unless required by applicable law or agreed to in writing, software distributed under
8
- the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
9
- OF ANY KIND, either express or implied. See the License for the specific language
10
- governing permissions and limitations under the License.
11
- */
12
- import { elementUpdated, expect, fixture, html, waitUntil, } from '@open-wc/testing';
13
- import '@spectrum-web-components/action-button/sp-action-button.js';
14
- import { LitElement } from '@spectrum-web-components/base';
15
- import '@spectrum-web-components/overlay/overlay-trigger.js';
16
- import '@spectrum-web-components/tooltip/sp-tooltip.js';
17
- import { arrowDownEvent, arrowLeftEvent, arrowRightEvent, arrowUpEvent, endEvent, homeEvent, } from '../../../test/testing-helpers';
18
- import { sendKeys } from '@web/test-runner-commands';
19
- import '../sp-action-group.js';
20
- class QuietActionGroup extends LitElement {
21
- render() {
22
- return html `
23
- <sp-action-group quiet>
24
- <slot name="first"></slot>
25
- <slot name="second"></slot>
26
- </sp-action-group>
27
- `;
28
- }
29
- }
30
- customElements.define('quiet-action-group', QuietActionGroup);
31
- class EmphasizedActionGroup extends LitElement {
32
- render() {
33
- return html `
34
- <sp-action-group emphasized>
35
- <slot name="first"></slot>
36
- <slot name="second"></slot>
37
- </sp-action-group>
38
- `;
39
- }
40
- }
41
- customElements.define('emphasized-action-group', EmphasizedActionGroup);
42
- describe('ActionGroup', () => {
43
- it('loads empty action-group accessibly', async () => {
44
- const el = await fixture(html `
45
- <sp-action-group></sp-action-group>
46
- `);
47
- await elementUpdated(el);
48
- await expect(el).to.be.accessible();
49
- });
50
- it('loads default action-group accessibly', async () => {
51
- const el = await fixture(html `
52
- <sp-action-group aria-label="Default Group">
53
- <sp-action-button>First</sp-action-button>
54
- <sp-action-button>Second</sp-action-button>
55
- <sp-action-button>Third</sp-action-button>
56
- </sp-action-group>
57
- `);
58
- await elementUpdated(el);
59
- await expect(el).to.be.accessible();
60
- expect(el.getAttribute('aria-label')).to.equal('Default Group');
61
- expect(el.hasAttribute('role')).to.be.false;
62
- expect(el.children[0].getAttribute('role')).to.equal('button');
63
- });
64
- it('applies `quiet` attribute to its children', async () => {
65
- const el = await fixture(html `
66
- <sp-action-group quiet>
67
- <sp-action-button id="first">First</sp-action-button>
68
- <sp-action-button id="second">Second</sp-action-button>
69
- </sp-action-group>
70
- `);
71
- const firstButton = el.querySelector('#first');
72
- const secondButton = el.querySelector('#second');
73
- await elementUpdated(el);
74
- expect(firstButton.hasAttribute('quiet')).to.be.true;
75
- expect(firstButton.quiet).to.be.true;
76
- expect(secondButton.hasAttribute('quiet')).to.be.true;
77
- expect(secondButton.quiet).to.be.true;
78
- });
79
- it('applies `quiet` attribute to its slotted children', async () => {
80
- const el = await fixture(html `
81
- <quiet-action-group>
82
- <sp-action-button slot="first" id="first">
83
- First
84
- </sp-action-button>
85
- <sp-action-button slot="second" id="second">
86
- Second
87
- </sp-action-button>
88
- </quiet-action-group>
89
- `);
90
- const firstButton = el.querySelector('#first');
91
- const secondButton = el.querySelector('#second');
92
- await elementUpdated(el);
93
- expect(firstButton.hasAttribute('quiet')).to.be.true;
94
- expect(firstButton.quiet).to.be.true;
95
- expect(secondButton.hasAttribute('quiet')).to.be.true;
96
- expect(secondButton.quiet).to.be.true;
97
- });
98
- it('applies `emphasized` attribute to its slotted children', async () => {
99
- const el = await fixture(html `
100
- <emphasized-action-group>
101
- <sp-action-button slot="first" id="first">
102
- First
103
- </sp-action-button>
104
- <sp-action-button slot="second" id="second">
105
- Second
106
- </sp-action-button>
107
- </emphasized-action-group>
108
- `);
109
- const firstButton = el.querySelector('#first');
110
- const secondButton = el.querySelector('#second');
111
- await elementUpdated(el);
112
- expect(firstButton.hasAttribute('emphasized')).to.be.true;
113
- expect(firstButton.emphasized).to.be.true;
114
- expect(secondButton.hasAttribute('emphasized')).to.be.true;
115
- expect(secondButton.emphasized).to.be.true;
116
- });
117
- it('applies `quiet` attribute to slotted children with overlays', async () => {
118
- const el = await fixture(html `
119
- <quiet-action-group>
120
- <overlay-trigger slot="first">
121
- <sp-action-button slot="trigger" id="first">
122
- First
123
- </sp-action-button>
124
- </overlay-trigger>
125
- <overlay-trigger slot="second">
126
- <sp-action-button slot="trigger" id="second">
127
- Second
128
- </sp-action-button>
129
- </overlay-trigger>
130
- </quiet-action-group>
131
- `);
132
- const firstButton = el.querySelector('#first');
133
- const secondButton = el.querySelector('#second');
134
- await elementUpdated(el);
135
- expect(firstButton.hasAttribute('quiet')).to.be.true;
136
- expect(firstButton.quiet).to.be.true;
137
- expect(secondButton.hasAttribute('quiet')).to.be.true;
138
- expect(secondButton.quiet).to.be.true;
139
- });
140
- it('applies `emphasized` attribute to slotted children with overlays', async () => {
141
- const el = await fixture(html `
142
- <emphasized-action-group>
143
- <overlay-trigger slot="first">
144
- <sp-action-button slot="trigger" id="first">
145
- First
146
- </sp-action-button>
147
- </overlay-trigger>
148
- <overlay-trigger slot="second">
149
- <sp-action-button slot="trigger" id="second">
150
- Second
151
- </sp-action-button>
152
- </overlay-trigger>
153
- </emphasized-action-group>
154
- `);
155
- const firstButton = el.querySelector('#first');
156
- const secondButton = el.querySelector('#second');
157
- await elementUpdated(el);
158
- expect(firstButton.hasAttribute('emphasized')).to.be.true;
159
- expect(firstButton.emphasized).to.be.true;
160
- expect(secondButton.hasAttribute('emphasized')).to.be.true;
161
- expect(secondButton.emphasized).to.be.true;
162
- });
163
- it('loads [selects="single"] action-group accessibly', async () => {
164
- const el = await fixture(html `
165
- <sp-action-group label="Selects Single Group" selects="single">
166
- <sp-action-button>First</sp-action-button>
167
- <sp-action-button>Second</sp-action-button>
168
- <sp-action-button>Third</sp-action-button>
169
- </sp-action-group>
170
- `);
171
- await elementUpdated(el);
172
- await expect(el).to.be.accessible();
173
- expect(el.getAttribute('aria-label')).to.equal('Selects Single Group');
174
- expect(el.getAttribute('role')).to.equal('radiogroup');
175
- expect(el.children[0].getAttribute('role')).to.equal('radio');
176
- });
177
- it('loads [selects="single"] action-group w/ selection accessibly', async () => {
178
- const el = await fixture(html `
179
- <sp-action-group label="Selects Single Group" selects="single">
180
- <sp-action-button>First</sp-action-button>
181
- <sp-action-button>Second</sp-action-button>
182
- <sp-action-button selected>Third</sp-action-button>
183
- </sp-action-group>
184
- `);
185
- await elementUpdated(el);
186
- await expect(el).to.be.accessible();
187
- });
188
- it('loads [selects="multiple"] action-group accessibly', async () => {
189
- const el = await fixture(html `
190
- <sp-action-group
191
- label="Selects Multiple Group"
192
- selects="multiple"
193
- >
194
- <sp-action-button>First</sp-action-button>
195
- <sp-action-button>Second</sp-action-button>
196
- <sp-action-button>Third</sp-action-button>
197
- </sp-action-group>
198
- `);
199
- await elementUpdated(el);
200
- await expect(el).to.be.accessible();
201
- expect(el.getAttribute('aria-label')).to.equal('Selects Multiple Group');
202
- expect(el.getAttribute('role')).to.equal('group');
203
- expect(el.children[0].getAttribute('role')).to.equal('checkbox');
204
- });
205
- it('loads [selects="multiple"] action-group w/ selection accessibly', async () => {
206
- const el = await fixture(html `
207
- <sp-action-group
208
- label="Selects Multiple Group"
209
- selects="multiple"
210
- >
211
- <sp-action-button>First</sp-action-button>
212
- <sp-action-button selected>Second</sp-action-button>
213
- <sp-action-button selected>Third</sp-action-button>
214
- </sp-action-group>
215
- `);
216
- await elementUpdated(el);
217
- await expect(el).to.be.accessible();
218
- });
219
- it('sets tab stop when [selects="single"] and the initial button is [disabled]', async () => {
220
- const el = await fixture(html `
221
- <sp-action-group label="Selects Single Group" selects="single">
222
- <sp-action-button disabled>First</sp-action-button>
223
- <sp-action-button class="second">Second</sp-action-button>
224
- <sp-action-button>Third</sp-action-button>
225
- </sp-action-group>
226
- `);
227
- const secondButton = el.querySelector('.second');
228
- await elementUpdated(el);
229
- expect(secondButton.hasAttribute('tabindex'));
230
- expect(secondButton.getAttribute('tabindex')).to.equal('0');
231
- });
232
- it('surfaces [selects="single"] selection', async () => {
233
- const el = await fixture(html `
234
- <sp-action-group label="Selects Single Group" selects="single">
235
- <sp-action-button>First</sp-action-button>
236
- <sp-action-button>Second</sp-action-button>
237
- <sp-action-button selected>Third</sp-action-button>
238
- </sp-action-group>
239
- `);
240
- await elementUpdated(el);
241
- expect(el.selected, '"Third" selected').to.deep.equal(['Third']);
242
- });
243
- it('surfaces [selects="multiple"] selection', async () => {
244
- const el = await fixture(html `
245
- <sp-action-group
246
- label="Selects Multiple Group"
247
- selects="multiple"
248
- >
249
- <sp-action-button>First</sp-action-button>
250
- <sp-action-button selected>Second</sp-action-button>
251
- <sp-action-button selected>Third</sp-action-button>
252
- </sp-action-group>
253
- `);
254
- await elementUpdated(el);
255
- expect(el.selected, '"Second" and "Third" selected').to.deep.equal([
256
- 'Second',
257
- 'Third',
258
- ]);
259
- });
260
- it('does not select without [selects]', async () => {
261
- const el = await fixture(html `
262
- <sp-action-group label="No Selects Group">
263
- <sp-action-button>First</sp-action-button>
264
- <sp-action-button selected>Second</sp-action-button>
265
- <sp-action-button class="third">Third</sp-action-button>
266
- </sp-action-group>
267
- `);
268
- const thirdElement = el.querySelector('.third');
269
- await elementUpdated(el);
270
- expect(el.selected.length).to.equal(0);
271
- thirdElement.click();
272
- await elementUpdated(el);
273
- expect(el.selected.length).to.equal(0);
274
- });
275
- it('selects via `click` while [selects="single"]', async () => {
276
- const el = await fixture(html `
277
- <sp-action-group label="Selects Single Group" selects="single">
278
- <sp-action-button value="first">First</sp-action-button>
279
- <sp-action-button value="second" selected>
280
- Second
281
- </sp-action-button>
282
- <sp-action-button value="third" class="third">
283
- Third
284
- </sp-action-button>
285
- </sp-action-group>
286
- `);
287
- const thirdElement = el.querySelector('.third');
288
- await elementUpdated(el);
289
- expect(el.selected.length).to.equal(1);
290
- expect(el.selected.includes('second'));
291
- thirdElement.click();
292
- await elementUpdated(el);
293
- expect(thirdElement.selected, 'third child selected').to.be.true;
294
- await waitUntil(() => el.selected.length === 1 && el.selected.includes('third'), 'Updates value of `selected`');
295
- });
296
- it('selects via `click` while [selects="multiple"] selection', async () => {
297
- const el = await fixture(html `
298
- <sp-action-group
299
- label="Selects Multiple Group"
300
- selects="multiple"
301
- >
302
- <sp-action-button selected class="first">
303
- First
304
- </sp-action-button>
305
- <sp-action-button class="second">Second</sp-action-button>
306
- <sp-action-button class="third">Third</sp-action-button>
307
- </sp-action-group>
308
- `);
309
- const firstElement = el.querySelector('.first');
310
- const secondElement = el.querySelector('.second');
311
- const thirdElement = el.querySelector('.third');
312
- await elementUpdated(el);
313
- expect(el.selected.length).to.equal(1);
314
- expect(el.selected.includes('First'));
315
- firstElement.click();
316
- secondElement.click();
317
- thirdElement.click();
318
- await elementUpdated(el);
319
- expect(secondElement.selected, 'second child selected').to.be.true;
320
- expect(thirdElement.selected, 'third child selected').to.be.true;
321
- await waitUntil(() => el.selected.length === 2 &&
322
- el.selected.includes('Second') &&
323
- el.selected.includes('Third'), 'Updates value of `selected`');
324
- });
325
- it('does not respond to clicks on itself', async () => {
326
- const el = await fixture(html `
327
- <sp-action-group label="Selects Single Group" selects="single">
328
- <sp-action-button>First</sp-action-button>
329
- <sp-action-button>Second</sp-action-button>
330
- <sp-action-button class="third">Third</sp-action-button>
331
- </sp-action-group>
332
- `);
333
- await elementUpdated(el);
334
- expect(el.selected.length).to.equal(0);
335
- el.click();
336
- await elementUpdated(el);
337
- expect(el.selected.length).to.equal(0);
338
- });
339
- it('selection can be prevented', async () => {
340
- const el = await fixture(html `
341
- <sp-action-group
342
- label="Selects Single Group"
343
- selects="single"
344
- @change=${(event) => {
345
- event.preventDefault();
346
- }}
347
- >
348
- <sp-action-button>First</sp-action-button>
349
- <sp-action-button>Second</sp-action-button>
350
- <sp-action-button class="third">Third</sp-action-button>
351
- </sp-action-group>
352
- `);
353
- const thirdElement = el.querySelector('.third');
354
- await elementUpdated(el);
355
- expect(el.selected.length).to.equal(0);
356
- thirdElement.click();
357
- await elementUpdated(el);
358
- expect(thirdElement.selected, 'third child not selected').to.be.false;
359
- expect(el.selected.length).to.equal(0);
360
- });
361
- const acceptKeyboardInput = async (el) => {
362
- const thirdElement = el.querySelector('.third');
363
- await elementUpdated(el);
364
- expect(el.selected.length).to.equal(1);
365
- expect(el.selected[0]).to.equal('Second');
366
- thirdElement.click();
367
- await elementUpdated(el);
368
- expect(thirdElement.selected, 'third child selected').to.be.true;
369
- expect(el.selected.length).to.equal(1);
370
- expect(el.selected[0]).to.equal('Third');
371
- el.dispatchEvent(arrowRightEvent);
372
- await sendKeys({ press: 'Enter' });
373
- await elementUpdated(el);
374
- expect(el.selected.length).to.equal(1);
375
- expect(el.selected[0]).to.equal('First');
376
- el.dispatchEvent(arrowLeftEvent);
377
- el.dispatchEvent(arrowUpEvent);
378
- await sendKeys({ press: 'Enter' });
379
- expect(el.selected.length).to.equal(1);
380
- expect(el.selected[0]).to.equal('Second');
381
- el.dispatchEvent(endEvent);
382
- await sendKeys({ press: 'Enter' });
383
- expect(el.selected.length).to.equal(1);
384
- expect(el.selected[0]).to.equal('Third');
385
- await sendKeys({ press: 'PageUp' });
386
- await sendKeys({ press: 'Enter' });
387
- el.dispatchEvent(homeEvent);
388
- await sendKeys({ press: 'Enter' });
389
- expect(el.selected.length).to.equal(1);
390
- expect(el.selected[0]).to.equal('First');
391
- el.dispatchEvent(arrowDownEvent);
392
- await sendKeys({ press: 'Enter' });
393
- expect(el.selected.length).to.equal(1);
394
- expect(el.selected[0]).to.equal('Second');
395
- };
396
- it('accepts keybord input', async () => {
397
- const el = await fixture(html `
398
- <sp-action-group label="Selects Single Group" selects="single">
399
- <sp-action-button>First</sp-action-button>
400
- <sp-action-button selected>Second</sp-action-button>
401
- <sp-action-button class="third">Third</sp-action-button>
402
- </sp-action-group>
403
- `);
404
- await acceptKeyboardInput(el);
405
- });
406
- it('accepts keybord input with tooltip', async () => {
407
- const el = await fixture(html `
408
- <sp-action-group label="Selects Single Group" selects="single">
409
- <overlay-trigger>
410
- <sp-action-button slot="trigger">
411
- First
412
- </sp-action-button>
413
- <sp-tooltip slot="hover-content">
414
- Definitely the first one.
415
- </sp-tooltip>
416
- </overlay-trigger>
417
- <overlay-trigger>
418
- <sp-action-button slot="trigger" selected>
419
- Second
420
- </sp-action-button>
421
- <sp-tooltip slot="hover-content">
422
- Not the first, not the last.
423
- </sp-tooltip>
424
- </overlay-trigger>
425
- <overlay-trigger>
426
- <sp-action-button slot="trigger" class="third">
427
- Third
428
- </sp-action-button>
429
- <sp-tooltip slot="hover-content">Select me.</sp-tooltip>
430
- </overlay-trigger>
431
- </sp-action-group>
432
- `);
433
- await acceptKeyboardInput(el);
434
- });
435
- it('accepts keybord input when [dir="ltr"]', async () => {
436
- const el = await fixture(html `
437
- <sp-action-group
438
- label="Selects Single Group"
439
- selects="single"
440
- dir="ltr"
441
- >
442
- <sp-action-button>First</sp-action-button>
443
- <sp-action-button disabled>Second</sp-action-button>
444
- <sp-action-button class="third">Third</sp-action-button>
445
- </sp-action-group>
446
- `);
447
- const thirdElement = el.querySelector('.third');
448
- await elementUpdated(el);
449
- expect(el.selected.length).to.equal(0);
450
- thirdElement.click();
451
- await elementUpdated(el);
452
- expect(thirdElement.selected, 'third child selected').to.be.true;
453
- expect(el.selected.length).to.equal(1);
454
- expect(el.selected[0]).to.equal('Third');
455
- el.dispatchEvent(arrowRightEvent);
456
- await sendKeys({ press: 'Enter' });
457
- await elementUpdated(el);
458
- expect(el.selected.length).to.equal(1);
459
- expect(el.selected[0]).to.equal('First');
460
- el.dispatchEvent(arrowUpEvent);
461
- await sendKeys({ press: 'Enter' });
462
- expect(el.selected.length).to.equal(1);
463
- expect(el.selected[0]).to.equal('Third');
464
- });
465
- it('accepts "PageUp" and "PageDown"', async () => {
466
- const el = await fixture(html `
467
- <div>
468
- <sp-action-group
469
- label="Selects Single Group"
470
- selects="single"
471
- >
472
- <sp-action-button>First A</sp-action-button>
473
- <sp-action-button class="first">
474
- Second A
475
- </sp-action-button>
476
- <sp-action-button>Third</sp-action-button>
477
- </sp-action-group>
478
- <sp-action-group
479
- label="Selects Single Group"
480
- selects="multiple"
481
- >
482
- <sp-action-button>First B</sp-action-button>
483
- <sp-action-button selected class="second">
484
- Second B
485
- </sp-action-button>
486
- <sp-action-button>Third</sp-action-button>
487
- </sp-action-group>
488
- <sp-action-group></sp-action-group>
489
- </div>
490
- `);
491
- const firstElement = el.querySelector('.first');
492
- const secondElement = el.querySelector('.second');
493
- await elementUpdated(firstElement);
494
- await elementUpdated(secondElement);
495
- firstElement.click();
496
- await sendKeys({ press: 'PageDown' });
497
- let activeElement = document.activeElement;
498
- expect(activeElement).equal(secondElement);
499
- await sendKeys({ press: 'PageUp' });
500
- activeElement = document.activeElement;
501
- expect(activeElement).to.equal(firstElement);
502
- await sendKeys({ press: 'PageUp' });
503
- activeElement = document.activeElement;
504
- expect(activeElement).to.equal(secondElement);
505
- await sendKeys({ press: 'PageDown' });
506
- activeElement = document.activeElement;
507
- expect(activeElement).to.equal(firstElement);
508
- });
509
- });
510
- //# sourceMappingURL=action-group.test.js.map
package/test/action-group.test.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"action-group.test.js","sourceRoot":"","sources":["action-group.test.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\n\nimport { ActionButton } from '@spectrum-web-components/action-button';\nimport '@spectrum-web-components/action-button/sp-action-button.js';\nimport { LitElement, TemplateResult } from '@spectrum-web-components/base';\nimport '@spectrum-web-components/overlay/overlay-trigger.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport { ActionGroup } from '..';\nimport {\n arrowDownEvent,\n arrowLeftEvent,\n arrowRightEvent,\n arrowUpEvent,\n endEvent,\n homeEvent,\n} from '../../../test/testing-helpers';\nimport { sendKeys } from '@web/test-runner-commands';\nimport '../sp-action-group.js';\n\nclass QuietActionGroup extends LitElement {\n protected render(): TemplateResult {\n return html`\n <sp-action-group quiet>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('quiet-action-group', QuietActionGroup);\n\nclass EmphasizedActionGroup extends LitElement {\n protected render(): TemplateResult {\n return html`\n <sp-action-group emphasized>\n <slot name=\"first\"></slot>\n <slot name=\"second\"></slot>\n </sp-action-group>\n `;\n }\n}\ncustomElements.define('emphasized-action-group', EmphasizedActionGroup);\n\ndescribe('ActionGroup', () => {\n it('loads empty action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group></sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('loads default action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group aria-label=\"Default Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Default Group');\n expect(el.hasAttribute('role')).to.be.false;\n expect(el.children[0].getAttribute('role')).to.equal('button');\n });\n it('applies `quiet` attribute to its children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group quiet>\n <sp-action-button id=\"first\">First</sp-action-button>\n <sp-action-button id=\"second\">Second</sp-action-button>\n </sp-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `quiet` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to its slotted children', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <sp-action-button slot=\"first\" id=\"first\">\n First\n </sp-action-button>\n <sp-action-button slot=\"second\" id=\"second\">\n Second\n </sp-action-button>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('applies `quiet` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <quiet-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </quiet-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('quiet')).to.be.true;\n expect(firstButton.quiet).to.be.true;\n expect(secondButton.hasAttribute('quiet')).to.be.true;\n expect(secondButton.quiet).to.be.true;\n });\n it('applies `emphasized` attribute to slotted children with overlays', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <emphasized-action-group>\n <overlay-trigger slot=\"first\">\n <sp-action-button slot=\"trigger\" id=\"first\">\n First\n </sp-action-button>\n </overlay-trigger>\n <overlay-trigger slot=\"second\">\n <sp-action-button slot=\"trigger\" id=\"second\">\n Second\n </sp-action-button>\n </overlay-trigger>\n </emphasized-action-group>\n `\n );\n const firstButton = el.querySelector('#first') as ActionButton;\n const secondButton = el.querySelector('#second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(firstButton.hasAttribute('emphasized')).to.be.true;\n expect(firstButton.emphasized).to.be.true;\n expect(secondButton.hasAttribute('emphasized')).to.be.true;\n expect(secondButton.emphasized).to.be.true;\n });\n it('loads [selects=\"single\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal('Selects Single Group');\n expect(el.getAttribute('role')).to.equal('radiogroup');\n expect(el.children[0].getAttribute('role')).to.equal('radio');\n });\n it('loads [selects=\"single\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('loads [selects=\"multiple\"] action-group accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n expect(el.getAttribute('aria-label')).to.equal(\n 'Selects Multiple Group'\n );\n expect(el.getAttribute('role')).to.equal('group');\n expect(el.children[0].getAttribute('role')).to.equal('checkbox');\n });\n it('loads [selects=\"multiple\"] action-group w/ selection accessibly', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('sets tab stop when [selects=\"single\"] and the initial button is [disabled]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button disabled>First</sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n `\n );\n const secondButton = el.querySelector('.second') as ActionButton;\n\n await elementUpdated(el);\n\n expect(secondButton.hasAttribute('tabindex'));\n expect(secondButton.getAttribute('tabindex')).to.equal('0');\n });\n it('surfaces [selects=\"single\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Third\" selected').to.deep.equal(['Third']);\n });\n it('surfaces [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button selected>Third</sp-action-button>\n </sp-action-group>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected, '\"Second\" and \"Third\" selected').to.deep.equal([\n 'Second',\n 'Third',\n ]);\n });\n it('does not select without [selects]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"No Selects Group\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(0);\n });\n it('selects via `click` while [selects=\"single\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button value=\"first\">First</sp-action-button>\n <sp-action-button value=\"second\" selected>\n Second\n </sp-action-button>\n <sp-action-button value=\"third\" class=\"third\">\n Third\n </sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('second'));\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () => el.selected.length === 1 && el.selected.includes('third'),\n 'Updates value of `selected`'\n );\n });\n it('selects via `click` while [selects=\"multiple\"] selection', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Multiple Group\"\n selects=\"multiple\"\n >\n <sp-action-button selected class=\"first\">\n First\n </sp-action-button>\n <sp-action-button class=\"second\">Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected.includes('First'));\n\n firstElement.click();\n secondElement.click();\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(secondElement.selected, 'second child selected').to.be.true;\n expect(thirdElement.selected, 'third child selected').to.be.true;\n\n await waitUntil(\n () =>\n el.selected.length === 2 &&\n el.selected.includes('Second') &&\n el.selected.includes('Third'),\n 'Updates value of `selected`'\n );\n });\n it('does not respond to clicks on itself', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n el.click();\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(0);\n });\n it('selection can be prevented', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n @change=${(event: Event): void => {\n event.preventDefault();\n }}\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child not selected').to.be.false;\n expect(el.selected.length).to.equal(0);\n });\n const acceptKeyboardInput = async (el: ActionGroup): Promise<void> => {\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent);\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowLeftEvent);\n el.dispatchEvent(arrowUpEvent);\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n\n el.dispatchEvent(endEvent);\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n await sendKeys({ press: 'PageUp' });\n await sendKeys({ press: 'Enter' });\n\n el.dispatchEvent(homeEvent);\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowDownEvent);\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Second');\n };\n it('accepts keybord input', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <sp-action-button>First</sp-action-button>\n <sp-action-button selected>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input with tooltip', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group label=\"Selects Single Group\" selects=\"single\">\n <overlay-trigger>\n <sp-action-button slot=\"trigger\">\n First\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Definitely the first one.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" selected>\n Second\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">\n Not the first, not the last.\n </sp-tooltip>\n </overlay-trigger>\n <overlay-trigger>\n <sp-action-button slot=\"trigger\" class=\"third\">\n Third\n </sp-action-button>\n <sp-tooltip slot=\"hover-content\">Select me.</sp-tooltip>\n </overlay-trigger>\n </sp-action-group>\n `\n );\n await acceptKeyboardInput(el);\n });\n it('accepts keybord input when [dir=\"ltr\"]', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n dir=\"ltr\"\n >\n <sp-action-button>First</sp-action-button>\n <sp-action-button disabled>Second</sp-action-button>\n <sp-action-button class=\"third\">Third</sp-action-button>\n </sp-action-group>\n `\n );\n const thirdElement = el.querySelector('.third') as ActionButton;\n\n await elementUpdated(el);\n expect(el.selected.length).to.equal(0);\n\n thirdElement.click();\n\n await elementUpdated(el);\n\n expect(thirdElement.selected, 'third child selected').to.be.true;\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n\n el.dispatchEvent(arrowRightEvent);\n await sendKeys({ press: 'Enter' });\n\n await elementUpdated(el);\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('First');\n\n el.dispatchEvent(arrowUpEvent);\n await sendKeys({ press: 'Enter' });\n\n expect(el.selected.length).to.equal(1);\n expect(el.selected[0]).to.equal('Third');\n });\n it('accepts \"PageUp\" and \"PageDown\"', async () => {\n const el = await fixture<ActionGroup>(\n html`\n <div>\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"single\"\n >\n <sp-action-button>First A</sp-action-button>\n <sp-action-button class=\"first\">\n Second A\n </sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n <sp-action-group\n label=\"Selects Single Group\"\n selects=\"multiple\"\n >\n <sp-action-button>First B</sp-action-button>\n <sp-action-button selected class=\"second\">\n Second B\n </sp-action-button>\n <sp-action-button>Third</sp-action-button>\n </sp-action-group>\n <sp-action-group></sp-action-group>\n </div>\n `\n );\n const firstElement = el.querySelector('.first') as ActionButton;\n const secondElement = el.querySelector('.second') as ActionButton;\n\n await elementUpdated(firstElement);\n await elementUpdated(secondElement);\n\n firstElement.click();\n\n await sendKeys({ press: 'PageDown' });\n let activeElement = document.activeElement as ActionButton;\n expect(activeElement).equal(secondElement);\n\n await sendKeys({ press: 'PageUp' });\n activeElement = document.activeElement as ActionButton;\n expect(activeElement).to.equal(firstElement);\n\n await sendKeys({ press: 'PageUp' });\n activeElement = document.activeElement as ActionButton;\n expect(activeElement).to.equal(secondElement);\n\n await sendKeys({ press: 'PageDown' });\n activeElement = document.activeElement as ActionButton;\n expect(activeElement).to.equal(firstElement);\n });\n});\n"]}