@spectrum-web-components/menu 0.12.4 → 0.13.0-slim.10
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 +3 -3
- package/test/benchmark/test-basic.js +34 -0
- package/test/benchmark/test-basic.js.map +1 -0
- package/test/menu-group.test-vrt.js +15 -0
- package/test/menu-group.test-vrt.js.map +1 -0
- package/test/menu-group.test.js +226 -0
- package/test/menu-group.test.js.map +1 -0
- package/test/menu-item.test-vrt.js +15 -0
- package/test/menu-item.test-vrt.js.map +1 -0
- package/test/menu-item.test.js +130 -0
- package/test/menu-item.test.js.map +1 -0
- package/test/menu-selects.test.js +537 -0
- package/test/menu-selects.test.js.map +1 -0
- package/test/menu.test-vrt.js +15 -0
- package/test/menu.test-vrt.js.map +1 -0
- package/test/menu.test.js +339 -0
- package/test/menu.test.js.map +1 -0
- package/test/submenu.test-vrt.js +15 -0
- package/test/submenu.test-vrt.js.map +1 -0
- package/test/submenu.test.js +487 -0
- package/test/submenu.test.js.map +1 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spectrum-web-components/menu",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0-slim.10+3481c77b4",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"@spectrum-web-components/base": "^0.5.4",
|
|
55
55
|
"@spectrum-web-components/icon": "^0.11.5",
|
|
56
56
|
"@spectrum-web-components/icons-ui": "^0.8.5",
|
|
57
|
-
"@spectrum-web-components/overlay": "^0.
|
|
57
|
+
"@spectrum-web-components/overlay": "^0.16.0-slim.10+3481c77b4",
|
|
58
58
|
"@spectrum-web-components/shared": "^0.13.6",
|
|
59
59
|
"tslib": "^2.0.0"
|
|
60
60
|
},
|
|
@@ -66,5 +66,5 @@
|
|
|
66
66
|
"sideEffects": [
|
|
67
67
|
"./sp-*.js"
|
|
68
68
|
],
|
|
69
|
-
"gitHead": "
|
|
69
|
+
"gitHead": "3481c77b431e0ccb4b0230a90cc83e770a46e59f"
|
|
70
70
|
}
|
|
@@ -0,0 +1,34 @@
|
|
|
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 '@spectrum-web-components/menu/sp-menu.js';
|
|
13
|
+
import '@spectrum-web-components/menu/sp-menu-item.js';
|
|
14
|
+
import '@spectrum-web-components/menu/sp-menu-group.js';
|
|
15
|
+
import '@spectrum-web-components/menu/sp-menu-divider.js';
|
|
16
|
+
import { html } from 'lit';
|
|
17
|
+
import { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';
|
|
18
|
+
measureFixtureCreation(html `
|
|
19
|
+
<sp-menu selects="multiple">
|
|
20
|
+
<sp-menu-group selects="inherit">
|
|
21
|
+
<span slot="header">Section Heading</span>
|
|
22
|
+
<sp-menu-item>Action 1</sp-menu-item>
|
|
23
|
+
<sp-menu-item>Action 2</sp-menu-item>
|
|
24
|
+
<sp-menu-item>Action 3</sp-menu-item>
|
|
25
|
+
</sp-menu-group>
|
|
26
|
+
<sp-menu-divider></sp-menu-divider>
|
|
27
|
+
<sp-menu-group selects="inherit">
|
|
28
|
+
<span slot="header">Section Heading</span>
|
|
29
|
+
<sp-menu-item>Save</sp-menu-item>
|
|
30
|
+
<sp-menu-item disabled>Download</sp-menu-item>
|
|
31
|
+
</sp-menu-group>
|
|
32
|
+
</sp-menu>
|
|
33
|
+
`);
|
|
34
|
+
//# sourceMappingURL=test-basic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"test-basic.js","sourceRoot":"","sources":["test-basic.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,0CAA0C,CAAC;AAClD,OAAO,+CAA+C,CAAC;AACvD,OAAO,gDAAgD,CAAC;AACxD,OAAO,kDAAkD,CAAC;AAC1D,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAE/E,sBAAsB,CAAC,IAAI,CAAA;;;;;;;;;;;;;;;CAe1B,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 '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport { html } from 'lit';\nimport { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';\n\nmeasureFixtureCreation(html`\n <sp-menu selects=\"multiple\">\n <sp-menu-group selects=\"inherit\">\n <span slot=\"header\">Section Heading</span>\n <sp-menu-item>Action 1</sp-menu-item>\n <sp-menu-item>Action 2</sp-menu-item>\n <sp-menu-item>Action 3</sp-menu-item>\n </sp-menu-group>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-group selects=\"inherit\">\n <span slot=\"header\">Section Heading</span>\n <sp-menu-item>Save</sp-menu-item>\n <sp-menu-item disabled>Download</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n`);\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
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/menu-group.stories.js';
|
|
13
|
+
import { regressVisuals } from '../../../test/visual/test.js';
|
|
14
|
+
regressVisuals('MenuGroupStories', stories);
|
|
15
|
+
//# sourceMappingURL=menu-group.test-vrt.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-group.test-vrt.js","sourceRoot":"","sources":["menu-group.test-vrt.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,KAAK,OAAO,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,cAAc,CAAC,kBAAkB,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/menu-group.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('MenuGroupStories', stories);\n"]}
|
|
@@ -0,0 +1,226 @@
|
|
|
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 '../sp-menu-group.js';
|
|
13
|
+
import '../sp-menu.js';
|
|
14
|
+
import '../sp-menu-item.js';
|
|
15
|
+
import '../sp-menu-divider.js';
|
|
16
|
+
import { elementUpdated, expect, fixture, html, oneEvent, waitUntil, } from '@open-wc/testing';
|
|
17
|
+
const managedItems = (menu) => {
|
|
18
|
+
return menu.childItems.filter((item) => item.menuData.selectionRoot === menu);
|
|
19
|
+
};
|
|
20
|
+
describe('Menu group', () => {
|
|
21
|
+
it('renders', async () => {
|
|
22
|
+
const el = await fixture(html `
|
|
23
|
+
<sp-menu selects="single">
|
|
24
|
+
<sp-menu-group selects="inherit">
|
|
25
|
+
<span slot="header">Section Heading</span>
|
|
26
|
+
<sp-menu-item>Action 1</sp-menu-item>
|
|
27
|
+
<sp-menu-item>Action 2</sp-menu-item>
|
|
28
|
+
<sp-menu-item>Action 3</sp-menu-item>
|
|
29
|
+
</sp-menu-group>
|
|
30
|
+
<sp-menu-divider></sp-menu-divider>
|
|
31
|
+
<sp-menu-group selects="inherit">
|
|
32
|
+
<span slot="header">Section Heading</span>
|
|
33
|
+
<sp-menu-item>Save</sp-menu-item>
|
|
34
|
+
<sp-menu-item disabled>Download</sp-menu-item>
|
|
35
|
+
</sp-menu-group>
|
|
36
|
+
</sp-menu>
|
|
37
|
+
`);
|
|
38
|
+
await waitUntil(() => {
|
|
39
|
+
return managedItems(el).length === 5;
|
|
40
|
+
}, `expected menu group to manage 5 children, received ${managedItems(el).length} of ${el.childItems.length}`);
|
|
41
|
+
await elementUpdated(el);
|
|
42
|
+
await expect(el).to.be.accessible();
|
|
43
|
+
});
|
|
44
|
+
it('manages [slot="header"] content', async () => {
|
|
45
|
+
const el = await fixture(html `
|
|
46
|
+
<sp-menu-group></sp-menu-group>
|
|
47
|
+
`);
|
|
48
|
+
await elementUpdated(el);
|
|
49
|
+
const slot = el.shadowRoot.querySelector('[name="header"');
|
|
50
|
+
const header = document.createElement('span');
|
|
51
|
+
header.textContent = 'Header';
|
|
52
|
+
header.slot = 'header';
|
|
53
|
+
expect(header.id).to.equal('');
|
|
54
|
+
let slotchanged = oneEvent(slot, 'slotchange');
|
|
55
|
+
el.append(header);
|
|
56
|
+
await slotchanged;
|
|
57
|
+
expect(header.id).to.equal(el.headerId);
|
|
58
|
+
slotchanged = oneEvent(slot, 'slotchange');
|
|
59
|
+
header.remove();
|
|
60
|
+
await slotchanged;
|
|
61
|
+
expect(header.id).to.equal('');
|
|
62
|
+
});
|
|
63
|
+
it('handles selects for nested menu groups', async () => {
|
|
64
|
+
const el = await fixture(html `
|
|
65
|
+
<sp-menu selects="single">
|
|
66
|
+
<sp-menu-item selected>First</sp-menu-item>
|
|
67
|
+
<sp-menu-item>Second</sp-menu-item>
|
|
68
|
+
<sp-menu-group id="mg-multi" selects="multiple">
|
|
69
|
+
<sp-menu-item selected>Multi1</sp-menu-item>
|
|
70
|
+
<sp-menu-item>Multi2</sp-menu-item>
|
|
71
|
+
<sp-menu-group id="mg-sub-inherit" selects="inherit">
|
|
72
|
+
<sp-menu-item>SubInherit1</sp-menu-item>
|
|
73
|
+
<sp-menu-item>SubInherit2</sp-menu-item>
|
|
74
|
+
</sp-menu-group>
|
|
75
|
+
</sp-menu-group>
|
|
76
|
+
<sp-menu-group id="mg-single" selects="single">
|
|
77
|
+
<sp-menu-item selected>Single1</sp-menu-item>
|
|
78
|
+
<sp-menu-item>Single2</sp-menu-item>
|
|
79
|
+
</sp-menu-group>
|
|
80
|
+
<sp-menu-group id="mg-none">
|
|
81
|
+
<sp-menu-item>Inherit1</sp-menu-item>
|
|
82
|
+
<sp-menu-item>Inherit2</sp-menu-item>
|
|
83
|
+
</sp-menu-group>
|
|
84
|
+
<sp-menu-group id="mg-inherit" selects="inherit">
|
|
85
|
+
<sp-menu-item>Inherit1</sp-menu-item>
|
|
86
|
+
<sp-menu-item>Inherit2</sp-menu-item>
|
|
87
|
+
</sp-menu-group>
|
|
88
|
+
</sp-menu>
|
|
89
|
+
`);
|
|
90
|
+
await waitUntil(() => managedItems(el).length === 4, `expected outer menu to manage 4 items (2 are inherited), got ${managedItems(el).length}, with ${el.childItems.length} total`);
|
|
91
|
+
await waitUntil(() => el.selectedItems.length === 1, 'expected 1 selected item');
|
|
92
|
+
await elementUpdated(el);
|
|
93
|
+
const firstItem = el.querySelector('sp-menu-item:nth-of-type(1)');
|
|
94
|
+
const secondItem = el.querySelector('sp-menu-item:nth-of-type(2)');
|
|
95
|
+
const multiGroup = el.querySelector('sp-menu-group#mg-multi');
|
|
96
|
+
const multiItem1 = multiGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
97
|
+
const multiItem2 = multiGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
98
|
+
await waitUntil(() => managedItems(multiGroup).length === 4, `selects="#mg-multi should manage 4 items (2 are inherited), received ${managedItems(multiGroup).length}`);
|
|
99
|
+
const singleGroup = el.querySelector('sp-menu-group#mg-single');
|
|
100
|
+
const singleItem1 = singleGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
101
|
+
const singleItem2 = singleGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
102
|
+
await waitUntil(() => managedItems(singleGroup).length === 2, 'selects="#mg-none should manage 4 items (2 are inherited)');
|
|
103
|
+
const noneGroup = el.querySelector('sp-menu-group#mg-none');
|
|
104
|
+
const noneItem1 = noneGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
105
|
+
const noneItem2 = noneGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
106
|
+
await waitUntil(() => managedItems(noneGroup).length === 2, `selects="#mg-none" should manage 2 items, received ${managedItems(noneGroup).length}`);
|
|
107
|
+
const inheritGroup = el.querySelector('sp-menu-group#mg-inherit');
|
|
108
|
+
const inheritItem1 = inheritGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
109
|
+
const inheritItem2 = inheritGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
110
|
+
expect(firstItem.getAttribute('role')).to.equal('menuitemradio');
|
|
111
|
+
expect(secondItem.getAttribute('role')).to.equal('menuitemradio');
|
|
112
|
+
expect(multiItem1.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
113
|
+
expect(multiItem2.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
114
|
+
expect(singleItem1.getAttribute('role')).to.equal('menuitemradio');
|
|
115
|
+
expect(singleItem2.getAttribute('role')).to.equal('menuitemradio');
|
|
116
|
+
expect(noneItem1.getAttribute('role')).to.equal('menuitem');
|
|
117
|
+
expect(noneItem2.getAttribute('role')).to.equal('menuitem');
|
|
118
|
+
expect(inheritItem1.getAttribute('role')).to.equal('menuitemradio');
|
|
119
|
+
expect(inheritItem2.getAttribute('role')).to.equal('menuitemradio');
|
|
120
|
+
await elementUpdated(firstItem);
|
|
121
|
+
expect(singleItem1.selected).to.be.true;
|
|
122
|
+
expect(firstItem.selected).to.be.true;
|
|
123
|
+
expect(secondItem.selected, 'second item not selected').to.be.false;
|
|
124
|
+
expect(el.value).to.equal('First');
|
|
125
|
+
expect(el.selectedItems.length).to.equal(1);
|
|
126
|
+
expect(firstItem.getAttribute('aria-checked')).to.equal('true');
|
|
127
|
+
expect(secondItem.getAttribute('aria-checked')).to.equal('false');
|
|
128
|
+
secondItem.click();
|
|
129
|
+
await elementUpdated(el);
|
|
130
|
+
await elementUpdated(firstItem);
|
|
131
|
+
await elementUpdated(secondItem);
|
|
132
|
+
expect(firstItem.selected, 'first item not selected').to.be.false;
|
|
133
|
+
expect(secondItem.selected).to.be.true;
|
|
134
|
+
expect(firstItem.getAttribute('aria-checked')).to.equal('false');
|
|
135
|
+
expect(secondItem.getAttribute('aria-checked')).to.equal('true');
|
|
136
|
+
expect(el.value).to.equal('Second');
|
|
137
|
+
expect(el.selectedItems.length).to.equal(1);
|
|
138
|
+
inheritItem1.click();
|
|
139
|
+
await elementUpdated(el);
|
|
140
|
+
await elementUpdated(inheritItem1);
|
|
141
|
+
await elementUpdated(secondItem);
|
|
142
|
+
expect(secondItem.selected, 'second item not selected again').to.be
|
|
143
|
+
.false;
|
|
144
|
+
expect(inheritItem1.selected).to.be.true;
|
|
145
|
+
expect(secondItem.getAttribute('aria-checked')).to.equal('false');
|
|
146
|
+
expect(inheritItem1.getAttribute('aria-checked')).to.equal('true');
|
|
147
|
+
expect(el.value).to.equal('Inherit1');
|
|
148
|
+
expect(el.selectedItems.length).to.equal(1);
|
|
149
|
+
noneItem2.click();
|
|
150
|
+
await elementUpdated(noneGroup);
|
|
151
|
+
await elementUpdated(noneItem2);
|
|
152
|
+
expect(inheritItem1.selected).to.be.true;
|
|
153
|
+
expect(noneItem2.selected, 'none item not selected').to.be.false;
|
|
154
|
+
expect(el.value).to.equal('Inherit1');
|
|
155
|
+
expect(el.selectedItems.length).to.equal(1);
|
|
156
|
+
singleItem2.click();
|
|
157
|
+
await elementUpdated(singleGroup);
|
|
158
|
+
await elementUpdated(singleItem1);
|
|
159
|
+
await elementUpdated(singleItem2);
|
|
160
|
+
expect(singleItem1.selected, 'first item not selected').to.be.false;
|
|
161
|
+
expect(singleItem2.selected).to.be.true;
|
|
162
|
+
expect(inheritItem1.selected).to.be.true;
|
|
163
|
+
expect(singleItem1.getAttribute('aria-checked')).to.equal('false');
|
|
164
|
+
expect(singleItem2.getAttribute('aria-checked')).to.equal('true');
|
|
165
|
+
expect(el.value).to.equal('Inherit1');
|
|
166
|
+
expect(el.selectedItems.length).to.equal(1);
|
|
167
|
+
//expect(singleGroup.value).to.equal('Inherit1')
|
|
168
|
+
expect(singleGroup.selectedItems.length).to.equal(1);
|
|
169
|
+
multiItem2.click();
|
|
170
|
+
await elementUpdated(el);
|
|
171
|
+
await elementUpdated(multiItem2);
|
|
172
|
+
expect(multiItem1.selected).to.be.true;
|
|
173
|
+
expect(multiItem2.selected).to.be.true;
|
|
174
|
+
expect(inheritItem1.selected).to.be.true;
|
|
175
|
+
expect(multiItem1.getAttribute('aria-checked')).to.equal('true');
|
|
176
|
+
expect(multiItem2.getAttribute('aria-checked')).to.equal('true');
|
|
177
|
+
//expect(multiGroup.value).to.equal('Inherit1')
|
|
178
|
+
expect(multiGroup.selectedItems.length).to.equal(2);
|
|
179
|
+
});
|
|
180
|
+
it('handles changing managed items for selects changes', async () => {
|
|
181
|
+
const el = await fixture(html `
|
|
182
|
+
<sp-menu selects="multiple" value-separator="--">
|
|
183
|
+
<sp-menu-item selected>First</sp-menu-item>
|
|
184
|
+
<sp-menu-item>Second</sp-menu-item>
|
|
185
|
+
<sp-menu-group id="mg-inherit" selects="inherit">
|
|
186
|
+
<sp-menu-item>Inherit1</sp-menu-item>
|
|
187
|
+
<sp-menu-item>Inherit2</sp-menu-item>
|
|
188
|
+
<sp-menu-group id="mg-sub-inherit" selects="inherit">
|
|
189
|
+
<sp-menu-item>SubInherit1</sp-menu-item>
|
|
190
|
+
<sp-menu-item selected>SubInherit2</sp-menu-item>
|
|
191
|
+
</sp-menu-group>
|
|
192
|
+
</sp-menu-group>
|
|
193
|
+
</sp-menu>
|
|
194
|
+
`);
|
|
195
|
+
await waitUntil(() => managedItems(el).length == 6, `expected outer menu to manage 6 items, manages ${managedItems(el).length}`);
|
|
196
|
+
await waitUntil(() => el.selectedItems.length == 2, 'expected 2 selected item');
|
|
197
|
+
await elementUpdated(el);
|
|
198
|
+
const inheritGroup = el.querySelector('sp-menu-group#mg-inherit');
|
|
199
|
+
const inheritItem1 = inheritGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
200
|
+
const inheritItem2 = inheritGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
201
|
+
const subInheritGroup = el.querySelector('sp-menu-group#mg-sub-inherit');
|
|
202
|
+
const subInheritItem1 = subInheritGroup.querySelector('sp-menu-item:nth-of-type(1)');
|
|
203
|
+
const subInheritItem2 = subInheritGroup.querySelector('sp-menu-item:nth-of-type(2)');
|
|
204
|
+
expect(inheritItem1.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
205
|
+
expect(inheritItem2.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
206
|
+
expect(subInheritItem1.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
207
|
+
expect(subInheritItem2.getAttribute('role')).to.equal('menuitemcheckbox');
|
|
208
|
+
expect(el.value).to.equal('First--SubInherit2');
|
|
209
|
+
expect(el.selectedItems.length).to.equal(2);
|
|
210
|
+
inheritGroup.setAttribute('selects', 'single');
|
|
211
|
+
await elementUpdated(inheritGroup);
|
|
212
|
+
await elementUpdated(el);
|
|
213
|
+
await waitUntil(() => {
|
|
214
|
+
return managedItems(inheritGroup).length === 4;
|
|
215
|
+
}, `expected new single sub-group to manage 4 items, received ${managedItems(inheritGroup).length} because "selects === ${inheritGroup.selects}`);
|
|
216
|
+
await waitUntil(() => managedItems(el).length === 2, `expected outer menu to manage 2 items with none inherited, received ${managedItems(el).length}`);
|
|
217
|
+
expect(inheritGroup.value).to.equal('SubInherit2');
|
|
218
|
+
expect(inheritGroup.selectedItems.length).to.equal(1);
|
|
219
|
+
expect(el.value).to.equal('First');
|
|
220
|
+
expect(inheritItem1.getAttribute('role')).to.equal('menuitemradio');
|
|
221
|
+
expect(inheritItem2.getAttribute('role')).to.equal('menuitemradio');
|
|
222
|
+
expect(subInheritItem1.getAttribute('role')).to.equal('menuitemradio');
|
|
223
|
+
expect(subInheritItem2.getAttribute('role')).to.equal('menuitemradio');
|
|
224
|
+
});
|
|
225
|
+
});
|
|
226
|
+
//# sourceMappingURL=menu-group.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-group.test.js","sourceRoot":"","sources":["menu-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*/\nimport '../sp-menu-group.js';\nimport '../sp-menu.js';\nimport '../sp-menu-item.js';\nimport '../sp-menu-divider.js';\nimport { Menu, MenuGroup, MenuItem } from '../';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\n\nconst managedItems = (menu: Menu | MenuGroup): MenuItem[] => {\n return menu.childItems.filter(\n (item: MenuItem) => item.menuData.selectionRoot === menu\n );\n};\n\ndescribe('Menu group', () => {\n it('renders', async () => {\n const el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-group selects=\"inherit\">\n <span slot=\"header\">Section Heading</span>\n <sp-menu-item>Action 1</sp-menu-item>\n <sp-menu-item>Action 2</sp-menu-item>\n <sp-menu-item>Action 3</sp-menu-item>\n </sp-menu-group>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-group selects=\"inherit\">\n <span slot=\"header\">Section Heading</span>\n <sp-menu-item>Save</sp-menu-item>\n <sp-menu-item disabled>Download</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n\n await waitUntil(() => {\n return managedItems(el).length === 5;\n }, `expected menu group to manage 5 children, received ${managedItems(el).length} of ${el.childItems.length}`);\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('manages [slot=\"header\"] content', async () => {\n const el = await fixture<MenuGroup>(\n html`\n <sp-menu-group></sp-menu-group>\n `\n );\n await elementUpdated(el);\n const slot = el.shadowRoot.querySelector(\n '[name=\"header\"'\n ) as HTMLSlotElement;\n const header = document.createElement('span');\n header.textContent = 'Header';\n header.slot = 'header';\n expect(header.id).to.equal('');\n let slotchanged = oneEvent(slot, 'slotchange');\n el.append(header);\n await slotchanged;\n expect(header.id).to.equal(\n (el as unknown as { headerId: string }).headerId\n );\n\n slotchanged = oneEvent(slot, 'slotchange');\n header.remove();\n await slotchanged;\n expect(header.id).to.equal('');\n });\n it('handles selects for nested menu groups', async () => {\n const el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-item selected>First</sp-menu-item>\n <sp-menu-item>Second</sp-menu-item>\n <sp-menu-group id=\"mg-multi\" selects=\"multiple\">\n <sp-menu-item selected>Multi1</sp-menu-item>\n <sp-menu-item>Multi2</sp-menu-item>\n <sp-menu-group id=\"mg-sub-inherit\" selects=\"inherit\">\n <sp-menu-item>SubInherit1</sp-menu-item>\n <sp-menu-item>SubInherit2</sp-menu-item>\n </sp-menu-group>\n </sp-menu-group>\n <sp-menu-group id=\"mg-single\" selects=\"single\">\n <sp-menu-item selected>Single1</sp-menu-item>\n <sp-menu-item>Single2</sp-menu-item>\n </sp-menu-group>\n <sp-menu-group id=\"mg-none\">\n <sp-menu-item>Inherit1</sp-menu-item>\n <sp-menu-item>Inherit2</sp-menu-item>\n </sp-menu-group>\n <sp-menu-group id=\"mg-inherit\" selects=\"inherit\">\n <sp-menu-item>Inherit1</sp-menu-item>\n <sp-menu-item>Inherit2</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n\n await waitUntil(\n () => managedItems(el).length === 4,\n `expected outer menu to manage 4 items (2 are inherited), got ${\n managedItems(el).length\n }, with ${el.childItems.length} total`\n );\n await waitUntil(\n () => el.selectedItems.length === 1,\n 'expected 1 selected item'\n );\n await elementUpdated(el);\n\n const firstItem = el.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n\n const secondItem = el.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const multiGroup = el.querySelector(\n 'sp-menu-group#mg-multi'\n ) as MenuGroup;\n const multiItem1 = multiGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const multiItem2 = multiGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n await waitUntil(\n () => managedItems(multiGroup).length === 4,\n `selects=\"#mg-multi should manage 4 items (2 are inherited), received ${\n managedItems(multiGroup).length\n }`\n );\n\n const singleGroup = el.querySelector(\n 'sp-menu-group#mg-single'\n ) as MenuGroup;\n\n const singleItem1 = singleGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const singleItem2 = singleGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n await waitUntil(\n () => managedItems(singleGroup).length === 2,\n 'selects=\"#mg-none should manage 4 items (2 are inherited)'\n );\n\n const noneGroup = el.querySelector(\n 'sp-menu-group#mg-none'\n ) as MenuGroup;\n const noneItem1 = noneGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const noneItem2 = noneGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n await waitUntil(\n () => managedItems(noneGroup).length === 2,\n `selects=\"#mg-none\" should manage 2 items, received ${\n managedItems(noneGroup).length\n }`\n );\n\n const inheritGroup = el.querySelector(\n 'sp-menu-group#mg-inherit'\n ) as MenuGroup;\n const inheritItem1 = inheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const inheritItem2 = inheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n expect(firstItem.getAttribute('role')).to.equal('menuitemradio');\n expect(secondItem.getAttribute('role')).to.equal('menuitemradio');\n expect(multiItem1.getAttribute('role')).to.equal('menuitemcheckbox');\n expect(multiItem2.getAttribute('role')).to.equal('menuitemcheckbox');\n expect(singleItem1.getAttribute('role')).to.equal('menuitemradio');\n expect(singleItem2.getAttribute('role')).to.equal('menuitemradio');\n expect(noneItem1.getAttribute('role')).to.equal('menuitem');\n expect(noneItem2.getAttribute('role')).to.equal('menuitem');\n expect(inheritItem1.getAttribute('role')).to.equal('menuitemradio');\n expect(inheritItem2.getAttribute('role')).to.equal('menuitemradio');\n\n await elementUpdated(firstItem);\n expect(singleItem1.selected).to.be.true;\n expect(firstItem.selected).to.be.true;\n expect(secondItem.selected, 'second item not selected').to.be.false;\n expect(el.value).to.equal('First');\n expect(el.selectedItems.length).to.equal(1);\n\n expect(firstItem.getAttribute('aria-checked')).to.equal('true');\n expect(secondItem.getAttribute('aria-checked')).to.equal('false');\n\n secondItem.click();\n await elementUpdated(el);\n await elementUpdated(firstItem);\n await elementUpdated(secondItem);\n expect(firstItem.selected, 'first item not selected').to.be.false;\n expect(secondItem.selected).to.be.true;\n expect(firstItem.getAttribute('aria-checked')).to.equal('false');\n expect(secondItem.getAttribute('aria-checked')).to.equal('true');\n expect(el.value).to.equal('Second');\n expect(el.selectedItems.length).to.equal(1);\n\n inheritItem1.click();\n await elementUpdated(el);\n await elementUpdated(inheritItem1);\n await elementUpdated(secondItem);\n expect(secondItem.selected, 'second item not selected again').to.be\n .false;\n expect(inheritItem1.selected).to.be.true;\n expect(secondItem.getAttribute('aria-checked')).to.equal('false');\n expect(inheritItem1.getAttribute('aria-checked')).to.equal('true');\n expect(el.value).to.equal('Inherit1');\n expect(el.selectedItems.length).to.equal(1);\n\n noneItem2.click();\n await elementUpdated(noneGroup);\n await elementUpdated(noneItem2);\n expect(inheritItem1.selected).to.be.true;\n expect(noneItem2.selected, 'none item not selected').to.be.false;\n expect(el.value).to.equal('Inherit1');\n expect(el.selectedItems.length).to.equal(1);\n\n singleItem2.click();\n await elementUpdated(singleGroup);\n await elementUpdated(singleItem1);\n await elementUpdated(singleItem2);\n expect(singleItem1.selected, 'first item not selected').to.be.false;\n expect(singleItem2.selected).to.be.true;\n expect(inheritItem1.selected).to.be.true;\n expect(singleItem1.getAttribute('aria-checked')).to.equal('false');\n expect(singleItem2.getAttribute('aria-checked')).to.equal('true');\n expect(el.value).to.equal('Inherit1');\n expect(el.selectedItems.length).to.equal(1);\n //expect(singleGroup.value).to.equal('Inherit1')\n expect(singleGroup.selectedItems.length).to.equal(1);\n\n multiItem2.click();\n await elementUpdated(el);\n await elementUpdated(multiItem2);\n expect(multiItem1.selected).to.be.true;\n expect(multiItem2.selected).to.be.true;\n expect(inheritItem1.selected).to.be.true;\n expect(multiItem1.getAttribute('aria-checked')).to.equal('true');\n expect(multiItem2.getAttribute('aria-checked')).to.equal('true');\n //expect(multiGroup.value).to.equal('Inherit1')\n expect(multiGroup.selectedItems.length).to.equal(2);\n });\n\n it('handles changing managed items for selects changes', async () => {\n const el = await fixture<Menu>(\n html`\n <sp-menu selects=\"multiple\" value-separator=\"--\">\n <sp-menu-item selected>First</sp-menu-item>\n <sp-menu-item>Second</sp-menu-item>\n <sp-menu-group id=\"mg-inherit\" selects=\"inherit\">\n <sp-menu-item>Inherit1</sp-menu-item>\n <sp-menu-item>Inherit2</sp-menu-item>\n <sp-menu-group id=\"mg-sub-inherit\" selects=\"inherit\">\n <sp-menu-item>SubInherit1</sp-menu-item>\n <sp-menu-item selected>SubInherit2</sp-menu-item>\n </sp-menu-group>\n </sp-menu-group>\n </sp-menu>\n `\n );\n\n await waitUntil(\n () => managedItems(el).length == 6,\n `expected outer menu to manage 6 items, manages ${\n managedItems(el).length\n }`\n );\n await waitUntil(\n () => el.selectedItems.length == 2,\n 'expected 2 selected item'\n );\n await elementUpdated(el);\n\n const inheritGroup = el.querySelector(\n 'sp-menu-group#mg-inherit'\n ) as MenuGroup;\n const inheritItem1 = inheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const inheritItem2 = inheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n const subInheritGroup = el.querySelector(\n 'sp-menu-group#mg-sub-inherit'\n ) as MenuGroup;\n const subInheritItem1 = subInheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(1)'\n ) as MenuItem;\n const subInheritItem2 = subInheritGroup.querySelector(\n 'sp-menu-item:nth-of-type(2)'\n ) as MenuItem;\n\n expect(inheritItem1.getAttribute('role')).to.equal('menuitemcheckbox');\n expect(inheritItem2.getAttribute('role')).to.equal('menuitemcheckbox');\n expect(subInheritItem1.getAttribute('role')).to.equal(\n 'menuitemcheckbox'\n );\n expect(subInheritItem2.getAttribute('role')).to.equal(\n 'menuitemcheckbox'\n );\n expect(el.value).to.equal('First--SubInherit2');\n expect(el.selectedItems.length).to.equal(2);\n inheritGroup.setAttribute('selects', 'single');\n\n await elementUpdated(inheritGroup);\n await elementUpdated(el);\n\n await waitUntil(() => {\n return managedItems(inheritGroup).length === 4;\n }, `expected new single sub-group to manage 4 items, received ${managedItems(inheritGroup).length} because \"selects === ${inheritGroup.selects}`);\n\n await waitUntil(\n () => managedItems(el).length === 2,\n `expected outer menu to manage 2 items with none inherited, received ${\n managedItems(el).length\n }`\n );\n expect(inheritGroup.value).to.equal('SubInherit2');\n expect(inheritGroup.selectedItems.length).to.equal(1);\n expect(el.value).to.equal('First');\n expect(inheritItem1.getAttribute('role')).to.equal('menuitemradio');\n expect(inheritItem2.getAttribute('role')).to.equal('menuitemradio');\n expect(subInheritItem1.getAttribute('role')).to.equal('menuitemradio');\n expect(subInheritItem2.getAttribute('role')).to.equal('menuitemradio');\n });\n});\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
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/menu-item.stories.js';
|
|
13
|
+
import { regressVisuals } from '../../../test/visual/test.js';
|
|
14
|
+
regressVisuals('MenuItemStories', stories);
|
|
15
|
+
//# sourceMappingURL=menu-item.test-vrt.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-item.test-vrt.js","sourceRoot":"","sources":["menu-item.test-vrt.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,KAAK,OAAO,MAAM,iCAAiC,CAAC;AAC3D,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAE9D,cAAc,CAAC,iBAAiB,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/menu-item.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\n\nregressVisuals('MenuItemStories', stories);\n"]}
|
|
@@ -0,0 +1,130 @@
|
|
|
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 '../sp-menu.js';
|
|
13
|
+
import '../sp-menu-item.js';
|
|
14
|
+
import '@spectrum-web-components/menu';
|
|
15
|
+
import { elementUpdated, expect, fixture, html, waitUntil, } from '@open-wc/testing';
|
|
16
|
+
import { spy } from 'sinon';
|
|
17
|
+
import { sendMouse } from '../../../test/plugins/browser.js';
|
|
18
|
+
describe('Menu item', () => {
|
|
19
|
+
it('renders', async () => {
|
|
20
|
+
const el = await fixture(html `
|
|
21
|
+
<sp-menu>
|
|
22
|
+
<sp-menu-item selected>Selected</sp-menu-item>
|
|
23
|
+
</sp-menu>
|
|
24
|
+
`);
|
|
25
|
+
await waitUntil(() => el.childItems.length == 1, 'expected menu group to manage 1 child');
|
|
26
|
+
await elementUpdated(el);
|
|
27
|
+
await expect(el).to.be.accessible();
|
|
28
|
+
});
|
|
29
|
+
it('can be disabled', async () => {
|
|
30
|
+
const el = await fixture(html `
|
|
31
|
+
<sp-menu selects="single">
|
|
32
|
+
<sp-menu-item selected label="This is not disabled">
|
|
33
|
+
Selected
|
|
34
|
+
</sp-menu-item>
|
|
35
|
+
<sp-menu-item disabled>Disabled</sp-menu-item>
|
|
36
|
+
</sp-menu>
|
|
37
|
+
`);
|
|
38
|
+
await elementUpdated(el);
|
|
39
|
+
expect(el.value).to.equal('Selected');
|
|
40
|
+
const disabled = el.querySelector('[disabled]');
|
|
41
|
+
const boundingRect = disabled.getBoundingClientRect();
|
|
42
|
+
sendMouse({
|
|
43
|
+
steps: [
|
|
44
|
+
{
|
|
45
|
+
type: 'move',
|
|
46
|
+
position: [
|
|
47
|
+
boundingRect.x + boundingRect.width / 2,
|
|
48
|
+
boundingRect.y + boundingRect.height / 2,
|
|
49
|
+
],
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
type: 'down',
|
|
53
|
+
},
|
|
54
|
+
{
|
|
55
|
+
type: 'up',
|
|
56
|
+
},
|
|
57
|
+
],
|
|
58
|
+
});
|
|
59
|
+
await elementUpdated(el);
|
|
60
|
+
expect(el.value).to.equal('Selected');
|
|
61
|
+
disabled.click();
|
|
62
|
+
await elementUpdated(el);
|
|
63
|
+
expect(el.value).to.equal('Selected');
|
|
64
|
+
disabled.dispatchEvent(new Event('click', {
|
|
65
|
+
bubbles: true,
|
|
66
|
+
composed: true,
|
|
67
|
+
}));
|
|
68
|
+
await elementUpdated(el);
|
|
69
|
+
expect(el.value).to.equal('Selected');
|
|
70
|
+
});
|
|
71
|
+
it('proxies `click()`', async () => {
|
|
72
|
+
const clickTargetSpy = spy();
|
|
73
|
+
const el = await fixture(html `
|
|
74
|
+
<sp-menu
|
|
75
|
+
@click=${(event) => {
|
|
76
|
+
clickTargetSpy(event.composedPath()[0]);
|
|
77
|
+
event.stopPropagation();
|
|
78
|
+
event.preventDefault();
|
|
79
|
+
}}
|
|
80
|
+
>
|
|
81
|
+
<sp-menu-item
|
|
82
|
+
href="https://opensource.adobe.com/spectrum-web-components"
|
|
83
|
+
>
|
|
84
|
+
Selected Text
|
|
85
|
+
</sp-menu-item>
|
|
86
|
+
</sp-menu>
|
|
87
|
+
`);
|
|
88
|
+
await elementUpdated(el);
|
|
89
|
+
const item = el.querySelector('sp-menu-item');
|
|
90
|
+
const { anchorElement } = item;
|
|
91
|
+
item.anchorElement.dispatchEvent(new FocusEvent('focus'));
|
|
92
|
+
await elementUpdated(item);
|
|
93
|
+
expect(el === document.activeElement).to.be.true;
|
|
94
|
+
item.click();
|
|
95
|
+
expect(clickTargetSpy.calledWith(anchorElement)).to.be.true;
|
|
96
|
+
});
|
|
97
|
+
it('value attribute', async () => {
|
|
98
|
+
const el = await fixture(html `
|
|
99
|
+
<sp-menu-item value="selected" selected>
|
|
100
|
+
Selected Text
|
|
101
|
+
</sp-menu-item>
|
|
102
|
+
`);
|
|
103
|
+
expect(el.itemText).to.equal('Selected Text');
|
|
104
|
+
expect(el.value).to.equal('selected');
|
|
105
|
+
});
|
|
106
|
+
it('no value attribute', async () => {
|
|
107
|
+
const el = await fixture(html `
|
|
108
|
+
<sp-menu-item selected>Selected Text</sp-menu-item>
|
|
109
|
+
`);
|
|
110
|
+
expect(el.itemText).to.equal('Selected Text');
|
|
111
|
+
expect(el.value).to.equal('Selected Text');
|
|
112
|
+
});
|
|
113
|
+
it('value property', async () => {
|
|
114
|
+
const el = await fixture(html `
|
|
115
|
+
<sp-menu-item selected>Selected Text</sp-menu-item>
|
|
116
|
+
`);
|
|
117
|
+
expect(el.itemText).to.equal('Selected Text');
|
|
118
|
+
expect(el.value).to.equal('Selected Text');
|
|
119
|
+
expect(el.hasAttribute('value')).to.be.false;
|
|
120
|
+
el.value = 'Selected Text';
|
|
121
|
+
await elementUpdated(el);
|
|
122
|
+
expect(el.value).to.equal('Selected Text');
|
|
123
|
+
expect(el.getAttribute('value')).to.equal('Selected Text');
|
|
124
|
+
el.value = '';
|
|
125
|
+
await elementUpdated(el);
|
|
126
|
+
expect(el.value).to.equal('Selected Text');
|
|
127
|
+
expect(el.hasAttribute('value')).to.be.false;
|
|
128
|
+
});
|
|
129
|
+
});
|
|
130
|
+
//# sourceMappingURL=menu-item.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"menu-item.test.js","sourceRoot":"","sources":["menu-item.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 '../sp-menu.js';\nimport '../sp-menu-item.js';\nimport { MenuItem } from '../';\nimport '@spectrum-web-components/menu';\nimport { Menu } from '@spectrum-web-components/menu';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n waitUntil,\n} from '@open-wc/testing';\nimport { spy } from 'sinon';\nimport { sendMouse } from '../../../test/plugins/browser.js';\n\ndescribe('Menu item', () => {\n it('renders', async () => {\n const el = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-item selected>Selected</sp-menu-item>\n </sp-menu>\n `\n );\n\n await waitUntil(\n () => el.childItems.length == 1,\n 'expected menu group to manage 1 child'\n );\n await elementUpdated(el);\n\n await expect(el).to.be.accessible();\n });\n it('can be disabled', async () => {\n const el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-item selected label=\"This is not disabled\">\n Selected\n </sp-menu-item>\n <sp-menu-item disabled>Disabled</sp-menu-item>\n </sp-menu>\n `\n );\n await elementUpdated(el);\n expect(el.value).to.equal('Selected');\n\n const disabled = el.querySelector('[disabled]') as MenuItem;\n const boundingRect = disabled.getBoundingClientRect();\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRect.x + boundingRect.width / 2,\n boundingRect.y + boundingRect.height / 2,\n ],\n },\n {\n type: 'down',\n },\n {\n type: 'up',\n },\n ],\n });\n await elementUpdated(el);\n expect(el.value).to.equal('Selected');\n\n disabled.click();\n await elementUpdated(el);\n expect(el.value).to.equal('Selected');\n\n disabled.dispatchEvent(\n new Event('click', {\n bubbles: true,\n composed: true,\n })\n );\n await elementUpdated(el);\n expect(el.value).to.equal('Selected');\n });\n it('proxies `click()`', async () => {\n const clickTargetSpy = spy();\n const el = await fixture<Menu>(\n html`\n <sp-menu\n @click=${(event: Event) => {\n clickTargetSpy(\n event.composedPath()[0] as HTMLAnchorElement\n );\n event.stopPropagation();\n event.preventDefault();\n }}\n >\n <sp-menu-item\n href=\"https://opensource.adobe.com/spectrum-web-components\"\n >\n Selected Text\n </sp-menu-item>\n </sp-menu>\n `\n );\n\n await elementUpdated(el);\n\n const item = el.querySelector('sp-menu-item') as MenuItem;\n const { anchorElement } = item as unknown as {\n anchorElement: HTMLAnchorElement;\n };\n (\n item as unknown as { anchorElement: HTMLAnchorElement }\n ).anchorElement.dispatchEvent(new FocusEvent('focus'));\n\n await elementUpdated(item);\n expect(el === document.activeElement).to.be.true;\n item.click();\n\n expect(clickTargetSpy.calledWith(anchorElement)).to.be.true;\n });\n it('value attribute', async () => {\n const el = await fixture<MenuItem>(\n html`\n <sp-menu-item value=\"selected\" selected>\n Selected Text\n </sp-menu-item>\n `\n );\n expect(el.itemText).to.equal('Selected Text');\n expect(el.value).to.equal('selected');\n });\n it('no value attribute', async () => {\n const el = await fixture<MenuItem>(\n html`\n <sp-menu-item selected>Selected Text</sp-menu-item>\n `\n );\n expect(el.itemText).to.equal('Selected Text');\n expect(el.value).to.equal('Selected Text');\n });\n it('value property', async () => {\n const el = await fixture<MenuItem>(\n html`\n <sp-menu-item selected>Selected Text</sp-menu-item>\n `\n );\n expect(el.itemText).to.equal('Selected Text');\n expect(el.value).to.equal('Selected Text');\n expect(el.hasAttribute('value')).to.be.false;\n\n el.value = 'Selected Text';\n await elementUpdated(el);\n\n expect(el.value).to.equal('Selected Text');\n expect(el.getAttribute('value')).to.equal('Selected Text');\n\n el.value = '';\n await elementUpdated(el);\n\n expect(el.value).to.equal('Selected Text');\n expect(el.hasAttribute('value')).to.be.false;\n });\n});\n"]}
|