@crowdstrike/glide-core 0.13.1 → 0.14.0
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.
- package/dist/drawer.d.ts +2 -2
- package/dist/drawer.js +1 -1
- package/dist/drawer.styles.js +3 -3
- package/dist/dropdown.styles.js +3 -2
- package/dist/input.styles.js +1 -0
- package/dist/styles/variables.css +1 -1
- package/dist/textarea.styles.js +2 -0
- package/dist/toasts.d.ts +2 -2
- package/dist/toasts.toast.d.ts +1 -1
- package/dist/toasts.toast.js +1 -1
- package/dist/toasts.toast.styles.js +8 -0
- package/dist/tree.item.styles.js +2 -2
- package/package.json +8 -5
- package/dist/accordion.stories.d.ts +0 -6
- package/dist/accordion.test.basics.d.ts +0 -1
- package/dist/accordion.test.basics.js +0 -28
- package/dist/accordion.test.events.d.ts +0 -1
- package/dist/accordion.test.events.js +0 -28
- package/dist/accordion.test.focus.d.ts +0 -1
- package/dist/accordion.test.focus.js +0 -11
- package/dist/accordion.test.interactions.d.ts +0 -1
- package/dist/accordion.test.interactions.js +0 -75
- package/dist/button-group.button.test.basics.d.ts +0 -1
- package/dist/button-group.button.test.basics.js +0 -97
- package/dist/button-group.button.test.events.d.ts +0 -1
- package/dist/button-group.button.test.events.js +0 -15
- package/dist/button-group.button.test.focus.d.ts +0 -1
- package/dist/button-group.button.test.focus.js +0 -13
- package/dist/button-group.button.test.interactions.d.ts +0 -1
- package/dist/button-group.button.test.interactions.js +0 -42
- package/dist/button-group.stories.d.ts +0 -7
- package/dist/button-group.test.basics.d.ts +0 -1
- package/dist/button-group.test.basics.js +0 -148
- package/dist/button-group.test.events.d.ts +0 -1
- package/dist/button-group.test.events.js +0 -241
- package/dist/button-group.test.focus.d.ts +0 -1
- package/dist/button-group.test.focus.js +0 -39
- package/dist/button-group.test.interactions.d.ts +0 -1
- package/dist/button-group.test.interactions.js +0 -91
- package/dist/button.stories.d.ts +0 -7
- package/dist/button.test.basics.d.ts +0 -1
- package/dist/button.test.basics.js +0 -69
- package/dist/button.test.events.d.ts +0 -1
- package/dist/button.test.events.js +0 -102
- package/dist/checkbox-group.stories.d.ts +0 -6
- package/dist/checkbox-group.test.basics.d.ts +0 -1
- package/dist/checkbox-group.test.basics.js +0 -116
- package/dist/checkbox-group.test.events.d.ts +0 -1
- package/dist/checkbox-group.test.events.js +0 -111
- package/dist/checkbox-group.test.focus.d.ts +0 -1
- package/dist/checkbox-group.test.focus.js +0 -70
- package/dist/checkbox-group.test.form.d.ts +0 -1
- package/dist/checkbox-group.test.form.js +0 -131
- package/dist/checkbox-group.test.interactions.d.ts +0 -1
- package/dist/checkbox-group.test.interactions.js +0 -82
- package/dist/checkbox-group.test.validity.d.ts +0 -1
- package/dist/checkbox-group.test.validity.js +0 -145
- package/dist/checkbox.stories.d.ts +0 -5
- package/dist/checkbox.test.basics.d.ts +0 -1
- package/dist/checkbox.test.basics.js +0 -90
- package/dist/checkbox.test.events.d.ts +0 -1
- package/dist/checkbox.test.events.js +0 -105
- package/dist/checkbox.test.focus.d.ts +0 -1
- package/dist/checkbox.test.focus.js +0 -51
- package/dist/checkbox.test.form.d.ts +0 -1
- package/dist/checkbox.test.form.js +0 -133
- package/dist/checkbox.test.interactions.d.ts +0 -1
- package/dist/checkbox.test.interactions.js +0 -131
- package/dist/checkbox.test.validity.d.ts +0 -1
- package/dist/checkbox.test.validity.js +0 -128
- package/dist/drawer.stories.d.ts +0 -6
- package/dist/drawer.test.accessibility.d.ts +0 -1
- package/dist/drawer.test.accessibility.js +0 -22
- package/dist/drawer.test.basics.d.ts +0 -1
- package/dist/drawer.test.basics.js +0 -44
- package/dist/drawer.test.closing.d.ts +0 -1
- package/dist/drawer.test.closing.js +0 -40
- package/dist/drawer.test.events.d.ts +0 -1
- package/dist/drawer.test.events.js +0 -42
- package/dist/drawer.test.methods.d.ts +0 -1
- package/dist/drawer.test.methods.js +0 -35
- package/dist/dropdown.option.test.basics.d.ts +0 -1
- package/dist/dropdown.option.test.basics.js +0 -34
- package/dist/dropdown.option.test.basics.multiple.d.ts +0 -1
- package/dist/dropdown.option.test.basics.multiple.js +0 -36
- package/dist/dropdown.option.test.basics.single.d.ts +0 -1
- package/dist/dropdown.option.test.basics.single.js +0 -29
- package/dist/dropdown.option.test.events.d.ts +0 -1
- package/dist/dropdown.option.test.events.js +0 -36
- package/dist/dropdown.option.test.focus.d.ts +0 -1
- package/dist/dropdown.option.test.focus.js +0 -11
- package/dist/dropdown.option.test.interactions.multiple.d.ts +0 -1
- package/dist/dropdown.option.test.interactions.multiple.js +0 -42
- package/dist/dropdown.option.test.interactions.single.d.ts +0 -1
- package/dist/dropdown.option.test.interactions.single.js +0 -76
- package/dist/dropdown.stories.d.ts +0 -8
- package/dist/dropdown.test.basics.d.ts +0 -1
- package/dist/dropdown.test.basics.filterable.d.ts +0 -1
- package/dist/dropdown.test.basics.filterable.js +0 -108
- package/dist/dropdown.test.basics.js +0 -181
- package/dist/dropdown.test.basics.multiple.d.ts +0 -1
- package/dist/dropdown.test.basics.multiple.js +0 -259
- package/dist/dropdown.test.basics.single.d.ts +0 -1
- package/dist/dropdown.test.basics.single.js +0 -122
- package/dist/dropdown.test.events.d.ts +0 -1
- package/dist/dropdown.test.events.filterable.d.ts +0 -1
- package/dist/dropdown.test.events.filterable.js +0 -31
- package/dist/dropdown.test.events.js +0 -251
- package/dist/dropdown.test.events.multiple.d.ts +0 -1
- package/dist/dropdown.test.events.multiple.js +0 -446
- package/dist/dropdown.test.events.single.d.ts +0 -1
- package/dist/dropdown.test.events.single.js +0 -343
- package/dist/dropdown.test.focus.d.ts +0 -1
- package/dist/dropdown.test.focus.filterable.d.ts +0 -1
- package/dist/dropdown.test.focus.filterable.js +0 -140
- package/dist/dropdown.test.focus.js +0 -107
- package/dist/dropdown.test.focus.multiple.d.ts +0 -1
- package/dist/dropdown.test.focus.multiple.js +0 -170
- package/dist/dropdown.test.focus.single.d.ts +0 -1
- package/dist/dropdown.test.focus.single.js +0 -42
- package/dist/dropdown.test.form.d.ts +0 -1
- package/dist/dropdown.test.form.js +0 -74
- package/dist/dropdown.test.form.multiple.d.ts +0 -1
- package/dist/dropdown.test.form.multiple.js +0 -151
- package/dist/dropdown.test.form.single.d.ts +0 -1
- package/dist/dropdown.test.form.single.js +0 -129
- package/dist/dropdown.test.interactions.d.ts +0 -1
- package/dist/dropdown.test.interactions.filterable.d.ts +0 -1
- package/dist/dropdown.test.interactions.filterable.js +0 -805
- package/dist/dropdown.test.interactions.js +0 -696
- package/dist/dropdown.test.interactions.multiple.d.ts +0 -1
- package/dist/dropdown.test.interactions.multiple.js +0 -1026
- package/dist/dropdown.test.interactions.single.d.ts +0 -1
- package/dist/dropdown.test.interactions.single.js +0 -569
- package/dist/dropdown.test.validity.d.ts +0 -1
- package/dist/dropdown.test.validity.js +0 -181
- package/dist/form-controls-layout.stories.d.ts +0 -10
- package/dist/form-controls-layout.test.basics.d.ts +0 -2
- package/dist/form-controls-layout.test.basics.js +0 -75
- package/dist/form-controls-layout.test.interactions.d.ts +0 -2
- package/dist/form-controls-layout.test.interactions.js +0 -26
- package/dist/icon-button.stories.d.ts +0 -6
- package/dist/icon-button.test.basics.d.ts +0 -1
- package/dist/icon-button.test.basics.js +0 -43
- package/dist/icon-button.test.focus.d.ts +0 -1
- package/dist/icon-button.test.focus.js +0 -13
- package/dist/input.stories.d.ts +0 -8
- package/dist/input.test.basics.d.ts +0 -1
- package/dist/input.test.basics.js +0 -138
- package/dist/input.test.events.d.ts +0 -1
- package/dist/input.test.events.js +0 -98
- package/dist/input.test.focus.d.ts +0 -1
- package/dist/input.test.focus.js +0 -58
- package/dist/input.test.form.d.ts +0 -1
- package/dist/input.test.form.js +0 -74
- package/dist/input.test.validity.d.ts +0 -1
- package/dist/input.test.validity.js +0 -258
- package/dist/label.test.basics.d.ts +0 -1
- package/dist/label.test.basics.js +0 -136
- package/dist/menu.button.test.basics.d.ts +0 -1
- package/dist/menu.button.test.basics.js +0 -43
- package/dist/menu.link.test.basics.d.ts +0 -1
- package/dist/menu.link.test.basics.js +0 -47
- package/dist/menu.options.test.basics.d.ts +0 -2
- package/dist/menu.options.test.basics.js +0 -44
- package/dist/menu.options.test.events.d.ts +0 -1
- package/dist/menu.options.test.events.js +0 -19
- package/dist/menu.stories.d.ts +0 -11
- package/dist/menu.test.basics.d.ts +0 -1
- package/dist/menu.test.basics.js +0 -178
- package/dist/menu.test.events.d.ts +0 -3
- package/dist/menu.test.events.js +0 -125
- package/dist/menu.test.focus.d.ts +0 -2
- package/dist/menu.test.focus.js +0 -102
- package/dist/menu.test.interactions.d.ts +0 -3
- package/dist/menu.test.interactions.js +0 -1069
- package/dist/modal.icon-button.test.basics.d.ts +0 -1
- package/dist/modal.icon-button.test.basics.js +0 -46
- package/dist/modal.stories.d.ts +0 -13
- package/dist/modal.tertiary-icon.test.basics.d.ts +0 -1
- package/dist/modal.tertiary-icon.test.basics.js +0 -60
- package/dist/modal.test.accessibility.d.ts +0 -1
- package/dist/modal.test.accessibility.js +0 -38
- package/dist/modal.test.basics.d.ts +0 -3
- package/dist/modal.test.basics.js +0 -204
- package/dist/modal.test.close.d.ts +0 -1
- package/dist/modal.test.close.js +0 -35
- package/dist/modal.test.events.d.ts +0 -1
- package/dist/modal.test.events.js +0 -99
- package/dist/modal.test.lock-scroll.d.ts +0 -1
- package/dist/modal.test.lock-scroll.js +0 -67
- package/dist/modal.test.methods.d.ts +0 -1
- package/dist/modal.test.methods.js +0 -20
- package/dist/modal.test.scrollbars.d.ts +0 -1
- package/dist/modal.test.scrollbars.js +0 -18
- package/dist/radio-group.stories.d.ts +0 -6
- package/dist/radio-group.test.basics.d.ts +0 -2
- package/dist/radio-group.test.basics.js +0 -324
- package/dist/radio-group.test.events.d.ts +0 -2
- package/dist/radio-group.test.events.js +0 -278
- package/dist/radio-group.test.focus.d.ts +0 -2
- package/dist/radio-group.test.focus.js +0 -95
- package/dist/radio-group.test.form.d.ts +0 -1
- package/dist/radio-group.test.form.js +0 -124
- package/dist/radio-group.test.validity.d.ts +0 -1
- package/dist/radio-group.test.validity.js +0 -311
- package/dist/split-button.primary-button.test.basics.d.ts +0 -1
- package/dist/split-button.primary-button.test.basics.js +0 -31
- package/dist/split-button.primary-button.test.focus.d.ts +0 -1
- package/dist/split-button.primary-button.test.focus.js +0 -14
- package/dist/split-button.primary-link.test.basics.d.ts +0 -1
- package/dist/split-button.primary-link.test.basics.js +0 -30
- package/dist/split-button.primary-link.test.focus.d.ts +0 -1
- package/dist/split-button.primary-link.test.focus.js +0 -15
- package/dist/split-button.secondary-button.test.basics.d.ts +0 -1
- package/dist/split-button.secondary-button.test.basics.js +0 -58
- package/dist/split-button.secondary-button.test.focus.d.ts +0 -1
- package/dist/split-button.secondary-button.test.focus.js +0 -14
- package/dist/split-button.secondary-button.test.interactions.d.ts +0 -2
- package/dist/split-button.secondary-button.test.interactions.js +0 -30
- package/dist/split-button.stories.d.ts +0 -13
- package/dist/split-button.test.basics.d.ts +0 -2
- package/dist/split-button.test.basics.js +0 -87
- package/dist/split-button.test.interactions.d.ts +0 -4
- package/dist/split-button.test.interactions.js +0 -51
- package/dist/tab.group.test.basics.d.ts +0 -3
- package/dist/tab.group.test.basics.js +0 -234
- package/dist/tab.group.test.interactions.d.ts +0 -3
- package/dist/tab.group.test.interactions.js +0 -434
- package/dist/tab.test.basics.d.ts +0 -1
- package/dist/tab.test.basics.js +0 -50
- package/dist/tabs.stories.d.ts +0 -8
- package/dist/tag.stories.d.ts +0 -7
- package/dist/tag.test.basics.d.ts +0 -1
- package/dist/tag.test.basics.js +0 -28
- package/dist/tag.test.events.d.ts +0 -1
- package/dist/tag.test.events.js +0 -93
- package/dist/tag.test.focus.d.ts +0 -1
- package/dist/tag.test.focus.js +0 -10
- package/dist/tag.test.interactions.d.ts +0 -1
- package/dist/tag.test.interactions.js +0 -36
- package/dist/textarea.stories.d.ts +0 -5
- package/dist/textarea.test.basics.d.ts +0 -1
- package/dist/textarea.test.basics.js +0 -177
- package/dist/textarea.test.events.d.ts +0 -1
- package/dist/textarea.test.events.js +0 -106
- package/dist/textarea.test.form.d.ts +0 -1
- package/dist/textarea.test.form.js +0 -71
- package/dist/textarea.test.validity.d.ts +0 -1
- package/dist/textarea.test.validity.js +0 -204
- package/dist/toasts.stories.d.ts +0 -7
- package/dist/toasts.test.basics.d.ts +0 -1
- package/dist/toasts.test.basics.js +0 -115
- package/dist/toasts.toast.test.basics.d.ts +0 -1
- package/dist/toasts.toast.test.basics.js +0 -139
- package/dist/toggle.stories.d.ts +0 -4
- package/dist/toggle.test.basics.d.ts +0 -1
- package/dist/toggle.test.basics.js +0 -69
- package/dist/toggle.test.events.d.ts +0 -1
- package/dist/toggle.test.events.js +0 -30
- package/dist/toggle.test.focus.d.ts +0 -1
- package/dist/toggle.test.focus.js +0 -9
- package/dist/toggle.test.interactions.d.ts +0 -1
- package/dist/toggle.test.interactions.js +0 -81
- package/dist/tooltip.stories.d.ts +0 -7
- package/dist/tooltip.test.basics.d.ts +0 -1
- package/dist/tooltip.test.basics.js +0 -100
- package/dist/tooltip.test.interactions.d.ts +0 -1
- package/dist/tooltip.test.interactions.js +0 -203
- package/dist/tree.item.icon-button.test.basics.d.ts +0 -1
- package/dist/tree.item.icon-button.test.basics.js +0 -22
- package/dist/tree.item.menu.test.basics.d.ts +0 -1
- package/dist/tree.item.menu.test.basics.js +0 -86
- package/dist/tree.item.test.basics.d.ts +0 -2
- package/dist/tree.item.test.basics.js +0 -138
- package/dist/tree.stories.d.ts +0 -9
- package/dist/tree.test.aria.d.ts +0 -1
- package/dist/tree.test.aria.js +0 -86
- package/dist/tree.test.basics.d.ts +0 -3
- package/dist/tree.test.basics.js +0 -130
- package/dist/tree.test.events.d.ts +0 -2
- package/dist/tree.test.events.js +0 -19
- package/dist/tree.test.focus.d.ts +0 -1
- package/dist/tree.test.focus.js +0 -383
@@ -1,95 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import './radio-group.js';
|
3
|
-
import './radio.js';
|
4
|
-
import { expect, fixture, html } from '@open-wc/testing';
|
5
|
-
import { sendKeys } from '@web/test-runner-commands';
|
6
|
-
import GlideCoreRadio from './radio.js';
|
7
|
-
import GlideCoreRadioGroup from './radio-group.js';
|
8
|
-
GlideCoreRadio.shadowRootOptions.mode = 'open';
|
9
|
-
GlideCoreRadioGroup.shadowRootOptions.mode = 'open';
|
10
|
-
it('focuses the first radio when `focus()` is called', async () => {
|
11
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
12
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
13
|
-
</glide-core-radio-group>`);
|
14
|
-
component.focus();
|
15
|
-
expect(document.activeElement).to.equal(component.querySelector('glide-core-radio'));
|
16
|
-
});
|
17
|
-
it('focuses the first radio after submit when the group is "required" and the radio is unchecked', async () => {
|
18
|
-
const form = document.createElement('form');
|
19
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
20
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
21
|
-
</glide-core-radio-group>`, {
|
22
|
-
parentNode: form,
|
23
|
-
});
|
24
|
-
form.requestSubmit();
|
25
|
-
const radio = component.querySelector('glide-core-radio');
|
26
|
-
expect(radio).to.have.focus;
|
27
|
-
});
|
28
|
-
it('focuses the first radio after `reportValidity` is called when the group is "required" and the radio is unchecked', async () => {
|
29
|
-
const form = document.createElement('form');
|
30
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
31
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
32
|
-
</glide-core-radio-group>`, {
|
33
|
-
parentNode: form,
|
34
|
-
});
|
35
|
-
component.reportValidity();
|
36
|
-
expect(document.activeElement).to.equal(component.querySelector('glide-core-radio'));
|
37
|
-
});
|
38
|
-
it('focuses the first radio after `requestSubmit` is called when the group is "required" and the radio is unchecked', async () => {
|
39
|
-
const form = document.createElement('form');
|
40
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
41
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
42
|
-
</glide-core-radio-group>`, {
|
43
|
-
parentNode: form,
|
44
|
-
});
|
45
|
-
form.requestSubmit();
|
46
|
-
expect(document.activeElement).to.equal(component.querySelector('glide-core-radio'));
|
47
|
-
});
|
48
|
-
it('does not focus the a radio after `checkValidity` is called', async () => {
|
49
|
-
const form = document.createElement('form');
|
50
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
51
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
52
|
-
</glide-core-radio-group>`, {
|
53
|
-
parentNode: form,
|
54
|
-
});
|
55
|
-
component.checkValidity();
|
56
|
-
expect(document.activeElement).to.not.equal(component.querySelector('glide-core-radio'));
|
57
|
-
});
|
58
|
-
it('focuses the first checked radio when it exists', async () => {
|
59
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
60
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
61
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
62
|
-
<glide-core-radio value="value-3" label="Three"></glide-core-radio>
|
63
|
-
</glide-core-radio-group>`);
|
64
|
-
component.focus();
|
65
|
-
const radio = component.querySelector('glide-core-radio[value="value-2"]');
|
66
|
-
expect(radio).to.have.focus;
|
67
|
-
});
|
68
|
-
it('focuses the first tabbable radio when none are checked', async () => {
|
69
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
70
|
-
<glide-core-radio value="value-1" disabled label="One"></glide-core-radio>
|
71
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
72
|
-
<glide-core-radio value="value-3" label="Three"></glide-core-radio>
|
73
|
-
</glide-core-radio-group>`);
|
74
|
-
component.focus();
|
75
|
-
const radio = component.querySelector('glide-core-radio[value="value-2"]');
|
76
|
-
expect(radio).to.have.focus;
|
77
|
-
});
|
78
|
-
it('reports validity if blurred', async () => {
|
79
|
-
const component = await fixture(html `<glide-core-radio-group label="Checkbox Group" required>
|
80
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
81
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
82
|
-
</glide-core-radio-group>`);
|
83
|
-
component.focus();
|
84
|
-
const radioItems = component.querySelectorAll('glide-core-radio');
|
85
|
-
expect(document.activeElement === radioItems[0]).to.be.true;
|
86
|
-
expect(component.shadowRoot
|
87
|
-
?.querySelector('glide-core-private-label')
|
88
|
-
?.hasAttribute('error')).to.be.false;
|
89
|
-
await sendKeys({ press: 'Tab' });
|
90
|
-
expect(document.activeElement === document.body).to.be.true;
|
91
|
-
expect(component.validity.valid).to.be.false;
|
92
|
-
expect(component.shadowRoot
|
93
|
-
?.querySelector('glide-core-private-label')
|
94
|
-
?.hasAttribute('error')).to.be.true;
|
95
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,124 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { assert, elementUpdated, expect, fixture, html, } from '@open-wc/testing';
|
3
|
-
import { sendKeys } from '@web/test-runner-commands';
|
4
|
-
import GlideCoreRadio from './radio.js';
|
5
|
-
import GlideCoreRadioGroup from './radio-group.js';
|
6
|
-
import sinon from 'sinon';
|
7
|
-
GlideCoreRadio.shadowRootOptions.mode = 'open';
|
8
|
-
GlideCoreRadioGroup.shadowRootOptions.mode = 'open';
|
9
|
-
it('exposes standard form control properties and methods', async () => {
|
10
|
-
const form = document.createElement('form');
|
11
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
12
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
13
|
-
</glide-core-radio-group>`, { parentNode: form });
|
14
|
-
expect(component.form).to.equal(form);
|
15
|
-
expect(component.validity instanceof ValidityState).to.be.true;
|
16
|
-
expect(component.willValidate).to.be.true;
|
17
|
-
expect(component.checkValidity).to.be.a('function');
|
18
|
-
expect(component.reportValidity).to.be.a('function');
|
19
|
-
});
|
20
|
-
it('can be reset', async () => {
|
21
|
-
const form = document.createElement('form');
|
22
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
23
|
-
<glide-core-radio value="value-1" checked label="One"></glide-core-radio>
|
24
|
-
</glide-core-radio-group>`, {
|
25
|
-
parentNode: form,
|
26
|
-
});
|
27
|
-
const radio = component.querySelector('glide-core-radio');
|
28
|
-
assert(radio);
|
29
|
-
radio.checked = false;
|
30
|
-
form.reset();
|
31
|
-
expect(component.value).to.equal('value-1');
|
32
|
-
});
|
33
|
-
it('can reset correctly when the checked radios are changed', async () => {
|
34
|
-
const form = document.createElement('form');
|
35
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
36
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
37
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
38
|
-
</glide-core-radio-group>`, {
|
39
|
-
parentNode: form,
|
40
|
-
});
|
41
|
-
const radios = component.querySelectorAll('glide-core-radio');
|
42
|
-
radios[0].click();
|
43
|
-
await elementUpdated(component);
|
44
|
-
expect(radios[0]?.hasAttribute('checked')).to.be.true;
|
45
|
-
expect(radios[1]).to.not.have.attribute('checked');
|
46
|
-
expect(component.value).to.equal('value-1');
|
47
|
-
form.reset();
|
48
|
-
await elementUpdated(component);
|
49
|
-
expect(radios[0]).to.not.have.attribute('checked');
|
50
|
-
expect(radios[1]?.hasAttribute('checked')).to.be.true;
|
51
|
-
expect(component.value).to.equal('value-2');
|
52
|
-
});
|
53
|
-
it('has `formData` when a radio is checked', async () => {
|
54
|
-
const form = document.createElement('form');
|
55
|
-
await fixture(html `<glide-core-radio-group label="label" name="name">
|
56
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
57
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
58
|
-
</glide-core-radio-group>`, {
|
59
|
-
parentNode: form,
|
60
|
-
});
|
61
|
-
const formData = new FormData(form);
|
62
|
-
expect(formData.get('name')).to.be.equal('value-2');
|
63
|
-
});
|
64
|
-
it('has no `formData` when no radios are checked', async () => {
|
65
|
-
const form = document.createElement('form');
|
66
|
-
await fixture(html `<glide-core-radio-group label="label" name="name">
|
67
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
68
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
69
|
-
</glide-core-radio-group>`, {
|
70
|
-
parentNode: form,
|
71
|
-
});
|
72
|
-
const formData = new FormData(form);
|
73
|
-
expect(formData.get('name')).to.be.null;
|
74
|
-
});
|
75
|
-
it('has no `formData` when the group is disabled and one radio is checked', async () => {
|
76
|
-
const form = document.createElement('form');
|
77
|
-
await fixture(html `<glide-core-radio-group label="label" name="name" disabled>
|
78
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
79
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
80
|
-
</glide-core-radio-group>`, {
|
81
|
-
parentNode: form,
|
82
|
-
});
|
83
|
-
const formData = new FormData(form);
|
84
|
-
expect(formData.get('name')).to.be.null;
|
85
|
-
});
|
86
|
-
it('has no `formData` when without a `name` but a radio is checked', async () => {
|
87
|
-
const form = document.createElement('form');
|
88
|
-
await fixture(html `<glide-core-radio-group label="label">
|
89
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
90
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
91
|
-
</glide-core-radio-group>`, {
|
92
|
-
parentNode: form,
|
93
|
-
});
|
94
|
-
const formData = new FormData(form);
|
95
|
-
expect(formData.get('name')).to.be.null;
|
96
|
-
});
|
97
|
-
it('has no `formData` value when a radio is checked but without a "value"', async () => {
|
98
|
-
const form = document.createElement('form');
|
99
|
-
await fixture(html `<glide-core-radio-group label="label">
|
100
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
101
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
102
|
-
</glide-core-radio-group>`, {
|
103
|
-
parentNode: form,
|
104
|
-
});
|
105
|
-
const formData = new FormData(form);
|
106
|
-
expect(formData.get('name')).to.be.null;
|
107
|
-
});
|
108
|
-
it('submits its form on Enter', async () => {
|
109
|
-
const form = document.createElement('form');
|
110
|
-
const component = await fixture(html `<glide-core-radio-group label="label">
|
111
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
112
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
113
|
-
</glide-core-radio-group>`, {
|
114
|
-
parentNode: form,
|
115
|
-
});
|
116
|
-
const spy = sinon.spy();
|
117
|
-
form.addEventListener('submit', (event) => {
|
118
|
-
event.preventDefault();
|
119
|
-
spy();
|
120
|
-
});
|
121
|
-
component.focus();
|
122
|
-
await sendKeys({ press: 'Enter' });
|
123
|
-
expect(spy.callCount).to.equal(1);
|
124
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,311 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
|
3
|
-
import GlideCoreRadio from './radio.js';
|
4
|
-
import GlideCoreRadioGroup from './radio-group.js';
|
5
|
-
GlideCoreRadio.shadowRootOptions.mode = 'open';
|
6
|
-
GlideCoreRadioGroup.shadowRootOptions.mode = 'open';
|
7
|
-
it('is valid if not required and radios are unchecked', async () => {
|
8
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
9
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
10
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
11
|
-
</glide-core-radio-group>`);
|
12
|
-
expect(component.validity.valid).to.be.true;
|
13
|
-
expect(component.validity?.valueMissing).to.be.false;
|
14
|
-
expect(component.checkValidity()).to.be.true;
|
15
|
-
expect(component.reportValidity()).to.be.true;
|
16
|
-
const radios = component.querySelectorAll('glide-core-radio');
|
17
|
-
expect(radios[0]?.invalid).to.be.false;
|
18
|
-
expect(radios[0]?.ariaInvalid).to.equal('false');
|
19
|
-
expect(radios[1]?.invalid).to.be.false;
|
20
|
-
expect(radios[1]?.ariaInvalid).to.equal('false');
|
21
|
-
});
|
22
|
-
it('is valid if required and a radio is checked', async () => {
|
23
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
24
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
25
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
26
|
-
</glide-core-radio-group>`);
|
27
|
-
expect(component.validity.valid).to.be.true;
|
28
|
-
expect(component.validity?.valueMissing).to.be.false;
|
29
|
-
expect(component.checkValidity()).to.be.true;
|
30
|
-
expect(component.reportValidity()).to.be.true;
|
31
|
-
const radios = component.querySelectorAll('glide-core-radio');
|
32
|
-
expect(radios[0]?.invalid).to.be.false;
|
33
|
-
expect(radios[0]?.ariaInvalid).to.equal('false');
|
34
|
-
expect(radios[1]?.invalid).to.be.false;
|
35
|
-
expect(radios[1]?.ariaInvalid).to.equal('false');
|
36
|
-
});
|
37
|
-
it('is invalid if required and no radio is checked', async () => {
|
38
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
39
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
40
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
41
|
-
</glide-core-radio-group>`);
|
42
|
-
expect(component.validity.valid).to.be.false;
|
43
|
-
expect(component.validity?.valueMissing).to.be.true;
|
44
|
-
expect(component.checkValidity()).to.be.false;
|
45
|
-
expect(component.reportValidity()).to.be.false;
|
46
|
-
});
|
47
|
-
it('is both invalid and valid if required but disabled and no radio is checked', async () => {
|
48
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required disabled>
|
49
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
50
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
51
|
-
</glide-core-radio-group>`);
|
52
|
-
expect(component.validity.valid).to.be.false;
|
53
|
-
expect(component.validity?.valueMissing).to.be.true;
|
54
|
-
expect(component.checkValidity()).to.be.true;
|
55
|
-
expect(component.reportValidity()).to.be.true;
|
56
|
-
});
|
57
|
-
it('adds an error class after submit when invalid and required', async () => {
|
58
|
-
const form = document.createElement('form');
|
59
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
60
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
61
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
62
|
-
</glide-core-radio-group>`, { parentNode: form });
|
63
|
-
form.requestSubmit();
|
64
|
-
await elementUpdated(component);
|
65
|
-
const isComponentErrorClass = component.shadowRoot
|
66
|
-
?.querySelector('.radio-container')
|
67
|
-
?.classList.contains('invalid');
|
68
|
-
expect(isComponentErrorClass).to.be.true;
|
69
|
-
});
|
70
|
-
it('adds an error class after `reportValidity` is called when invalid and required', async () => {
|
71
|
-
const form = document.createElement('form');
|
72
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
73
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
74
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
75
|
-
</glide-core-radio-group>`, { parentNode: form });
|
76
|
-
component.reportValidity();
|
77
|
-
await elementUpdated(component);
|
78
|
-
const isComponentErrorClass = component.shadowRoot
|
79
|
-
?.querySelector('.radio-container')
|
80
|
-
?.classList.contains('invalid');
|
81
|
-
expect(isComponentErrorClass).to.be.true;
|
82
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
83
|
-
expect(radios[0]?.invalid).to.be.true;
|
84
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('true');
|
85
|
-
expect(radios[1]?.invalid).to.be.true;
|
86
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('true');
|
87
|
-
});
|
88
|
-
it('does not add an error class by default', async () => {
|
89
|
-
const form = document.createElement('form');
|
90
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
91
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
92
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
93
|
-
</glide-core-radio-group>`, { parentNode: form });
|
94
|
-
const isComponentErrorClass = component.shadowRoot
|
95
|
-
?.querySelector('.radio-container')
|
96
|
-
?.classList.contains('invalid');
|
97
|
-
expect(isComponentErrorClass).to.be.false;
|
98
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
99
|
-
let isRadioError = radios[0].shadowRoot
|
100
|
-
?.querySelector('[data-test="radio"]')
|
101
|
-
?.classList.contains('invalid');
|
102
|
-
expect(isRadioError).to.be.false;
|
103
|
-
isRadioError = radios[1].shadowRoot
|
104
|
-
?.querySelector('[data-test="radio"]')
|
105
|
-
?.classList.contains('invalid');
|
106
|
-
expect(isRadioError).to.be.false;
|
107
|
-
expect(radios[0]?.invalid).to.be.false;
|
108
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('false');
|
109
|
-
expect(radios[1]?.invalid).to.be.false;
|
110
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('false');
|
111
|
-
});
|
112
|
-
it('does not add an error class after `reportValidity` is called when not required', async () => {
|
113
|
-
const form = document.createElement('form');
|
114
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
115
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
116
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
117
|
-
</glide-core-radio-group>`, { parentNode: form });
|
118
|
-
component.reportValidity();
|
119
|
-
await elementUpdated(component);
|
120
|
-
const isComponentErrorClass = component.shadowRoot
|
121
|
-
?.querySelector('.radio-container')
|
122
|
-
?.classList.contains('invalid');
|
123
|
-
expect(isComponentErrorClass).to.be.false;
|
124
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
125
|
-
let isRadioError = radios[0].shadowRoot
|
126
|
-
?.querySelector('[data-test="radio"]')
|
127
|
-
?.classList.contains('invalid');
|
128
|
-
expect(isRadioError).to.be.false;
|
129
|
-
isRadioError = radios[1].shadowRoot
|
130
|
-
?.querySelector('[data-test="radio"]')
|
131
|
-
?.classList.contains('invalid');
|
132
|
-
expect(isRadioError).to.be.false;
|
133
|
-
expect(radios[0]?.invalid).to.be.false;
|
134
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('false');
|
135
|
-
expect(radios[1]?.invalid).to.be.false;
|
136
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('false');
|
137
|
-
});
|
138
|
-
it('does not add an error class after `reportValidity` is called when required and a radio is checked', async () => {
|
139
|
-
const form = document.createElement('form');
|
140
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
141
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
142
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
143
|
-
</glide-core-radio-group>`, { parentNode: form });
|
144
|
-
component.reportValidity();
|
145
|
-
await elementUpdated(component);
|
146
|
-
const isComponentErrorClass = component.shadowRoot
|
147
|
-
?.querySelector('.radio-container')
|
148
|
-
?.classList.contains('invalid');
|
149
|
-
expect(isComponentErrorClass).to.be.false;
|
150
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
151
|
-
let isRadioError = radios[0].shadowRoot
|
152
|
-
?.querySelector('[data-test="radio"]')
|
153
|
-
?.classList.contains('invalid');
|
154
|
-
expect(isRadioError).to.be.false;
|
155
|
-
isRadioError = radios[1].shadowRoot
|
156
|
-
?.querySelector('[data-test="radio"]')
|
157
|
-
?.classList.contains('invalid');
|
158
|
-
expect(isRadioError).to.be.false;
|
159
|
-
expect(radios[0]?.invalid).to.be.false;
|
160
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('false');
|
161
|
-
expect(radios[1]?.invalid).to.be.false;
|
162
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('false');
|
163
|
-
});
|
164
|
-
it('does not add an error class after `reportValidity` is called when required but disabled', async () => {
|
165
|
-
const form = document.createElement('form');
|
166
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required disabled>
|
167
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
168
|
-
<glide-core-radio value="value-2" checked label="Two"></glide-core-radio>
|
169
|
-
</glide-core-radio-group>`, { parentNode: form });
|
170
|
-
component.reportValidity();
|
171
|
-
await elementUpdated(component);
|
172
|
-
const isComponentErrorClass = component.shadowRoot
|
173
|
-
?.querySelector('.radio-container')
|
174
|
-
?.classList.contains('invalid');
|
175
|
-
expect(isComponentErrorClass).to.be.false;
|
176
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
177
|
-
let isRadioError = radios[0].shadowRoot
|
178
|
-
?.querySelector('[data-test="radio"]')
|
179
|
-
?.classList.contains('invalid');
|
180
|
-
expect(isRadioError).to.be.false;
|
181
|
-
isRadioError = radios[1].shadowRoot
|
182
|
-
?.querySelector('[data-test="radio"]')
|
183
|
-
?.classList.contains('invalid');
|
184
|
-
expect(isRadioError).to.be.false;
|
185
|
-
expect(radios[0]?.invalid).to.be.false;
|
186
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('false');
|
187
|
-
expect(radios[1]?.invalid).to.be.false;
|
188
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('false');
|
189
|
-
});
|
190
|
-
it('does not add an error class after `checkValidity` is called when required', async () => {
|
191
|
-
const form = document.createElement('form');
|
192
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
193
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
194
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
195
|
-
</glide-core-radio-group>`, { parentNode: form });
|
196
|
-
component.checkValidity();
|
197
|
-
await elementUpdated(component);
|
198
|
-
const isComponentErrorClass = component.shadowRoot
|
199
|
-
?.querySelector('.radio-container')
|
200
|
-
?.classList.contains('invalid');
|
201
|
-
expect(isComponentErrorClass).to.be.false;
|
202
|
-
const radios = document.querySelectorAll('glide-core-radio');
|
203
|
-
let isRadioError = radios[0].shadowRoot
|
204
|
-
?.querySelector('[data-test="radio"]')
|
205
|
-
?.classList.contains('invalid');
|
206
|
-
expect(isRadioError).to.be.false;
|
207
|
-
isRadioError = radios[1].shadowRoot
|
208
|
-
?.querySelector('[data-test="radio"]')
|
209
|
-
?.classList.contains('invalid');
|
210
|
-
expect(isRadioError).to.be.false;
|
211
|
-
expect(radios[0]?.invalid).to.be.false;
|
212
|
-
expect(radios[0]?.getAttribute('aria-invalid')).to.equal('false');
|
213
|
-
expect(radios[1]?.invalid).to.be.false;
|
214
|
-
expect(radios[1]?.getAttribute('aria-invalid')).to.equal('false');
|
215
|
-
});
|
216
|
-
it('sets radios as valid initially when required', async () => {
|
217
|
-
const form = document.createElement('form');
|
218
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
219
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
220
|
-
<glide-core-radio value="value-2" label="Two"></glide-core-radio>
|
221
|
-
</glide-core-radio-group>`, { parentNode: form });
|
222
|
-
component.required = false;
|
223
|
-
await elementUpdated(component);
|
224
|
-
const radios = component.querySelectorAll('glide-core-radio');
|
225
|
-
expect(radios[0]?.invalid).to.be.false;
|
226
|
-
expect(radios[0]?.ariaInvalid).to.equal('false');
|
227
|
-
expect(radios[1]?.invalid).to.be.false;
|
228
|
-
expect(radios[1]?.ariaInvalid).to.equal('false');
|
229
|
-
});
|
230
|
-
it('is valid after `value` is set and `required`', async () => {
|
231
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
232
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
233
|
-
</glide-core-radio-group>`);
|
234
|
-
expect(component.validity?.valid).to.be.false;
|
235
|
-
expect(component.validity?.valueMissing).to.be.true;
|
236
|
-
expect(component.checkValidity()).to.be.false;
|
237
|
-
expect(component.reportValidity()).to.be.false;
|
238
|
-
component.value = 'value-1';
|
239
|
-
expect(component.validity?.valid).to.be.true;
|
240
|
-
expect(component.validity?.valueMissing).to.be.false;
|
241
|
-
expect(component.checkValidity()).to.be.true;
|
242
|
-
expect(component.reportValidity()).to.be.true;
|
243
|
-
});
|
244
|
-
it('sets the validity message with `setCustomValidity()`', async () => {
|
245
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
246
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
247
|
-
</glide-core-radio-group>`);
|
248
|
-
component.setCustomValidity('validity message');
|
249
|
-
expect(component.validity?.valid).to.be.false;
|
250
|
-
expect(component.validity?.customError).to.be.true;
|
251
|
-
expect(component.checkValidity()).to.be.false;
|
252
|
-
await elementUpdated(component);
|
253
|
-
// Like native, the validity message shouldn't display until `reportValidity()` is called.
|
254
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
255
|
-
?.textContent).to.be.undefined;
|
256
|
-
expect(component.reportValidity()).to.be.false;
|
257
|
-
await elementUpdated(component);
|
258
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
259
|
-
?.textContent).to.equal('validity message');
|
260
|
-
});
|
261
|
-
it('removes a validity message with an empty argument to `setCustomValidity()`', async () => {
|
262
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
263
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
264
|
-
</glide-core-radio-group>`);
|
265
|
-
component.setCustomValidity('validity message');
|
266
|
-
component.reportValidity();
|
267
|
-
await elementUpdated(component);
|
268
|
-
component.setCustomValidity('');
|
269
|
-
await elementUpdated(component);
|
270
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
271
|
-
?.textContent).to.be.undefined;
|
272
|
-
});
|
273
|
-
it('is invalid when `setValidity()` is called', async () => {
|
274
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
275
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
276
|
-
</glide-core-radio-group>`);
|
277
|
-
component.setValidity({ customError: true }, 'validity message');
|
278
|
-
expect(component.validity.valid).to.be.false;
|
279
|
-
await elementUpdated(component);
|
280
|
-
// Like native, the validity message shouldn't display until `reportValidity()` is called.
|
281
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
282
|
-
?.textContent).to.be.undefined;
|
283
|
-
expect(component.validity?.customError).to.be.true;
|
284
|
-
component.reportValidity();
|
285
|
-
await elementUpdated(component);
|
286
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
287
|
-
?.textContent).to.equal('validity message');
|
288
|
-
});
|
289
|
-
it('is valid when `setValidity()` is called', async () => {
|
290
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name">
|
291
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
292
|
-
</glide-core-radio-group>`);
|
293
|
-
component.setValidity({ customError: true }, 'validity message');
|
294
|
-
component.setValidity({});
|
295
|
-
await elementUpdated(component);
|
296
|
-
expect(component.validity.valid).to.be.true;
|
297
|
-
expect(component.validity.customError).to.be.false;
|
298
|
-
expect(component.reportValidity()).to.be.true;
|
299
|
-
await elementUpdated(component);
|
300
|
-
expect(component.shadowRoot?.querySelector('[data-test="validity-message"]')
|
301
|
-
?.textContent).to.be.undefined;
|
302
|
-
});
|
303
|
-
it('retains existing validity state when `setCustomValidity()` is called', async () => {
|
304
|
-
const component = await fixture(html `<glide-core-radio-group label="label" name="name" required>
|
305
|
-
<glide-core-radio value="value-1" label="One"></glide-core-radio>
|
306
|
-
</glide-core-radio-group>`);
|
307
|
-
component.setCustomValidity('validity message');
|
308
|
-
expect(component.validity?.valid).to.be.false;
|
309
|
-
expect(component.validity?.customError).to.be.true;
|
310
|
-
expect(component.validity?.valueMissing).to.be.true;
|
311
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,31 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
|
3
|
-
import GlideCoreSplitButtonPrimaryButton from './split-button.primary-button.js';
|
4
|
-
GlideCoreSplitButtonPrimaryButton.shadowRootOptions.mode = 'open';
|
5
|
-
it('registers', async () => {
|
6
|
-
expect(window.customElements.get('glide-core-split-button-primary-button')).to.equal(GlideCoreSplitButtonPrimaryButton);
|
7
|
-
});
|
8
|
-
it('is accessible', async () => {
|
9
|
-
const component = await fixture(html `
|
10
|
-
<glide-core-split-button-primary-button
|
11
|
-
label="Label"
|
12
|
-
></glide-core-split-button-primary-button>
|
13
|
-
`);
|
14
|
-
await expect(component).to.be.accessible();
|
15
|
-
component.disabled = true;
|
16
|
-
await elementUpdated(component);
|
17
|
-
await expect(component).to.be.accessible();
|
18
|
-
});
|
19
|
-
it('has defaults', async () => {
|
20
|
-
const component = await fixture(html `
|
21
|
-
<glide-core-split-button-primary-button
|
22
|
-
label="Label"
|
23
|
-
></glide-core-split-button-primary-button>
|
24
|
-
`);
|
25
|
-
expect(component.ariaControls).to.be.null;
|
26
|
-
expect(component.ariaExpanded).to.be.null;
|
27
|
-
expect(component.ariaHasPopup).to.be.null;
|
28
|
-
expect(component.disabled).to.be.false;
|
29
|
-
expect(component.privateSize).to.equal('large');
|
30
|
-
expect(component.privateVariant).to.equal('primary');
|
31
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,14 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { expect, fixture, html } from '@open-wc/testing';
|
3
|
-
import GlideCoreSplitButtonPrimaryButton from './split-button.primary-button.js';
|
4
|
-
GlideCoreSplitButtonPrimaryButton.shadowRootOptions.mode = 'open';
|
5
|
-
it('focuses itself when `focus()` is called', async () => {
|
6
|
-
const component = await fixture(html `
|
7
|
-
<glide-core-split-button-primary-button
|
8
|
-
label="Label"
|
9
|
-
></glide-core-split-button-primary-button>
|
10
|
-
`);
|
11
|
-
component.focus();
|
12
|
-
const button = component.shadowRoot?.querySelector('[data-test="component"]');
|
13
|
-
expect(component.shadowRoot?.activeElement).to.equal(button);
|
14
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,30 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
|
3
|
-
import GlideCoreSplitButtonPrimaryLink from './split-button.primary-link.js';
|
4
|
-
GlideCoreSplitButtonPrimaryLink.shadowRootOptions.mode = 'open';
|
5
|
-
it('registers', async () => {
|
6
|
-
expect(window.customElements.get('glide-core-split-button-primary-link')).to.equal(GlideCoreSplitButtonPrimaryLink);
|
7
|
-
});
|
8
|
-
it('is accessible', async () => {
|
9
|
-
const component = await fixture(html `
|
10
|
-
<glide-core-split-button-primary-link
|
11
|
-
label="Label"
|
12
|
-
url="/"
|
13
|
-
></glide-core-split-button-primary-link>
|
14
|
-
`);
|
15
|
-
await expect(component).to.be.accessible();
|
16
|
-
component.disabled = true;
|
17
|
-
await elementUpdated(component);
|
18
|
-
await expect(component).to.be.accessible();
|
19
|
-
});
|
20
|
-
it('has defaults', async () => {
|
21
|
-
const component = await fixture(html `
|
22
|
-
<glide-core-split-button-primary-link
|
23
|
-
label="Label"
|
24
|
-
url="/"
|
25
|
-
></glide-core-split-button-primary-link>
|
26
|
-
`);
|
27
|
-
expect(component.disabled).to.be.false;
|
28
|
-
expect(component.privateSize).to.equal('large');
|
29
|
-
expect(component.privateVariant).to.equal('primary');
|
30
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|
@@ -1,15 +0,0 @@
|
|
1
|
-
/* eslint-disable @typescript-eslint/no-unused-expressions */
|
2
|
-
import { expect, fixture, html } from '@open-wc/testing';
|
3
|
-
import GlideCoreSplitButtonPrimaryLink from './split-button.primary-link.js';
|
4
|
-
GlideCoreSplitButtonPrimaryLink.shadowRootOptions.mode = 'open';
|
5
|
-
it('focuses itself when `focus()` is called', async () => {
|
6
|
-
const component = await fixture(html `
|
7
|
-
<glide-core-split-button-primary-link
|
8
|
-
label="Label"
|
9
|
-
url="/"
|
10
|
-
></glide-core-split-button-primary-link>
|
11
|
-
`);
|
12
|
-
component.focus();
|
13
|
-
const link = component.shadowRoot?.querySelector('[data-test="component"]');
|
14
|
-
expect(component.shadowRoot?.activeElement).to.equal(link);
|
15
|
-
});
|
@@ -1 +0,0 @@
|
|
1
|
-
export {};
|