@spectrum-web-components/button 0.18.2-devmode2.0 → 0.19.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.
- package/package.json +8 -8
- package/sp-button.dev.js +1 -0
- package/sp-button.dev.js.map +1 -1
- package/sp-button.js +1 -2
- package/sp-button.js.map +2 -2
- package/sp-clear-button.dev.js +1 -0
- package/sp-clear-button.dev.js.map +1 -1
- package/sp-clear-button.js +1 -2
- package/sp-clear-button.js.map +2 -2
- package/sp-close-button.dev.js +1 -0
- package/sp-close-button.dev.js.map +1 -1
- package/sp-close-button.js +1 -2
- package/sp-close-button.js.map +2 -2
- package/src/Button.dev.js +1 -0
- package/src/Button.dev.js.map +1 -1
- package/src/Button.js +1 -78
- package/src/Button.js.map +2 -2
- package/src/ButtonBase.dev.js +8 -2
- package/src/ButtonBase.dev.js.map +1 -1
- package/src/ButtonBase.js +6 -205
- package/src/ButtonBase.js.map +2 -2
- package/src/ClearButton.dev.js +1 -0
- package/src/ClearButton.dev.js.map +1 -1
- package/src/ClearButton.js +6 -52
- package/src/ClearButton.js.map +2 -2
- package/src/CloseButton.dev.js +1 -0
- package/src/CloseButton.dev.js.map +1 -1
- package/src/CloseButton.js +5 -48
- package/src/CloseButton.js.map +2 -2
- package/src/StyledButton.dev.js +1 -0
- package/src/StyledButton.dev.js.map +1 -1
- package/src/StyledButton.js +1 -7
- package/src/StyledButton.js.map +2 -2
- package/src/button-base.css.dev.js +1 -0
- package/src/button-base.css.dev.js.map +1 -1
- package/src/button-base.css.js +2 -4
- package/src/button-base.css.js.map +2 -2
- package/src/button.css.dev.js +1 -0
- package/src/button.css.dev.js.map +1 -1
- package/src/button.css.js +2 -4
- package/src/button.css.js.map +2 -2
- package/src/index.dev.js +1 -0
- package/src/index.dev.js.map +1 -1
- package/src/index.js +1 -5
- package/src/index.js.map +1 -1
- package/src/spectrum-button-base.css.dev.js +1 -0
- package/src/spectrum-button-base.css.dev.js.map +1 -1
- package/src/spectrum-button-base.css.js +2 -4
- package/src/spectrum-button-base.css.js.map +2 -2
- package/src/spectrum-button.css.dev.js +1 -0
- package/src/spectrum-button.css.dev.js.map +1 -1
- package/src/spectrum-button.css.js +2 -4
- package/src/spectrum-button.css.js.map +2 -2
- package/stories/button-accent-fill-sizes.stories.js +1 -0
- package/stories/button-accent-fill-sizes.stories.js.map +2 -2
- package/stories/button-accent-fill.stories.js +1 -0
- package/stories/button-accent-fill.stories.js.map +1 -1
- package/stories/button-accent-outline-sizes.stories.js +1 -0
- package/stories/button-accent-outline-sizes.stories.js.map +2 -2
- package/stories/button-accent-outline.stories.js +1 -0
- package/stories/button-accent-outline.stories.js.map +1 -1
- package/stories/button-black-fill-sizes.stories.js +1 -0
- package/stories/button-black-fill-sizes.stories.js.map +2 -2
- package/stories/button-black-fill.stories.js +1 -0
- package/stories/button-black-fill.stories.js.map +1 -1
- package/stories/button-black-outline-sizes.stories.js +1 -0
- package/stories/button-black-outline-sizes.stories.js.map +2 -2
- package/stories/button-black-outline.stories.js +1 -0
- package/stories/button-black-outline.stories.js.map +1 -1
- package/stories/button-negative-fill-sizes.stories.js +1 -0
- package/stories/button-negative-fill-sizes.stories.js.map +2 -2
- package/stories/button-negative-fill.stories.js +1 -0
- package/stories/button-negative-fill.stories.js.map +1 -1
- package/stories/button-negative-outline-sizes.stories.js +1 -0
- package/stories/button-negative-outline-sizes.stories.js.map +2 -2
- package/stories/button-negative-outline.stories.js +1 -0
- package/stories/button-negative-outline.stories.js.map +1 -1
- package/stories/button-primary-fill-sizes.stories.js +1 -0
- package/stories/button-primary-fill-sizes.stories.js.map +2 -2
- package/stories/button-primary-fill.stories.js +1 -0
- package/stories/button-primary-fill.stories.js.map +1 -1
- package/stories/button-primary-outline-sizes.stories.js +1 -0
- package/stories/button-primary-outline-sizes.stories.js.map +2 -2
- package/stories/button-primary-outline.stories.js +1 -0
- package/stories/button-primary-outline.stories.js.map +1 -1
- package/stories/button-secondary-fill-sizes.stories.js +1 -0
- package/stories/button-secondary-fill-sizes.stories.js.map +2 -2
- package/stories/button-secondary-fill.stories.js +1 -0
- package/stories/button-secondary-fill.stories.js.map +1 -1
- package/stories/button-secondary-outline-sizes.stories.js +1 -0
- package/stories/button-secondary-outline-sizes.stories.js.map +2 -2
- package/stories/button-secondary-outline.stories.js +1 -0
- package/stories/button-secondary-outline.stories.js.map +1 -1
- package/stories/button-white-fill-sizes.stories.js +1 -0
- package/stories/button-white-fill-sizes.stories.js.map +2 -2
- package/stories/button-white-fill.stories.js +1 -0
- package/stories/button-white-fill.stories.js.map +1 -1
- package/stories/button-white-outline-sizes.stories.js +1 -0
- package/stories/button-white-outline-sizes.stories.js.map +2 -2
- package/stories/button-white-outline.stories.js +1 -0
- package/stories/button-white-outline.stories.js.map +1 -1
- package/stories/index.js +1 -0
- package/stories/index.js.map +1 -1
- package/test/benchmark/test-basic.js +1 -0
- package/test/benchmark/test-basic.js.map +1 -1
- package/test/button-accent-fill-sizes.test-vrt.js +1 -0
- package/test/button-accent-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-accent-fill.test-vrt.js +1 -0
- package/test/button-accent-fill.test-vrt.js.map +1 -1
- package/test/button-accent-outline-sizes.test-vrt.js +1 -0
- package/test/button-accent-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-accent-outline.test-vrt.js +1 -0
- package/test/button-accent-outline.test-vrt.js.map +1 -1
- package/test/button-black-fill-sizes.test-vrt.js +1 -0
- package/test/button-black-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-black-fill.test-vrt.js +1 -0
- package/test/button-black-fill.test-vrt.js.map +1 -1
- package/test/button-black-outline-sizes.test-vrt.js +1 -0
- package/test/button-black-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-black-outline.test-vrt.js +1 -0
- package/test/button-black-outline.test-vrt.js.map +1 -1
- package/test/button-negative-fill-sizes.test-vrt.js +1 -0
- package/test/button-negative-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-negative-fill.test-vrt.js +1 -0
- package/test/button-negative-fill.test-vrt.js.map +1 -1
- package/test/button-negative-outline-sizes.test-vrt.js +1 -0
- package/test/button-negative-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-negative-outline.test-vrt.js +1 -0
- package/test/button-negative-outline.test-vrt.js.map +1 -1
- package/test/button-primary-fill-sizes.test-vrt.js +1 -0
- package/test/button-primary-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-primary-fill.test-vrt.js +1 -0
- package/test/button-primary-fill.test-vrt.js.map +1 -1
- package/test/button-primary-outline-sizes.test-vrt.js +1 -0
- package/test/button-primary-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-primary-outline.test-vrt.js +1 -0
- package/test/button-primary-outline.test-vrt.js.map +1 -1
- package/test/button-secondary-fill-sizes.test-vrt.js +1 -0
- package/test/button-secondary-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-secondary-fill.test-vrt.js +1 -0
- package/test/button-secondary-fill.test-vrt.js.map +1 -1
- package/test/button-secondary-outline-sizes.test-vrt.js +1 -0
- package/test/button-secondary-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-secondary-outline.test-vrt.js +1 -0
- package/test/button-secondary-outline.test-vrt.js.map +1 -1
- package/test/button-white-fill-sizes.test-vrt.js +1 -0
- package/test/button-white-fill-sizes.test-vrt.js.map +1 -1
- package/test/button-white-fill.test-vrt.js +1 -0
- package/test/button-white-fill.test-vrt.js.map +1 -1
- package/test/button-white-outline-sizes.test-vrt.js +1 -0
- package/test/button-white-outline-sizes.test-vrt.js.map +1 -1
- package/test/button-white-outline.test-vrt.js +1 -0
- package/test/button-white-outline.test-vrt.js.map +1 -1
- package/test/button.test.js +188 -121
- package/test/button.test.js.map +1 -1
- package/test/clear-button.test.js +11 -4
- package/test/clear-button.test.js.map +1 -1
- package/test/close-button.test.js +11 -4
- package/test/close-button.test.js.map +1 -1
package/test/button.test.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
import "@spectrum-web-components/button/sp-button.js";
|
|
2
3
|
import {
|
|
3
4
|
elementUpdated,
|
|
@@ -12,33 +13,43 @@ import {
|
|
|
12
13
|
} from "../../../test/testing-helpers.js";
|
|
13
14
|
import { spy } from "sinon";
|
|
14
15
|
describe("Button", () => {
|
|
15
|
-
testForLitDevWarnings(
|
|
16
|
+
testForLitDevWarnings(
|
|
17
|
+
async () => await fixture(
|
|
18
|
+
html`
|
|
16
19
|
<sp-button tabindex="0">Button</sp-button>
|
|
17
|
-
`
|
|
20
|
+
`
|
|
21
|
+
)
|
|
22
|
+
);
|
|
18
23
|
it("loads default", async () => {
|
|
19
|
-
const el = await fixture(
|
|
24
|
+
const el = await fixture(
|
|
25
|
+
html`
|
|
20
26
|
<sp-button tabindex="0">Button</sp-button>
|
|
21
|
-
`
|
|
27
|
+
`
|
|
28
|
+
);
|
|
22
29
|
await elementUpdated(el);
|
|
23
30
|
expect(el).to.not.be.undefined;
|
|
24
31
|
expect(el.textContent).to.include("Button");
|
|
25
32
|
await expect(el).to.be.accessible();
|
|
26
33
|
});
|
|
27
34
|
it("loads default w/ element content", async () => {
|
|
28
|
-
const el = await fixture(
|
|
35
|
+
const el = await fixture(
|
|
36
|
+
html`
|
|
29
37
|
<sp-button label="Button"><svg></svg></sp-button>
|
|
30
|
-
`
|
|
38
|
+
`
|
|
39
|
+
);
|
|
31
40
|
await elementUpdated(el);
|
|
32
41
|
expect(el).to.not.be.undefined;
|
|
33
42
|
await expect(el).to.be.accessible();
|
|
34
43
|
});
|
|
35
44
|
it("loads default w/ an icon", async () => {
|
|
36
|
-
const el = await fixture(
|
|
45
|
+
const el = await fixture(
|
|
46
|
+
html`
|
|
37
47
|
<sp-button label="">
|
|
38
48
|
Button
|
|
39
49
|
<svg slot="icon"></svg>
|
|
40
50
|
</sp-button>
|
|
41
|
-
`
|
|
51
|
+
`
|
|
52
|
+
);
|
|
42
53
|
await elementUpdated(el);
|
|
43
54
|
expect(el).to.not.be.undefined;
|
|
44
55
|
expect(el.textContent).to.include("Button");
|
|
@@ -46,19 +57,23 @@ describe("Button", () => {
|
|
|
46
57
|
await expect(el).to.be.accessible();
|
|
47
58
|
});
|
|
48
59
|
it("loads default only icon", async () => {
|
|
49
|
-
const el = await fixture(
|
|
60
|
+
const el = await fixture(
|
|
61
|
+
html`
|
|
50
62
|
<sp-button label="Button">
|
|
51
63
|
<svg slot="icon"></svg>
|
|
52
64
|
</sp-button>
|
|
53
|
-
`
|
|
65
|
+
`
|
|
66
|
+
);
|
|
54
67
|
await elementUpdated(el);
|
|
55
68
|
expect(el).to.not.be.undefined;
|
|
56
69
|
await expect(el).to.be.accessible();
|
|
57
70
|
});
|
|
58
71
|
it('manages "role"', async () => {
|
|
59
|
-
const el = await fixture(
|
|
72
|
+
const el = await fixture(
|
|
73
|
+
html`
|
|
60
74
|
<sp-button>Button</sp-button>
|
|
61
|
-
`
|
|
75
|
+
`
|
|
76
|
+
);
|
|
62
77
|
await elementUpdated(el);
|
|
63
78
|
expect(el.getAttribute("role")).to.equal("button");
|
|
64
79
|
el.href = "#";
|
|
@@ -70,12 +85,14 @@ describe("Button", () => {
|
|
|
70
85
|
});
|
|
71
86
|
it("allows label to be toggled", async () => {
|
|
72
87
|
const testNode = document.createTextNode("Button");
|
|
73
|
-
const el = await fixture(
|
|
88
|
+
const el = await fixture(
|
|
89
|
+
html`
|
|
74
90
|
<sp-button>
|
|
75
91
|
${testNode}
|
|
76
92
|
<svg slot="icon"></svg>
|
|
77
93
|
</sp-button>
|
|
78
|
-
`
|
|
94
|
+
`
|
|
95
|
+
);
|
|
79
96
|
await elementUpdated(el);
|
|
80
97
|
const labelTestableEl = el;
|
|
81
98
|
expect(labelTestableEl.hasLabel, "starts with label").to.be.true;
|
|
@@ -87,30 +104,36 @@ describe("Button", () => {
|
|
|
87
104
|
expect(labelTestableEl.hasLabel, "label is returned").to.be.true;
|
|
88
105
|
});
|
|
89
106
|
it("loads with href", async () => {
|
|
90
|
-
const el = await fixture(
|
|
107
|
+
const el = await fixture(
|
|
108
|
+
html`
|
|
91
109
|
<sp-button href="test_url">With Href</sp-button>
|
|
92
|
-
`
|
|
110
|
+
`
|
|
111
|
+
);
|
|
93
112
|
await elementUpdated(el);
|
|
94
113
|
expect(el).to.not.be.undefined;
|
|
95
114
|
expect(el.textContent).to.include("With Href");
|
|
96
115
|
});
|
|
97
116
|
it("loads with href and target", async () => {
|
|
98
|
-
const el = await fixture(
|
|
117
|
+
const el = await fixture(
|
|
118
|
+
html`
|
|
99
119
|
<sp-button href="test_url" target="_blank">
|
|
100
120
|
With Target
|
|
101
121
|
</sp-button>
|
|
102
|
-
`
|
|
122
|
+
`
|
|
123
|
+
);
|
|
103
124
|
await elementUpdated(el);
|
|
104
125
|
expect(el).to.not.be.undefined;
|
|
105
126
|
expect(el.textContent).to.include("With Target");
|
|
106
127
|
});
|
|
107
128
|
it("accepts shit+tab interactions", async () => {
|
|
108
129
|
let focusedCount = 0;
|
|
109
|
-
const el = await fixture(
|
|
130
|
+
const el = await fixture(
|
|
131
|
+
html`
|
|
110
132
|
<sp-button href="test_url" target="_blank">
|
|
111
133
|
With Target
|
|
112
134
|
</sp-button>
|
|
113
|
-
`
|
|
135
|
+
`
|
|
136
|
+
);
|
|
114
137
|
await elementUpdated(el);
|
|
115
138
|
const focusElement = el.focusElement;
|
|
116
139
|
focusElement.addEventListener("focus", () => focusedCount += 1);
|
|
@@ -125,9 +148,11 @@ describe("Button", () => {
|
|
|
125
148
|
});
|
|
126
149
|
it("manages `disabled`", async () => {
|
|
127
150
|
const clickSpy = spy();
|
|
128
|
-
const el = await fixture(
|
|
151
|
+
const el = await fixture(
|
|
152
|
+
html`
|
|
129
153
|
<sp-button @click=${() => clickSpy()}>Button</sp-button>
|
|
130
|
-
`
|
|
154
|
+
`
|
|
155
|
+
);
|
|
131
156
|
await elementUpdated(el);
|
|
132
157
|
el.click();
|
|
133
158
|
await elementUpdated(el);
|
|
@@ -150,11 +175,13 @@ describe("Button", () => {
|
|
|
150
175
|
expect(clickSpy.calledOnce).to.be.true;
|
|
151
176
|
});
|
|
152
177
|
it("manages `aria-disabled`", async () => {
|
|
153
|
-
const el = await fixture(
|
|
178
|
+
const el = await fixture(
|
|
179
|
+
html`
|
|
154
180
|
<sp-button href="test_url" target="_blank">
|
|
155
181
|
With Target
|
|
156
182
|
</sp-button>
|
|
157
|
-
`
|
|
183
|
+
`
|
|
184
|
+
);
|
|
158
185
|
await elementUpdated(el);
|
|
159
186
|
expect(el.hasAttribute("aria-disabled"), "initially not").to.be.false;
|
|
160
187
|
el.disabled = true;
|
|
@@ -165,11 +192,13 @@ describe("Button", () => {
|
|
|
165
192
|
expect(el.hasAttribute("aria-disabled"), "finally not").to.be.false;
|
|
166
193
|
});
|
|
167
194
|
it("manages tabIndex while disabled", async () => {
|
|
168
|
-
const el = await fixture(
|
|
195
|
+
const el = await fixture(
|
|
196
|
+
html`
|
|
169
197
|
<sp-button href="test_url" target="_blank">
|
|
170
198
|
With Target
|
|
171
199
|
</sp-button>
|
|
172
|
-
`
|
|
200
|
+
`
|
|
201
|
+
);
|
|
173
202
|
await elementUpdated(el);
|
|
174
203
|
expect(el.tabIndex).to.equal(0);
|
|
175
204
|
el.disabled = true;
|
|
@@ -184,11 +213,13 @@ describe("Button", () => {
|
|
|
184
213
|
});
|
|
185
214
|
it("swallows `click` interaction when `[disabled]`", async () => {
|
|
186
215
|
const clickSpy = spy();
|
|
187
|
-
const el = await fixture(
|
|
216
|
+
const el = await fixture(
|
|
217
|
+
html`
|
|
188
218
|
<sp-button disabled @click=${() => clickSpy()}>
|
|
189
219
|
Button
|
|
190
220
|
</sp-button>
|
|
191
|
-
`
|
|
221
|
+
`
|
|
222
|
+
);
|
|
192
223
|
await elementUpdated(el);
|
|
193
224
|
expect(clickSpy.callCount).to.equal(0);
|
|
194
225
|
el.click();
|
|
@@ -197,115 +228,139 @@ describe("Button", () => {
|
|
|
197
228
|
});
|
|
198
229
|
it("translates keyboard interactions to click", async () => {
|
|
199
230
|
const clickSpy = spy();
|
|
200
|
-
const el = await fixture(
|
|
231
|
+
const el = await fixture(
|
|
232
|
+
html`
|
|
201
233
|
<sp-button @click=${() => clickSpy()}>Button</sp-button>
|
|
202
|
-
`
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
234
|
+
`
|
|
235
|
+
);
|
|
236
|
+
await elementUpdated(el);
|
|
237
|
+
el.dispatchEvent(
|
|
238
|
+
new KeyboardEvent("keypress", {
|
|
239
|
+
bubbles: true,
|
|
240
|
+
composed: true,
|
|
241
|
+
cancelable: true,
|
|
242
|
+
code: "Enter",
|
|
243
|
+
key: "Enter"
|
|
244
|
+
})
|
|
245
|
+
);
|
|
211
246
|
await elementUpdated(el);
|
|
212
247
|
expect(clickSpy.callCount).to.equal(1);
|
|
213
248
|
clickSpy.resetHistory();
|
|
214
|
-
el.dispatchEvent(
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
249
|
+
el.dispatchEvent(
|
|
250
|
+
new KeyboardEvent("keypress", {
|
|
251
|
+
bubbles: true,
|
|
252
|
+
composed: true,
|
|
253
|
+
cancelable: true,
|
|
254
|
+
code: "NumpadEnter",
|
|
255
|
+
key: "NumpadEnter"
|
|
256
|
+
})
|
|
257
|
+
);
|
|
221
258
|
await elementUpdated(el);
|
|
222
259
|
expect(clickSpy.callCount).to.equal(1);
|
|
223
260
|
clickSpy.resetHistory();
|
|
224
|
-
el.dispatchEvent(
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
261
|
+
el.dispatchEvent(
|
|
262
|
+
new KeyboardEvent("keypress", {
|
|
263
|
+
bubbles: true,
|
|
264
|
+
composed: true,
|
|
265
|
+
cancelable: true,
|
|
266
|
+
code: "Space",
|
|
267
|
+
key: "Space"
|
|
268
|
+
})
|
|
269
|
+
);
|
|
231
270
|
await elementUpdated(el);
|
|
232
271
|
expect(clickSpy.callCount).to.equal(0);
|
|
233
272
|
clickSpy.resetHistory();
|
|
234
|
-
el.dispatchEvent(
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
273
|
+
el.dispatchEvent(
|
|
274
|
+
new KeyboardEvent("keydown", {
|
|
275
|
+
bubbles: true,
|
|
276
|
+
composed: true,
|
|
277
|
+
cancelable: true,
|
|
278
|
+
code: "Space",
|
|
279
|
+
key: "Space"
|
|
280
|
+
})
|
|
281
|
+
);
|
|
282
|
+
el.dispatchEvent(
|
|
283
|
+
new KeyboardEvent("keyup", {
|
|
284
|
+
bubbles: true,
|
|
285
|
+
composed: true,
|
|
286
|
+
cancelable: true,
|
|
287
|
+
code: "Space",
|
|
288
|
+
key: "Space"
|
|
289
|
+
})
|
|
290
|
+
);
|
|
248
291
|
await elementUpdated(el);
|
|
249
292
|
expect(clickSpy.callCount).to.equal(1);
|
|
250
293
|
clickSpy.resetHistory();
|
|
251
|
-
el.dispatchEvent(
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
294
|
+
el.dispatchEvent(
|
|
295
|
+
new KeyboardEvent("keydown", {
|
|
296
|
+
bubbles: true,
|
|
297
|
+
composed: true,
|
|
298
|
+
cancelable: true,
|
|
299
|
+
code: "Space",
|
|
300
|
+
key: "Space"
|
|
301
|
+
})
|
|
302
|
+
);
|
|
303
|
+
el.dispatchEvent(
|
|
304
|
+
new KeyboardEvent("keyup", {
|
|
305
|
+
bubbles: true,
|
|
306
|
+
composed: true,
|
|
307
|
+
cancelable: true,
|
|
308
|
+
code: "KeyG",
|
|
309
|
+
key: "g"
|
|
310
|
+
})
|
|
311
|
+
);
|
|
265
312
|
await elementUpdated(el);
|
|
266
313
|
expect(clickSpy.callCount).to.equal(0);
|
|
267
|
-
el.dispatchEvent(
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
314
|
+
el.dispatchEvent(
|
|
315
|
+
new KeyboardEvent("keyup", {
|
|
316
|
+
bubbles: true,
|
|
317
|
+
composed: true,
|
|
318
|
+
cancelable: true,
|
|
319
|
+
code: "Space",
|
|
320
|
+
key: "Space"
|
|
321
|
+
})
|
|
322
|
+
);
|
|
274
323
|
clickSpy.resetHistory();
|
|
275
|
-
el.dispatchEvent(
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
324
|
+
el.dispatchEvent(
|
|
325
|
+
new KeyboardEvent("keydown", {
|
|
326
|
+
bubbles: true,
|
|
327
|
+
composed: true,
|
|
328
|
+
cancelable: true,
|
|
329
|
+
code: "KeyG",
|
|
330
|
+
key: "g"
|
|
331
|
+
})
|
|
332
|
+
);
|
|
333
|
+
el.dispatchEvent(
|
|
334
|
+
new KeyboardEvent("keyup", {
|
|
335
|
+
bubbles: true,
|
|
336
|
+
composed: true,
|
|
337
|
+
cancelable: true,
|
|
338
|
+
code: "Space",
|
|
339
|
+
key: "Space"
|
|
340
|
+
})
|
|
341
|
+
);
|
|
289
342
|
await elementUpdated(el);
|
|
290
343
|
expect(clickSpy.callCount).to.equal(0);
|
|
291
344
|
});
|
|
292
345
|
it('proxies clicks by "type"', async () => {
|
|
293
346
|
const submitSpy = spy();
|
|
294
347
|
const resetSpy = spy();
|
|
295
|
-
const test = await fixture(
|
|
348
|
+
const test = await fixture(
|
|
349
|
+
html`
|
|
296
350
|
<form
|
|
297
351
|
@submit=${(event) => {
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
352
|
+
event.preventDefault();
|
|
353
|
+
submitSpy();
|
|
354
|
+
}}
|
|
301
355
|
@reset=${(event) => {
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
356
|
+
event.preventDefault();
|
|
357
|
+
resetSpy();
|
|
358
|
+
}}
|
|
305
359
|
>
|
|
306
360
|
<sp-button>Button</sp-button>
|
|
307
361
|
</form>
|
|
308
|
-
`
|
|
362
|
+
`
|
|
363
|
+
);
|
|
309
364
|
const el = test.querySelector("sp-button");
|
|
310
365
|
await elementUpdated(el);
|
|
311
366
|
el.type = "submit";
|
|
@@ -326,9 +381,11 @@ describe("Button", () => {
|
|
|
326
381
|
});
|
|
327
382
|
it("proxies click by [href]", async () => {
|
|
328
383
|
const clickSpy = spy();
|
|
329
|
-
const el = await fixture(
|
|
384
|
+
const el = await fixture(
|
|
385
|
+
html`
|
|
330
386
|
<sp-button href="test_url">With Href</sp-button>
|
|
331
|
-
`
|
|
387
|
+
`
|
|
388
|
+
);
|
|
332
389
|
await elementUpdated(el);
|
|
333
390
|
el.anchorElement.addEventListener("click", (event) => {
|
|
334
391
|
event.preventDefault();
|
|
@@ -341,11 +398,13 @@ describe("Button", () => {
|
|
|
341
398
|
expect(clickSpy.callCount).to.equal(1);
|
|
342
399
|
});
|
|
343
400
|
it('manages "active" while focused', async () => {
|
|
344
|
-
const el = await fixture(
|
|
401
|
+
const el = await fixture(
|
|
402
|
+
html`
|
|
345
403
|
<sp-button label="Button">
|
|
346
404
|
<svg slot="icon"></svg>
|
|
347
405
|
</sp-button>
|
|
348
|
-
`
|
|
406
|
+
`
|
|
407
|
+
);
|
|
349
408
|
await elementUpdated(el);
|
|
350
409
|
el.active = true;
|
|
351
410
|
await elementUpdated(el);
|
|
@@ -355,9 +414,11 @@ describe("Button", () => {
|
|
|
355
414
|
});
|
|
356
415
|
describe("deprecated variants and attributes", () => {
|
|
357
416
|
it("manages [quiet]", async () => {
|
|
358
|
-
const el = await fixture(
|
|
417
|
+
const el = await fixture(
|
|
418
|
+
html`
|
|
359
419
|
<sp-button quiet>Button</sp-button>
|
|
360
|
-
`
|
|
420
|
+
`
|
|
421
|
+
);
|
|
361
422
|
await elementUpdated(el);
|
|
362
423
|
expect(el.treatment).to.equal("outline");
|
|
363
424
|
el.quiet = false;
|
|
@@ -365,24 +426,30 @@ describe("Button", () => {
|
|
|
365
426
|
expect(el.treatment).to.equal("fill");
|
|
366
427
|
});
|
|
367
428
|
it('upgrades [variant="cta"] to [variant="accent"]', async () => {
|
|
368
|
-
const el = await fixture(
|
|
429
|
+
const el = await fixture(
|
|
430
|
+
html`
|
|
369
431
|
<sp-button variant="cta">Button</sp-button>
|
|
370
|
-
`
|
|
432
|
+
`
|
|
433
|
+
);
|
|
371
434
|
await elementUpdated(el);
|
|
372
435
|
expect(el.variant).to.equal("accent");
|
|
373
436
|
});
|
|
374
437
|
it('manages [variant="overBackground"]', async () => {
|
|
375
|
-
const el = await fixture(
|
|
438
|
+
const el = await fixture(
|
|
439
|
+
html`
|
|
376
440
|
<sp-button variant="overBackground">Button</sp-button>
|
|
377
|
-
`
|
|
441
|
+
`
|
|
442
|
+
);
|
|
378
443
|
await elementUpdated(el);
|
|
379
444
|
expect(el.variant).to.equal("white");
|
|
380
445
|
expect(el.treatment).to.equal("outline");
|
|
381
446
|
});
|
|
382
447
|
it('forces [variant="accent"]', async () => {
|
|
383
|
-
const el = await fixture(
|
|
448
|
+
const el = await fixture(
|
|
449
|
+
html`
|
|
384
450
|
<sp-button variant="not-supported">Button</sp-button>
|
|
385
|
-
`
|
|
451
|
+
`
|
|
452
|
+
);
|
|
386
453
|
await elementUpdated(el);
|
|
387
454
|
expect(el.variant).to.equal("accent");
|
|
388
455
|
});
|
package/test/button.test.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["button.test.ts"],
|
|
4
4
|
"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 '@spectrum-web-components/button/sp-button.js';\nimport { Button } from '@spectrum-web-components/button';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\nimport {\n shiftTabEvent,\n testForLitDevWarnings,\n} from '../../../test/testing-helpers.js';\nimport { spy } from 'sinon';\n\ntype TestableButtonType = {\n hasLabel: boolean;\n};\n\ndescribe('Button', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<Button>(\n html`\n <sp-button tabindex=\"0\">Button</sp-button>\n `\n )\n );\n it('loads default', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button tabindex=\"0\">Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n expect(el.textContent).to.include('Button');\n await expect(el).to.be.accessible();\n });\n it('loads default w/ element content', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button label=\"Button\"><svg></svg></sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n await expect(el).to.be.accessible();\n });\n it('loads default w/ an icon', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button label=\"\">\n Button\n <svg slot=\"icon\"></svg>\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n expect(el.textContent).to.include('Button');\n expect(!(el as unknown as { hasIcon: boolean }).hasIcon);\n await expect(el).to.be.accessible();\n });\n it('loads default only icon', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button label=\"Button\">\n <svg slot=\"icon\"></svg>\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n await expect(el).to.be.accessible();\n });\n it('manages \"role\"', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button>Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('button');\n\n el.href = '#';\n\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('link');\n\n el.removeAttribute('href');\n\n await elementUpdated(el);\n expect(el.getAttribute('role')).to.equal('button');\n });\n it('allows label to be toggled', async () => {\n const testNode = document.createTextNode('Button');\n const el = await fixture<Button>(\n html`\n <sp-button>\n ${testNode}\n <svg slot=\"icon\"></svg>\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n\n const labelTestableEl = el as unknown as TestableButtonType;\n\n expect(labelTestableEl.hasLabel, 'starts with label').to.be.true;\n\n testNode.textContent = '';\n\n await elementUpdated(el);\n\n await waitUntil(() => !labelTestableEl.hasLabel, 'label is removed');\n\n testNode.textContent = 'Button';\n\n await elementUpdated(el);\n\n expect(labelTestableEl.hasLabel, 'label is returned').to.be.true;\n });\n it('loads with href', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\">With Href</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n expect(el.textContent).to.include('With Href');\n });\n it('loads with href and target', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\" target=\"_blank\">\n With Target\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el).to.not.be.undefined;\n expect(el.textContent).to.include('With Target');\n });\n it('accepts shit+tab interactions', async () => {\n let focusedCount = 0;\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\" target=\"_blank\">\n With Target\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n\n const focusElement = el.focusElement as HTMLButtonElement;\n focusElement.addEventListener('focus', () => (focusedCount += 1));\n expect(focusedCount).to.equal(0);\n\n el.focus();\n await elementUpdated(el);\n\n expect(focusedCount).to.equal(1);\n\n el.dispatchEvent(shiftTabEvent());\n el.dispatchEvent(new Event('focusin'));\n await elementUpdated(el);\n\n expect(focusedCount).to.equal(1);\n });\n it('manages `disabled`', async () => {\n const clickSpy = spy();\n const el = await fixture<Button>(\n html`\n <sp-button @click=${() => clickSpy()}>Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n el.click();\n await elementUpdated(el);\n expect(clickSpy.calledOnce).to.be.true;\n\n clickSpy.resetHistory();\n el.disabled = true;\n await elementUpdated(el);\n el.click();\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n\n clickSpy.resetHistory();\n await elementUpdated(el);\n el.dispatchEvent(new Event('click', {}));\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n\n clickSpy.resetHistory();\n el.disabled = false;\n el.click();\n await elementUpdated(el);\n expect(clickSpy.calledOnce).to.be.true;\n });\n it('manages `aria-disabled`', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\" target=\"_blank\">\n With Target\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-disabled'), 'initially not').to.be.false;\n\n el.disabled = true;\n await elementUpdated(el);\n\n expect(el.getAttribute('aria-disabled')).to.equal('true');\n\n el.disabled = false;\n await elementUpdated(el);\n\n expect(el.hasAttribute('aria-disabled'), 'finally not').to.be.false;\n });\n it('manages tabIndex while disabled', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\" target=\"_blank\">\n With Target\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.tabIndex).to.equal(0);\n\n el.disabled = true;\n await elementUpdated(el);\n\n expect(el.tabIndex).to.equal(-1);\n\n el.tabIndex = 2;\n await elementUpdated(el);\n\n expect(el.tabIndex).to.equal(-1);\n\n el.disabled = false;\n await elementUpdated(el);\n\n expect(el.tabIndex).to.equal(2);\n });\n it('swallows `click` interaction when `[disabled]`', async () => {\n const clickSpy = spy();\n const el = await fixture<Button>(\n html`\n <sp-button disabled @click=${() => clickSpy()}>\n Button\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n\n el.click();\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n });\n it('translates keyboard interactions to click', async () => {\n const clickSpy = spy();\n const el = await fixture<Button>(\n html`\n <sp-button @click=${() => clickSpy()}>Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n\n el.dispatchEvent(\n new KeyboardEvent('keypress', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Enter',\n key: 'Enter',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(1);\n clickSpy.resetHistory();\n\n el.dispatchEvent(\n new KeyboardEvent('keypress', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'NumpadEnter',\n key: 'NumpadEnter',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(1);\n clickSpy.resetHistory();\n\n el.dispatchEvent(\n new KeyboardEvent('keypress', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n clickSpy.resetHistory();\n\n el.dispatchEvent(\n new KeyboardEvent('keydown', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n el.dispatchEvent(\n new KeyboardEvent('keyup', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(1);\n clickSpy.resetHistory();\n\n el.dispatchEvent(\n new KeyboardEvent('keydown', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n el.dispatchEvent(\n new KeyboardEvent('keyup', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'KeyG',\n key: 'g',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n\n el.dispatchEvent(\n new KeyboardEvent('keyup', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n clickSpy.resetHistory();\n\n el.dispatchEvent(\n new KeyboardEvent('keydown', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'KeyG',\n key: 'g',\n })\n );\n el.dispatchEvent(\n new KeyboardEvent('keyup', {\n bubbles: true,\n composed: true,\n cancelable: true,\n code: 'Space',\n key: 'Space',\n })\n );\n\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(0);\n });\n it('proxies clicks by \"type\"', async () => {\n const submitSpy = spy();\n const resetSpy = spy();\n const test = await fixture<HTMLFormElement>(\n html`\n <form\n @submit=${(event: Event): void => {\n event.preventDefault();\n submitSpy();\n }}\n @reset=${(event: Event): void => {\n event.preventDefault();\n resetSpy();\n }}\n >\n <sp-button>Button</sp-button>\n </form>\n `\n );\n const el = test.querySelector('sp-button') as Button;\n\n await elementUpdated(el);\n el.type = 'submit';\n\n await elementUpdated(el);\n el.click();\n\n expect(submitSpy.callCount).to.equal(1);\n expect(resetSpy.callCount).to.equal(0);\n\n el.type = 'reset';\n\n await elementUpdated(el);\n el.click();\n\n expect(submitSpy.callCount).to.equal(1);\n expect(resetSpy.callCount).to.equal(1);\n\n el.type = 'button';\n\n await elementUpdated(el);\n el.click();\n\n expect(submitSpy.callCount).to.equal(1);\n expect(resetSpy.callCount).to.equal(1);\n });\n it('proxies click by [href]', async () => {\n const clickSpy = spy();\n const el = await fixture<Button>(\n html`\n <sp-button href=\"test_url\">With Href</sp-button>\n `\n );\n\n await elementUpdated(el);\n (\n el as unknown as {\n anchorElement: HTMLAnchorElement;\n }\n ).anchorElement.addEventListener('click', (event: Event): void => {\n event.preventDefault();\n event.stopPropagation();\n clickSpy();\n });\n expect(clickSpy.callCount).to.equal(0);\n\n el.click();\n await elementUpdated(el);\n expect(clickSpy.callCount).to.equal(1);\n });\n it('manages \"active\" while focused', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button label=\"Button\">\n <svg slot=\"icon\"></svg>\n </sp-button>\n `\n );\n\n await elementUpdated(el);\n el.active = true;\n await elementUpdated(el);\n\n el.dispatchEvent(new FocusEvent('focusout'));\n await elementUpdated(el);\n\n expect(el.active).to.be.false;\n });\n describe('deprecated variants and attributes', () => {\n it('manages [quiet]', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button quiet>Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el.treatment).to.equal('outline');\n\n el.quiet = false;\n\n await elementUpdated(el);\n expect(el.treatment).to.equal('fill');\n });\n it('upgrades [variant=\"cta\"] to [variant=\"accent\"]', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button variant=\"cta\">Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('accent');\n });\n it('manages [variant=\"overBackground\"]', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button variant=\"overBackground\">Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('white');\n expect(el.treatment).to.equal('outline');\n });\n it('forces [variant=\"accent\"]', async () => {\n const el = await fixture<Button>(\n html`\n <sp-button variant=\"not-supported\">Button</sp-button>\n `\n );\n\n await elementUpdated(el);\n expect(el.variant).to.equal('accent');\n });\n });\n});\n"],
|
|
5
|
-
"mappings": "AAYA;
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,18 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
import "@spectrum-web-components/button/sp-clear-button.js";
|
|
2
3
|
import { expect, fixture, html } from "@open-wc/testing";
|
|
3
4
|
import { testForLitDevWarnings } from "../../../test/testing-helpers";
|
|
4
5
|
describe("Clear Button", () => {
|
|
5
|
-
testForLitDevWarnings(
|
|
6
|
+
testForLitDevWarnings(
|
|
7
|
+
async () => await fixture(
|
|
8
|
+
html`
|
|
6
9
|
<sp-clear-button size="m" label="Clear"></sp-clear-button>
|
|
7
|
-
`
|
|
10
|
+
`
|
|
11
|
+
)
|
|
12
|
+
);
|
|
8
13
|
["s", "m", "l", "xl"].map((size) => {
|
|
9
14
|
it(`loads - ${size}`, async () => {
|
|
10
|
-
const el = await fixture(
|
|
15
|
+
const el = await fixture(
|
|
16
|
+
html`
|
|
11
17
|
<sp-clear-button
|
|
12
18
|
size=${size}
|
|
13
19
|
label="Clear"
|
|
14
20
|
></sp-clear-button>
|
|
15
|
-
`
|
|
21
|
+
`
|
|
22
|
+
);
|
|
16
23
|
await expect(el).to.be.accessible();
|
|
17
24
|
});
|
|
18
25
|
});
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["clear-button.test.ts"],
|
|
4
4
|
"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 '@spectrum-web-components/button/sp-clear-button.js';\nimport { ClearButton } from '@spectrum-web-components/button';\nimport { expect, fixture, html } from '@open-wc/testing';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers';\n\ndescribe('Clear Button', () => {\n testForLitDevWarnings(\n async () =>\n await fixture<ClearButton>(\n html`\n <sp-clear-button size=\"m\" label=\"Clear\"></sp-clear-button>\n `\n )\n );\n (\n ['s', 'm', 'l', 'xl'] as (\n | 'xxs'\n | 'xs'\n | 's'\n | 'm'\n | 'l'\n | 'xl'\n | 'xxl'\n )[]\n ).map((size) => {\n it(`loads - ${size}`, async () => {\n const el = await fixture<ClearButton>(\n html`\n <sp-clear-button\n size=${size}\n label=\"Clear\"\n ></sp-clear-button>\n `\n );\n\n await expect(el).to.be.accessible();\n });\n });\n});\n"],
|
|
5
|
-
"mappings": "AAYA;
|
|
5
|
+
"mappings": ";AAYA,OAAO;AAEP,SAAS,QAAQ,SAAS,YAAY;AACtC,SAAS,6BAA6B;AAEtC,SAAS,gBAAgB,MAAM;AAC3B;AAAA,IACI,YACI,MAAM;AAAA,MACF;AAAA;AAAA;AAAA,IAGJ;AAAA,EACR;AACA,EACI,CAAC,KAAK,KAAK,KAAK,IAAI,EAStB,IAAI,CAAC,SAAS;AACZ,OAAG,WAAW,QAAQ,YAAY;AAC9B,YAAM,KAAK,MAAM;AAAA,QACb;AAAA;AAAA,+BAEe;AAAA;AAAA;AAAA;AAAA,MAInB;AAEA,YAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,IACtC,CAAC;AAAA,EACL,CAAC;AACL,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|