@spectrum-web-components/menu 0.36.0 → 0.37.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/custom-elements.json +451 -155
- package/package.json +9 -9
- package/src/Menu.d.ts +16 -6
- package/src/Menu.dev.js +178 -64
- package/src/Menu.dev.js.map +2 -2
- package/src/Menu.js +7 -3
- package/src/Menu.js.map +3 -3
- package/src/MenuGroup.d.ts +0 -2
- package/src/MenuGroup.dev.js +8 -12
- package/src/MenuGroup.dev.js.map +2 -2
- package/src/MenuGroup.js +3 -5
- package/src/MenuGroup.js.map +3 -3
- package/src/MenuItem.d.ts +29 -23
- package/src/MenuItem.dev.js +204 -212
- package/src/MenuItem.dev.js.map +3 -3
- package/src/MenuItem.js +35 -18
- package/src/MenuItem.js.map +3 -3
- package/src/menu-item.css.dev.js +1 -1
- package/src/menu-item.css.dev.js.map +1 -1
- package/src/menu-item.css.js +1 -1
- package/src/menu-item.css.js.map +1 -1
- package/src/menu.css.dev.js +1 -1
- package/src/menu.css.dev.js.map +1 -1
- package/src/menu.css.js +1 -1
- package/src/menu.css.js.map +1 -1
- package/stories/index.js +4 -0
- package/stories/index.js.map +2 -2
- package/stories/submenu.stories.js +117 -104
- package/stories/submenu.stories.js.map +3 -3
- package/test/menu-group.test.js +14 -1
- package/test/menu-group.test.js.map +2 -2
- package/test/menu-item.test.js +22 -0
- package/test/menu-item.test.js.map +2 -2
- package/test/menu-selects.test.js +3 -1
- package/test/menu-selects.test.js.map +2 -2
- package/test/menu.test.js +9 -1
- package/test/menu.test.js.map +2 -2
- package/test/submenu.test.js +208 -84
- package/test/submenu.test.js.map +2 -2
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["submenu.stories.ts"],
|
|
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 { html, render, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/action-menu/sp-action-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport { openOverlay, VirtualTrigger } from '@spectrum-web-components/overlay';\nimport type { Popover } from '@spectrum-web-components/popover';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-show-menu.js';\nimport type { ActionMenu } from '@spectrum-web-components/action-menu';\nimport type { Menu, MenuItem } from '@spectrum-web-components/menu';\n\nexport default {\n component: 'sp-menu',\n title: 'Menu/Submenu',\n};\n\nfunction nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nclass SubmenuReady extends HTMLElement {\n ready!: (value: boolean | PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n async setup(): Promise<void> {\n await nextFrame();\n\n const menu = document.querySelector(`sp-action-menu`) as ActionMenu;\n menu.addEventListener('sp-opened', this.handleMenuOpened, {\n once: true,\n });\n menu.open = true;\n }\n\n handleMenuOpened = async (event: Event): Promise<void> => {\n await nextFrame();\n await (event.target as ActionMenu).updateComplete;\n\n const submenu = document.querySelector('#submenu-item-1') as MenuItem;\n if (!submenu) {\n return;\n }\n submenu.addEventListener('sp-opened', this.handleSubmenuOpened, {\n once: true,\n });\n submenu.dispatchEvent(\n new PointerEvent('pointerenter', { bubbles: true, composed: true })\n );\n };\n\n handleSubmenuOpened = async (event: Event): Promise<void> => {\n await nextFrame();\n await (event.target as MenuItem).updateComplete;\n\n const submenu = document.querySelector('#submenu-item-2') as MenuItem;\n if (!submenu) {\n return;\n }\n submenu.addEventListener('sp-opened', this.handleSubmenuChildOpened, {\n once: true,\n });\n submenu.dispatchEvent(\n new PointerEvent('pointerenter', { bubbles: true, composed: true })\n );\n };\n\n handleSubmenuChildOpened = async (event: Event): Promise<void> => {\n await nextFrame();\n await (event.target as MenuItem).updateComplete;\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('submenu-ready', SubmenuReady);\n\nconst submenuDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <submenu-ready></submenu-ready>\n `;\n};\n\nexport const submenu = (): TemplateResult => {\n const getValueEls = (): {\n root: HTMLElement;\n first: HTMLElement;\n second: HTMLElement;\n } => {\n return {\n root: document.querySelector('#root-value') as HTMLElement,\n first: document.querySelector('#first-value') as HTMLElement,\n second: document.querySelector('#second-value') as HTMLElement,\n };\n };\n const clearValues = (): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = '';\n valueEls.first.textContent = '';\n valueEls.second.textContent = '';\n };\n const handleRootChange = (event: Event & { target: ActionMenu }): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = event.target.value;\n };\n const handleFirstDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.first.textContent = event.target.selected[0] || '';\n };\n const handleSecondDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.second.textContent = event.target.selected[0] || '';\n };\n return html`\n <sp-action-menu @change=${handleRootChange} @sp-opened=${clearValues}>\n <sp-icon-show-menu slot=\"icon\"></sp-icon-show-menu>\n <sp-menu-group\n @change=${() => console.log('group change')}\n role=\"none\"\n >\n <span slot=\"header\">New York</span>\n <sp-menu-item>Bronx</sp-menu-item>\n <sp-menu-item id=\"submenu-item-1\">\n Brooklyn\n <sp-menu\n slot=\"submenu\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item id=\"submenu-item-2\">\n Ft. Greene\n <sp-menu\n slot=\"submenu\"\n @change=${handleSecondDescendantChange}\n >\n <sp-menu-item>S. Oxford St</sp-menu-item>\n <sp-menu-item>S. Portland Ave</sp-menu-item>\n <sp-menu-item>S. Elliot Pl</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item disabled>Park Slope</sp-menu-item>\n <sp-menu-item>Williamsburg</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>\n Manhattan\n <sp-menu\n slot=\"submenu\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item disabled>SoHo</sp-menu-item>\n <sp-menu-item>\n Union Square\n <sp-menu\n slot=\"submenu\"\n @change=${handleSecondDescendantChange}\n >\n <sp-menu-item>14th St</sp-menu-item>\n <sp-menu-item>Broadway</sp-menu-item>\n <sp-menu-item>Park Ave</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>Upper East Side</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n </sp-menu-group>\n </sp-action-menu>\n <div>\n Root value:\n <span id=\"root-value\"></span>\n <br />\n First descendant value:\n <span id=\"first-value\"></span>\n <br />\n Second descendant value:\n <span id=\"second-value\"></span>\n <br />\n </div>\n `;\n};\n\nsubmenu.decorators = [submenuDecorator];\n\nexport const contextMenu = (): TemplateResult => {\n const contextMenuTemplate = (): TemplateResult => html`\n <sp-popover\n style=\"max-width: 33vw;\"\n @click=${(event: Event) =>\n event.target?.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n >\n <sp-menu @change=${handleRootChange}>\n <sp-menu-group>\n <span slot=\"header\">Options</span>\n <sp-menu-item>\n Copy\n <span slot=\"value\">\u2318\u200BS</span>\n </sp-menu-item>\n <sp-menu-item>\n Paste\n <span slot=\"value\">\u2318\u200BP</span>\n </sp-menu-item>\n <sp-menu-item>\n Cut\n <span slot=\"value\">\u2318\u200BX</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Select layer\n <sp-menu\n slot=\"submenu\"\n selects=\"single\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item selected>Ellipse 1</sp-menu-item>\n <sp-menu-item>Rectangle</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>\n Group\n <span slot=\"value\">\u2318\u200BG</span>\n </sp-menu-item>\n <sp-menu-item>\n Unlock\n <span slot=\"value\">\u2318\u200BL</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Bring to front\n <span slot=\"value\">\u21E7\u200B\u2318\u200B\u200B]</span>\n </sp-menu-item>\n <sp-menu-item>\n Bring forward\n <span slot=\"value\">\u2318\u200B\u200B]</span>\n </sp-menu-item>\n <sp-menu-item>\n Send backward\n <span slot=\"value\">\u2318\u200B\u200B[</span>\n </sp-menu-item>\n <sp-menu-item>\n Send to back\n <span slot=\"value\">\u21E7\u200B\u2318\u200B\u200B[</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Delete\n <span slot=\"value\">DEL</span>\n </sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n </sp-popover>\n `;\n const pointerenter = async (event: PointerEvent): Promise<void> => {\n event.preventDefault();\n const trigger = event.target as HTMLElement;\n const virtualTrigger = new VirtualTrigger(event.clientX, event.clientY);\n const fragment = document.createDocumentFragment();\n render(contextMenuTemplate(), fragment);\n const popover = fragment.querySelector('sp-popover') as Popover;\n clearValues();\n openOverlay(trigger, 'modal', popover, {\n placement: 'right-start',\n receivesFocus: 'auto',\n virtualTrigger,\n });\n };\n const getValueEls = (): { root: HTMLElement; first: HTMLElement } => {\n return {\n root: document.querySelector('#root-value') as HTMLElement,\n first: document.querySelector('#first-value') as HTMLElement,\n };\n };\n const clearValues = (): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = '';\n valueEls.first.textContent = '';\n };\n const handleRootChange = (event: Event & { target: ActionMenu }): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = event.target.value;\n };\n const handleFirstDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.first.textContent = event.target.selected[0] || '';\n };\n return html`\n <style>\n .app-root {\n position: absolute;\n inset: 0;\n }\n active-overlay::part(theme) {\n --swc-menu-width: 200px;\n }\n </style>\n <div class=\"app-root\" @contextmenu=${pointerenter}>\n <div>\n Root value:\n <span id=\"root-value\"></span>\n <br />\n First descendant value:\n <span id=\"first-value\"></span>\n <br />\n </div>\n </div>\n `;\n};\n"],
|
|
5
|
-
"mappings": ";AAYA,SAAS,
|
|
6
|
-
"names": [
|
|
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 { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/action-menu/sp-action-menu.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport { Overlay, VirtualTrigger } from '@spectrum-web-components/overlay';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-show-menu.js';\nimport type { ActionMenu } from '@spectrum-web-components/action-menu';\nimport type { Menu, MenuItem } from '@spectrum-web-components/menu';\n\nexport default {\n component: 'sp-menu',\n title: 'Menu/Submenu',\n};\n\nfunction nextFrame(): Promise<void> {\n return new Promise((res) => requestAnimationFrame(() => res()));\n}\n\nclass SubmenuReady extends HTMLElement {\n ready!: (value: boolean | PromiseLike<boolean>) => void;\n\n constructor() {\n super();\n this.readyPromise = new Promise((res) => {\n this.ready = res;\n this.setup();\n });\n }\n\n menu!: ActionMenu;\n submenu!: MenuItem;\n submenuChild!: MenuItem;\n\n async setup(): Promise<void> {\n await nextFrame();\n\n this.menu = document.querySelector(`sp-action-menu`) as ActionMenu;\n this.menu.addEventListener('sp-opened', this.handleMenuOpened);\n this.menu.addEventListener(\n 'sp-closed',\n () => {\n this.menu.removeEventListener(\n 'sp-opened',\n this.handleMenuOpened\n );\n },\n { once: true }\n );\n this.menu.open = true;\n }\n\n handleMenuOpened = async (event: Event): Promise<void> => {\n this.menu.removeEventListener('sp-opened', this.handleMenuOpened);\n await nextFrame();\n await (event.target as ActionMenu).updateComplete;\n\n this.submenu = document.querySelector('#submenu-item-1') as MenuItem;\n if (!this.submenu) {\n return;\n }\n\n this.submenu.addEventListener('sp-opened', this.handleSubmenuOpened);\n this.submenu.click();\n };\n\n handleSubmenuOpened = async (event: Event): Promise<void> => {\n this.submenu.removeEventListener('sp-opened', this.handleSubmenuOpened);\n await nextFrame();\n await (event.target as MenuItem).updateComplete;\n\n this.submenuChild = document.querySelector(\n '#submenu-item-2'\n ) as MenuItem;\n if (!this.submenuChild) {\n return;\n }\n this.submenuChild.addEventListener(\n 'sp-opened',\n this.handleSubmenuChildOpened\n );\n this.submenuChild.click();\n };\n\n handleSubmenuChildOpened = async (event: Event): Promise<void> => {\n this.submenuChild.removeEventListener(\n 'sp-opened',\n this.handleSubmenuChildOpened\n );\n await nextFrame();\n await (event.target as MenuItem).updateComplete;\n\n this.ready(true);\n };\n\n private readyPromise: Promise<boolean> = Promise.resolve(false);\n\n get updateComplete(): Promise<boolean> {\n return this.readyPromise;\n }\n}\n\ncustomElements.define('submenu-ready', SubmenuReady);\n\nconst submenuDecorator = (story: () => TemplateResult): TemplateResult => {\n return html`\n ${story()}\n <submenu-ready></submenu-ready>\n `;\n};\n\nexport const submenu = (): TemplateResult => {\n const getValueEls = (): {\n root: HTMLElement;\n first: HTMLElement;\n second: HTMLElement;\n } => {\n return {\n root: document.querySelector('#root-value') as HTMLElement,\n first: document.querySelector('#first-value') as HTMLElement,\n second: document.querySelector('#second-value') as HTMLElement,\n };\n };\n const clearValues = (): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = '';\n valueEls.first.textContent = '';\n valueEls.second.textContent = '';\n };\n const handleRootChange = (event: Event & { target: ActionMenu }): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = event.target.value;\n };\n const handleFirstDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.first.textContent = event.target.selected[0] || '';\n };\n const handleSecondDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.second.textContent = event.target.selected[0] || '';\n };\n return html`\n <sp-action-menu @change=${handleRootChange} @sp-opened=${clearValues}>\n <sp-icon-show-menu slot=\"icon\"></sp-icon-show-menu>\n <sp-menu-group\n @change=${() => console.log('group change')}\n role=\"none\"\n >\n <span slot=\"header\">New York</span>\n <sp-menu-item>Bronx</sp-menu-item>\n <sp-menu-item id=\"submenu-item-1\">\n Brooklyn\n <sp-menu\n slot=\"submenu\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item id=\"submenu-item-2\">\n Ft. Greene\n <sp-menu\n slot=\"submenu\"\n @change=${handleSecondDescendantChange}\n >\n <sp-menu-item>S. Oxford St</sp-menu-item>\n <sp-menu-item>S. Portland Ave</sp-menu-item>\n <sp-menu-item>S. Elliot Pl</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item disabled>Park Slope</sp-menu-item>\n <sp-menu-item>Williamsburg</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>\n Manhattan\n <sp-menu\n slot=\"submenu\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item disabled>SoHo</sp-menu-item>\n <sp-menu-item>\n Union Square\n <sp-menu\n slot=\"submenu\"\n @change=${handleSecondDescendantChange}\n >\n <sp-menu-item>14th St</sp-menu-item>\n <sp-menu-item>Broadway</sp-menu-item>\n <sp-menu-item>Park Ave</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>Upper East Side</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n </sp-menu-group>\n </sp-action-menu>\n <div>\n Root value:\n <span id=\"root-value\"></span>\n <br />\n First descendant value:\n <span id=\"first-value\"></span>\n <br />\n Second descendant value:\n <span id=\"second-value\"></span>\n <br />\n </div>\n `;\n};\n\nsubmenu.decorators = [submenuDecorator];\n\nexport const contextMenu = (): TemplateResult => {\n const contextmenu = async (event: PointerEvent): Promise<void> => {\n event.preventDefault();\n const virtualTrigger = new VirtualTrigger(event.clientX, event.clientY);\n const overlay = document.querySelector('sp-overlay') as Overlay;\n clearValues();\n overlay.triggerElement = virtualTrigger;\n overlay.willPreventClose = true;\n overlay.type = 'auto';\n overlay.placement = 'right-start';\n overlay.open = true;\n };\n const getValueEls = (): { root: HTMLElement; first: HTMLElement } => {\n return {\n root: document.querySelector('#root-value') as HTMLElement,\n first: document.querySelector('#first-value') as HTMLElement,\n };\n };\n const clearValues = (): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = '';\n valueEls.first.textContent = '';\n };\n const handleRootChange = (event: Event & { target: ActionMenu }): void => {\n const valueEls = getValueEls();\n valueEls.root.textContent = event.target.value;\n event.target.parentElement?.dispatchEvent(\n new Event('close', { bubbles: true })\n );\n };\n const handleFirstDescendantChange = (\n event: Event & { target: Menu }\n ): void => {\n const valueEls = getValueEls();\n valueEls.first.textContent = event.target.selected[0] || '';\n };\n return html`\n <style>\n .app-root {\n position: absolute;\n inset: 0;\n }\n active-overlay::part(theme) {\n --swc-menu-width: 200px;\n }\n </style>\n <div class=\"app-root\" @contextmenu=${contextmenu}>\n <div>\n Root value:\n <span id=\"root-value\"></span>\n <br />\n First descendant value:\n <span id=\"first-value\"></span>\n <br />\n </div>\n </div>\n <sp-overlay>\n <sp-popover\n style=\"max-width: 33vw;\"\n @click=${(event: Event) =>\n event.target?.dispatchEvent(\n new Event('close', { bubbles: true })\n )}\n >\n <sp-menu @change=${handleRootChange}>\n <sp-menu-group>\n <span slot=\"header\">Options</span>\n <sp-menu-item>\n Copy\n <span slot=\"value\">\u2318\u200BS</span>\n </sp-menu-item>\n <sp-menu-item>\n Paste\n <span slot=\"value\">\u2318\u200BP</span>\n </sp-menu-item>\n <sp-menu-item>\n Cut\n <span slot=\"value\">\u2318\u200BX</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Select layer\n <sp-menu\n slot=\"submenu\"\n selects=\"single\"\n @change=${handleFirstDescendantChange}\n >\n <sp-menu-item selected>Ellipse 1</sp-menu-item>\n <sp-menu-item>Rectangle</sp-menu-item>\n </sp-menu>\n </sp-menu-item>\n <sp-menu-item>\n Group\n <span slot=\"value\">\u2318\u200BG</span>\n </sp-menu-item>\n <sp-menu-item>\n Unlock\n <span slot=\"value\">\u2318\u200BL</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Bring to front\n <span slot=\"value\">\u21E7\u200B\u2318\u200B\u200B]</span>\n </sp-menu-item>\n <sp-menu-item>\n Bring forward\n <span slot=\"value\">\u2318\u200B\u200B]</span>\n </sp-menu-item>\n <sp-menu-item>\n Send backward\n <span slot=\"value\">\u2318\u200B\u200B[</span>\n </sp-menu-item>\n <sp-menu-item>\n Send to back\n <span slot=\"value\">\u21E7\u200B\u2318\u200B\u200B[</span>\n </sp-menu-item>\n <sp-menu-divider></sp-menu-divider>\n <sp-menu-item>\n Delete\n <span slot=\"value\">DEL</span>\n </sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n </sp-popover>\n </sp-overlay>\n `;\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
7
|
}
|
package/test/menu-group.test.js
CHANGED
|
@@ -93,26 +93,38 @@ describe("Menu group", () => {
|
|
|
93
93
|
html`
|
|
94
94
|
<sp-menu selects="single">
|
|
95
95
|
<sp-menu-item selected>First</sp-menu-item>
|
|
96
|
+
<!-- 1 -->
|
|
96
97
|
<sp-menu-item>Second</sp-menu-item>
|
|
98
|
+
<!-- 1 -->
|
|
97
99
|
<sp-menu-group id="mg-multi" selects="multiple">
|
|
98
100
|
<sp-menu-item selected>Multi1</sp-menu-item>
|
|
101
|
+
<!-- 2 -->
|
|
99
102
|
<sp-menu-item>Multi2</sp-menu-item>
|
|
103
|
+
<!-- 2 -->
|
|
100
104
|
<sp-menu-group id="mg-sub-inherit" selects="inherit">
|
|
101
105
|
<sp-menu-item>SubInherit1</sp-menu-item>
|
|
106
|
+
<!-- 2 -->
|
|
102
107
|
<sp-menu-item>SubInherit2</sp-menu-item>
|
|
108
|
+
<!-- 2 -->
|
|
103
109
|
</sp-menu-group>
|
|
104
110
|
</sp-menu-group>
|
|
105
111
|
<sp-menu-group id="mg-single" selects="single">
|
|
106
112
|
<sp-menu-item selected>Single1</sp-menu-item>
|
|
113
|
+
<!-- 3 -->
|
|
107
114
|
<sp-menu-item>Single2</sp-menu-item>
|
|
115
|
+
<!-- 3 -->
|
|
108
116
|
</sp-menu-group>
|
|
109
117
|
<sp-menu-group id="mg-none">
|
|
110
118
|
<sp-menu-item>Inherit1</sp-menu-item>
|
|
119
|
+
<!-- - -->
|
|
111
120
|
<sp-menu-item>Inherit2</sp-menu-item>
|
|
121
|
+
<!-- - -->
|
|
112
122
|
</sp-menu-group>
|
|
113
123
|
<sp-menu-group id="mg-inherit" selects="inherit">
|
|
114
124
|
<sp-menu-item>Inherit1</sp-menu-item>
|
|
125
|
+
<!-- 1 -->
|
|
115
126
|
<sp-menu-item>Inherit2</sp-menu-item>
|
|
127
|
+
<!-- 1 -->
|
|
116
128
|
</sp-menu-group>
|
|
117
129
|
</sp-menu>
|
|
118
130
|
`
|
|
@@ -219,6 +231,7 @@ describe("Menu group", () => {
|
|
|
219
231
|
expect(el.value).to.equal("Inherit1");
|
|
220
232
|
expect(el.selectedItems.length).to.equal(1);
|
|
221
233
|
noneItem2.click();
|
|
234
|
+
await elementUpdated(el);
|
|
222
235
|
await elementUpdated(noneGroup);
|
|
223
236
|
await elementUpdated(noneItem2);
|
|
224
237
|
expect(inheritItem1.selected).to.be.true;
|
|
@@ -229,8 +242,8 @@ describe("Menu group", () => {
|
|
|
229
242
|
await elementUpdated(singleGroup);
|
|
230
243
|
await elementUpdated(singleItem1);
|
|
231
244
|
await elementUpdated(singleItem2);
|
|
232
|
-
expect(singleItem1.selected, "first item not selected").to.be.false;
|
|
233
245
|
expect(singleItem2.selected).to.be.true;
|
|
246
|
+
expect(singleItem1.selected, "first item not selected").to.be.false;
|
|
234
247
|
expect(inheritItem1.selected).to.be.true;
|
|
235
248
|
expect(singleItem1.getAttribute("aria-checked")).to.equal("false");
|
|
236
249
|
expect(singleItem2.getAttribute("aria-checked")).to.equal("true");
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["menu-group.test.ts"],
|
|
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*/\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport { Menu, MenuGroup, MenuItem } from '@spectrum-web-components/menu';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\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 testForLitDevWarnings(\n async () =>\n 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 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"],
|
|
5
|
-
"mappings": ";AAWA,OAAO;AACP,OAAO;AACP,OAAO;AACP,OAAO;AAEP;AAAA,EACI;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACG;AACP,SAAS,6BAA6B;AAEtC,MAAM,eAAe,CAAC,SAAuC;AACzD,SAAO,KAAK,WAAW;AAAA,IACnB,CAAC,SAAmB,KAAK,SAAS,kBAAkB;AAAA,EACxD;AACJ;AAEA,SAAS,cAAc,MAAM;AACzB;AAAA,IACI,YACI,MAAM;AAAA,MACF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAgBJ;AAAA,EACR;AACA,KAAG,WAAW,YAAY;AACtB,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAgBJ;AAEA,UAAM,UAAU,MAAM;AAClB,aAAO,aAAa,EAAE,EAAE,WAAW;AAAA,IACvC,GAAG,sDAAsD,aAAa,EAAE,EAAE,MAAM,OAAO,GAAG,WAAW,MAAM,EAAE;AAC7G,UAAM,eAAe,EAAE;AAEvB,UAAM,OAAO,EAAE,EAAE,GAAG,GAAG,WAAW;AAAA,EACtC,CAAC;AACD,KAAG,mCAAmC,YAAY;AAC9C,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA,IAGJ;AACA,UAAM,eAAe,EAAE;AACvB,UAAM,OAAO,GAAG,WAAW;AAAA,MACvB;AAAA,IACJ;AACA,UAAM,SAAS,SAAS,cAAc,MAAM;AAC5C,WAAO,cAAc;AACrB,WAAO,OAAO;AACd,WAAO,OAAO,EAAE,EAAE,GAAG,MAAM,EAAE;AAC7B,QAAI,cAAc,SAAS,MAAM,YAAY;AAC7C,OAAG,OAAO,MAAM;AAChB,UAAM;AACN,WAAO,OAAO,EAAE,EAAE,GAAG;AAAA,MAChB,GAAuC;AAAA,IAC5C;AAEA,kBAAc,SAAS,MAAM,YAAY;AACzC,WAAO,OAAO;AACd,UAAM;AACN,WAAO,OAAO,EAAE,EAAE,GAAG,MAAM,EAAE;AAAA,EACjC,CAAC;AACD,KAAG,0CAA0C,YAAY;AACrD,UAAM,KAAK,MAAM;AAAA,MACb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
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*/\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/menu/sp-menu-divider.js';\nimport { Menu, MenuGroup, MenuItem } from '@spectrum-web-components/menu';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { testForLitDevWarnings } from '../../../test/testing-helpers.js';\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 testForLitDevWarnings(\n async () =>\n 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 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 <!-- 1 -->\n <sp-menu-item>Second</sp-menu-item>\n <!-- 1 -->\n <sp-menu-group id=\"mg-multi\" selects=\"multiple\">\n <sp-menu-item selected>Multi1</sp-menu-item>\n <!-- 2 -->\n <sp-menu-item>Multi2</sp-menu-item>\n <!-- 2 -->\n <sp-menu-group id=\"mg-sub-inherit\" selects=\"inherit\">\n <sp-menu-item>SubInherit1</sp-menu-item>\n <!-- 2 -->\n <sp-menu-item>SubInherit2</sp-menu-item>\n <!-- 2 -->\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 <!-- 3 -->\n <sp-menu-item>Single2</sp-menu-item>\n <!-- 3 -->\n </sp-menu-group>\n <sp-menu-group id=\"mg-none\">\n <sp-menu-item>Inherit1</sp-menu-item>\n <!-- - -->\n <sp-menu-item>Inherit2</sp-menu-item>\n <!-- - -->\n </sp-menu-group>\n <sp-menu-group id=\"mg-inherit\" selects=\"inherit\">\n <sp-menu-item>Inherit1</sp-menu-item>\n <!-- 1 -->\n <sp-menu-item>Inherit2</sp-menu-item>\n <!-- 1 -->\n </sp-menu-group>\n </sp-menu>\n `\n );\n\n // 1 & 3 should be menuitemradio\n // 2 shouwl menuitemcheckbox\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(el);\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(singleItem2.selected).to.be.true;\n expect(singleItem1.selected, 'first item not selected').to.be.false;\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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/test/menu-item.test.js
CHANGED
|
@@ -140,5 +140,27 @@ describe("Menu item", () => {
|
|
|
140
140
|
expect(el.value).to.equal("Selected Text");
|
|
141
141
|
expect(el.hasAttribute("value")).to.be.false;
|
|
142
142
|
});
|
|
143
|
+
it("acualizes a submenu", async () => {
|
|
144
|
+
const test = await fixture(
|
|
145
|
+
html`
|
|
146
|
+
<sp-menu>
|
|
147
|
+
<sp-menu-item selected>Selected</sp-menu-item>
|
|
148
|
+
</sp-menu>
|
|
149
|
+
`
|
|
150
|
+
);
|
|
151
|
+
const el = test.querySelector("sp-menu-item");
|
|
152
|
+
expect(el.hasSubmenu).to.be.false;
|
|
153
|
+
const submenuItem = document.createElement("sp-menu-item");
|
|
154
|
+
const submenu = document.createElement("sp-menu");
|
|
155
|
+
submenuItem.textContent = "Test Submenu Item";
|
|
156
|
+
submenu.slot = "submenu";
|
|
157
|
+
submenu.append(submenuItem);
|
|
158
|
+
el.append(submenu);
|
|
159
|
+
await elementUpdated(el);
|
|
160
|
+
expect(el.hasSubmenu).to.be.true;
|
|
161
|
+
submenu.remove();
|
|
162
|
+
await elementUpdated(el);
|
|
163
|
+
expect(el.hasSubmenu).to.be.false;
|
|
164
|
+
});
|
|
143
165
|
});
|
|
144
166
|
//# sourceMappingURL=menu-item.test.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["menu-item.test.ts"],
|
|
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/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport { Menu, MenuItem } 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 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"],
|
|
5
|
-
"mappings": "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",
|
|
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/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport { Menu, MenuItem } 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 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 it('acualizes a submenu', async () => {\n const test = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-item selected>Selected</sp-menu-item>\n </sp-menu>\n `\n );\n\n const el = test.querySelector('sp-menu-item') as MenuItem;\n\n expect(el.hasSubmenu).to.be.false;\n\n const submenuItem = document.createElement('sp-menu-item');\n const submenu = document.createElement('sp-menu');\n submenuItem.textContent = 'Test Submenu Item';\n submenu.slot = 'submenu';\n submenu.append(submenuItem);\n\n el.append(submenu);\n await elementUpdated(el);\n\n expect(el.hasSubmenu).to.be.true;\n\n submenu.remove();\n await elementUpdated(el);\n\n expect(el.hasSubmenu).to.be.false;\n });\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -532,13 +532,15 @@ describe("Menu w/ groups [selects]", () => {
|
|
|
532
532
|
await sendKeys({ press: "ArrowDown" });
|
|
533
533
|
await sendKeys({ press: "ArrowUp" });
|
|
534
534
|
await elementUpdated(el);
|
|
535
|
+
let optionCount = 0;
|
|
535
536
|
for (const option of options) {
|
|
536
537
|
const parentElement = option.parentElement;
|
|
537
538
|
expect(document.activeElement === parentElement, "parent focused").to.be.true;
|
|
538
|
-
expect(option.focused,
|
|
539
|
+
expect(option.focused, `option ${optionCount} visually focused`).to.be.true;
|
|
539
540
|
await sendKeys({ press: "Space" });
|
|
540
541
|
expect(parentElement.value).to.equal(option.value);
|
|
541
542
|
await sendKeys({ press: "ArrowDown" });
|
|
543
|
+
optionCount += 1;
|
|
542
544
|
}
|
|
543
545
|
});
|
|
544
546
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["menu-selects.test.ts"],
|
|
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*/\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport { Menu, MenuGroup, MenuItem } from '@spectrum-web-components/menu';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n} from '@open-wc/testing';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\nimport { sendMouse } from '../../../test/plugins/browser.js';\n\ndescribe('Menu [selects]', () => {\n let el!: Menu;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu>\n `\n );\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(el, 'change');\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 change;\n expect(el.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(el, 'change');\n item1.click();\n await change;\n expect(el.value).to.equal('1');\n });\n });\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n el.selects = 'multiple';\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n });\n});\n\ndescribe('Menu [selects] w/ group', () => {\n let el!: Menu;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-group selects=\"inherit\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(el, 'change');\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 change;\n expect(el.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(el, 'change');\n item1.click();\n await change;\n expect(el.value).to.equal('1');\n });\n });\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(el.value).to.equal('');\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n el.selects = 'multiple';\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n });\n});\n\ndescribe('Menu w/ group [selects]', () => {\n let el!: Menu;\n let group!: MenuGroup;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-group selects=\"single\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n group = el.querySelector('sp-menu-group') as MenuGroup;\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(group, 'change');\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 change;\n expect(group.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(group, 'change');\n item1.click();\n await change;\n expect(group.value).to.equal('1');\n });\n });\n\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(group.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(group.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n group.selects = 'multiple';\n\n await elementUpdated(group);\n\n expect(group.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(group.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(group.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('');\n });\n});\n\ndescribe('Menu w/ groups [selects]', () => {\n let el!: Menu;\n let groupA!: MenuGroup;\n let groupB!: MenuGroup;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-group selects=\"single\" id=\"group-1\">\n <sp-menu-item value=\"1a\">Option 1a</sp-menu-item>\n <sp-menu-item value=\"2a\">Option 2a</sp-menu-item>\n <sp-menu-item value=\"3a\">Option 3a</sp-menu-item>\n </sp-menu-group>\n <sp-menu-group selects=\"single\" id=\"group-2\">\n <sp-menu-item value=\"1b\">Option 1b</sp-menu-item>\n <sp-menu-item value=\"2b\">Option 2b</sp-menu-item>\n <sp-menu-item value=\"3b\">Option 3b</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n groupA = el.querySelector('sp-menu-group:first-child') as MenuGroup;\n groupB = el.querySelector('sp-menu-group:last-child') as MenuGroup;\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1a = options[0];\n const item1b = options[3];\n const boundingRectA = item1a.getBoundingClientRect();\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n let change = oneEvent(el, 'change');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRectA.x + boundingRectA.width / 2,\n boundingRectA.y + boundingRectA.height / 2,\n ],\n },\n {\n type: 'down',\n },\n {\n type: 'up',\n },\n ],\n });\n await change;\n await elementUpdated(item1a);\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('');\n change = oneEvent(el, 'change');\n const boundingRectB = item1b.getBoundingClientRect();\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRectB.x + boundingRectB.width / 2,\n boundingRectB.y + boundingRectB.height / 2,\n ],\n },\n {\n type: 'down',\n },\n {\n type: 'up',\n },\n ],\n });\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('1b');\n });\n it('on JS clicks', async () => {\n const item1a = options[0];\n const item1b = options[3];\n let change = oneEvent(el, 'change');\n item1a.click();\n await change;\n expect(groupA.value).to.equal('1a');\n change = oneEvent(el, 'change');\n item1b.click();\n await change;\n expect(groupB.value).to.equal('1b');\n });\n it('can have them `preventDefault()`ed', async () => {\n const preventSpy = spy();\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n const item1a = options[0];\n const item1b = options[3];\n groupA.addEventListener('change', (event: Event) => {\n event.preventDefault();\n preventSpy();\n });\n const change = oneEvent(el, 'change');\n item1a.click();\n item1b.click();\n await change;\n expect(preventSpy.callCount).to.equal(1);\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('1b');\n });\n });\n\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(groupA.value).to.equal('1a');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('2a');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupB.value).to.equal('2b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupB.value).to.equal('3b');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n groupA.selects = 'multiple';\n groupB.selects = 'multiple';\n\n await elementUpdated(groupA);\n await elementUpdated(groupB);\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a');\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a');\n expect(groupB.value).to.equal('1b,2b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a,3a');\n expect(groupB.value).to.equal('1b,2b');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a,3a');\n expect(groupB.value).to.equal('1b,2b,3b');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(groupA.value).to.equal('2a,3a');\n expect(groupB.value).to.equal('1b,2b,3b');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n\n expect(groupA.value).to.equal('2a,3a');\n expect(groupB.value).to.equal('2b,3b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n expect(groupB.value).to.equal('2b,3b');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n expect(groupB.value).to.equal('3b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('3b');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n });\n it('manages focus', async () => {\n await elementUpdated(groupA);\n await elementUpdated(groupB);\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n input.focus();\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === groupA).to.be.true;\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowUp' });\n\n await elementUpdated(el);\n for (const option of options) {\n const parentElement = option.parentElement as Menu;\n expect(document.activeElement === parentElement, 'parent focused')\n .to.be.true;\n expect(option.focused, 'option visually focused').to.be.true;\n await sendKeys({ press: 'Space' });\n expect(parentElement.value).to.equal(option.value);\n await sendKeys({ press: 'ArrowDown' });\n }\n });\n});\n"],
|
|
5
|
-
"mappings": "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",
|
|
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*/\nimport '@spectrum-web-components/menu/sp-menu.js';\nimport '@spectrum-web-components/menu/sp-menu-group.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport { Menu, MenuGroup, MenuItem } from '@spectrum-web-components/menu';\nimport {\n elementUpdated,\n expect,\n fixture,\n html,\n oneEvent,\n} from '@open-wc/testing';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { spy } from 'sinon';\nimport { sendMouse } from '../../../test/plugins/browser.js';\n\ndescribe('Menu [selects]', () => {\n let el!: Menu;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu>\n `\n );\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(el, 'change');\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 change;\n expect(el.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(el, 'change');\n item1.click();\n await change;\n expect(el.value).to.equal('1');\n });\n });\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n el.selects = 'multiple';\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n });\n});\n\ndescribe('Menu [selects] w/ group', () => {\n let el!: Menu;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu selects=\"single\">\n <sp-menu-group selects=\"inherit\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(el, 'change');\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 change;\n expect(el.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(el, 'change');\n item1.click();\n await change;\n expect(el.value).to.equal('1');\n });\n });\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(el.value).to.equal('');\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n el.selects = 'multiple';\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(el.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(el.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(el.value).to.equal('');\n });\n});\n\ndescribe('Menu w/ group [selects]', () => {\n let el!: Menu;\n let group!: MenuGroup;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-group selects=\"single\">\n <sp-menu-item value=\"1\">Option 1</sp-menu-item>\n <sp-menu-item value=\"2\">Option 2</sp-menu-item>\n <sp-menu-item value=\"3\">Option 3</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n group = el.querySelector('sp-menu-group') as MenuGroup;\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1 = options[0];\n const boundingRect = item1.getBoundingClientRect();\n const change = oneEvent(group, 'change');\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 change;\n expect(group.value).to.equal('1');\n });\n it('on JS clicks', async () => {\n const item1 = options[0];\n const change = oneEvent(group, 'change');\n item1.click();\n await change;\n expect(group.value).to.equal('1');\n });\n });\n\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(group.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(group.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('3');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n group.selects = 'multiple';\n\n await elementUpdated(group);\n\n expect(group.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(group.value).to.equal('1');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('1,2');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('1,2,3');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(group.value).to.equal('2,3');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('3');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n await elementUpdated(el);\n\n expect(group.value).to.equal('');\n });\n});\n\ndescribe('Menu w/ groups [selects]', () => {\n let el!: Menu;\n let groupA!: MenuGroup;\n let groupB!: MenuGroup;\n let options!: MenuItem[];\n beforeEach(async () => {\n el = await fixture<Menu>(\n html`\n <sp-menu>\n <sp-menu-group selects=\"single\" id=\"group-1\">\n <sp-menu-item value=\"1a\">Option 1a</sp-menu-item>\n <sp-menu-item value=\"2a\">Option 2a</sp-menu-item>\n <sp-menu-item value=\"3a\">Option 3a</sp-menu-item>\n </sp-menu-group>\n <sp-menu-group selects=\"single\" id=\"group-2\">\n <sp-menu-item value=\"1b\">Option 1b</sp-menu-item>\n <sp-menu-item value=\"2b\">Option 2b</sp-menu-item>\n <sp-menu-item value=\"3b\">Option 3b</sp-menu-item>\n </sp-menu-group>\n </sp-menu>\n `\n );\n groupA = el.querySelector('sp-menu-group:first-child') as MenuGroup;\n groupB = el.querySelector('sp-menu-group:last-child') as MenuGroup;\n options = [...el.querySelectorAll('sp-menu-item')] as MenuItem[];\n });\n describe('fires `change` events', async () => {\n it('on browser clicks', async () => {\n const item1a = options[0];\n const item1b = options[3];\n const boundingRectA = item1a.getBoundingClientRect();\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n let change = oneEvent(el, 'change');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRectA.x + boundingRectA.width / 2,\n boundingRectA.y + boundingRectA.height / 2,\n ],\n },\n {\n type: 'down',\n },\n {\n type: 'up',\n },\n ],\n });\n await change;\n await elementUpdated(item1a);\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('');\n change = oneEvent(el, 'change');\n const boundingRectB = item1b.getBoundingClientRect();\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n boundingRectB.x + boundingRectB.width / 2,\n boundingRectB.y + boundingRectB.height / 2,\n ],\n },\n {\n type: 'down',\n },\n {\n type: 'up',\n },\n ],\n });\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('1b');\n });\n it('on JS clicks', async () => {\n const item1a = options[0];\n const item1b = options[3];\n let change = oneEvent(el, 'change');\n item1a.click();\n await change;\n expect(groupA.value).to.equal('1a');\n change = oneEvent(el, 'change');\n item1b.click();\n await change;\n expect(groupB.value).to.equal('1b');\n });\n it('can have them `preventDefault()`ed', async () => {\n const preventSpy = spy();\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n const item1a = options[0];\n const item1b = options[3];\n groupA.addEventListener('change', (event: Event) => {\n event.preventDefault();\n preventSpy();\n });\n const change = oneEvent(el, 'change');\n item1a.click();\n item1b.click();\n await change;\n expect(preventSpy.callCount).to.equal(1);\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('1b');\n });\n });\n\n it('manages a single selection when [selects=\"single\"]', async () => {\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(groupA.value).to.equal('1a');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('2a');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupB.value).to.equal('2b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupB.value).to.equal('3b');\n });\n it('manages multiple selections when [selects=\"multiple\"]', async () => {\n groupA.selects = 'multiple';\n groupB.selects = 'multiple';\n\n await elementUpdated(groupA);\n await elementUpdated(groupB);\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n\n let change = oneEvent(el, 'change');\n options[0].click();\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n expect(groupA.value).to.equal('1a');\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a');\n expect(groupB.value).to.equal('1b');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a');\n expect(groupB.value).to.equal('1b,2b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a,3a');\n expect(groupB.value).to.equal('1b,2b');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupA.value).to.equal('1a,2a,3a');\n expect(groupB.value).to.equal('1b,2b,3b');\n\n change = oneEvent(el, 'change');\n options[0].click();\n await change;\n\n expect(groupA.value).to.equal('2a,3a');\n expect(groupB.value).to.equal('1b,2b,3b');\n\n change = oneEvent(el, 'change');\n options[3].click();\n await change;\n\n expect(groupA.value).to.equal('2a,3a');\n expect(groupB.value).to.equal('2b,3b');\n\n change = oneEvent(el, 'change');\n options[1].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n expect(groupB.value).to.equal('2b,3b');\n\n change = oneEvent(el, 'change');\n options[4].click();\n await change;\n\n expect(groupA.value).to.equal('3a');\n expect(groupB.value).to.equal('3b');\n\n change = oneEvent(el, 'change');\n options[2].click();\n await change;\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('3b');\n\n change = oneEvent(el, 'change');\n options[5].click();\n await change;\n\n expect(groupA.value).to.equal('');\n expect(groupB.value).to.equal('');\n });\n it('manages focus', async () => {\n await elementUpdated(groupA);\n await elementUpdated(groupB);\n const input = document.createElement('input');\n el.insertAdjacentElement('afterend', input);\n input.focus();\n expect(document.activeElement === input).to.be.true;\n await sendKeys({ press: 'Shift+Tab' });\n expect(document.activeElement === groupA).to.be.true;\n await sendKeys({ press: 'ArrowDown' });\n await sendKeys({ press: 'ArrowUp' });\n\n await elementUpdated(el);\n let optionCount = 0;\n for (const option of options) {\n const parentElement = option.parentElement as Menu;\n expect(document.activeElement === parentElement, 'parent focused')\n .to.be.true;\n expect(option.focused, `option ${optionCount} visually focused`).to\n .be.true;\n await sendKeys({ press: 'Space' });\n expect(parentElement.value).to.equal(option.value);\n await sendKeys({ press: 'ArrowDown' });\n optionCount += 1;\n }\n });\n});\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/test/menu.test.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
import "@spectrum-web-components/menu/sp-menu.js";
|
|
3
|
-
import "@spectrum-web-components/menu/sp-menu-
|
|
3
|
+
import "@spectrum-web-components/menu/sp-menu-divider.js";
|
|
4
4
|
import "@spectrum-web-components/menu/sp-menu-group.js";
|
|
5
|
+
import "@spectrum-web-components/menu/sp-menu-item.js";
|
|
5
6
|
import {
|
|
6
7
|
elementUpdated,
|
|
7
8
|
expect,
|
|
@@ -301,8 +302,15 @@ describe("Menu", () => {
|
|
|
301
302
|
const firstItem = el.querySelector(".first");
|
|
302
303
|
const selectedItem = el.querySelector(".selected");
|
|
303
304
|
await elementUpdated(el);
|
|
305
|
+
await nextFrame();
|
|
304
306
|
el.focus();
|
|
305
307
|
expect(document.activeElement).to.equal(el);
|
|
308
|
+
await sendKeys({
|
|
309
|
+
press: "ArrowUp"
|
|
310
|
+
});
|
|
311
|
+
await sendKeys({
|
|
312
|
+
press: "ArrowDown"
|
|
313
|
+
});
|
|
306
314
|
expect(selectedItem.focused).to.be.true;
|
|
307
315
|
selectedItem.remove();
|
|
308
316
|
await elementUpdated(el);
|