@spectrum-web-components/overlay 0.41.1 → 0.42.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.
Files changed (114) hide show
  1. package/custom-elements.json +996 -314
  2. package/package.json +35 -7
  3. package/src/AbstractOverlay.d.ts +13 -3
  4. package/src/AbstractOverlay.dev.js +54 -19
  5. package/src/AbstractOverlay.dev.js.map +2 -2
  6. package/src/AbstractOverlay.js +1 -1
  7. package/src/AbstractOverlay.js.map +3 -3
  8. package/src/ClickController.d.ts +14 -0
  9. package/src/ClickController.dev.js +42 -0
  10. package/src/ClickController.dev.js.map +7 -0
  11. package/src/ClickController.js +2 -0
  12. package/src/ClickController.js.map +7 -0
  13. package/src/HoverController.d.ts +19 -0
  14. package/src/HoverController.dev.js +148 -0
  15. package/src/HoverController.dev.js.map +7 -0
  16. package/src/HoverController.js +2 -0
  17. package/src/HoverController.js.map +7 -0
  18. package/src/InteractionController.d.ts +23 -0
  19. package/src/InteractionController.dev.js +45 -0
  20. package/src/InteractionController.dev.js.map +7 -0
  21. package/src/InteractionController.js +2 -0
  22. package/src/InteractionController.js.map +7 -0
  23. package/src/LongpressController.d.ts +21 -0
  24. package/src/LongpressController.dev.js +157 -0
  25. package/src/LongpressController.dev.js.map +7 -0
  26. package/src/LongpressController.js +2 -0
  27. package/src/LongpressController.js.map +7 -0
  28. package/src/Overlay.d.ts +17 -50
  29. package/src/Overlay.dev.js +86 -363
  30. package/src/Overlay.dev.js.map +2 -2
  31. package/src/Overlay.js +10 -10
  32. package/src/Overlay.js.map +3 -3
  33. package/src/OverlayDialog.dev.js +8 -1
  34. package/src/OverlayDialog.dev.js.map +2 -2
  35. package/src/OverlayDialog.js +1 -1
  36. package/src/OverlayDialog.js.map +3 -3
  37. package/src/OverlayNoPopover.dev.js +9 -3
  38. package/src/OverlayNoPopover.dev.js.map +2 -2
  39. package/src/OverlayNoPopover.js +1 -1
  40. package/src/OverlayNoPopover.js.map +3 -3
  41. package/src/OverlayPopover.dev.js +10 -1
  42. package/src/OverlayPopover.dev.js.map +2 -2
  43. package/src/OverlayPopover.js +1 -1
  44. package/src/OverlayPopover.js.map +3 -3
  45. package/src/OverlayStack.d.ts +1 -1
  46. package/src/OverlayStack.dev.js +11 -1
  47. package/src/OverlayStack.dev.js.map +2 -2
  48. package/src/OverlayStack.js +1 -1
  49. package/src/OverlayStack.js.map +3 -3
  50. package/src/index.d.ts +1 -0
  51. package/src/index.dev.js +1 -0
  52. package/src/index.dev.js.map +2 -2
  53. package/src/index.js +1 -1
  54. package/src/index.js.map +2 -2
  55. package/src/overlay-trigger-directive.d.ts +26 -0
  56. package/src/overlay-trigger-directive.dev.js +76 -0
  57. package/src/overlay-trigger-directive.dev.js.map +7 -0
  58. package/src/overlay-trigger-directive.js +2 -0
  59. package/src/overlay-trigger-directive.js.map +7 -0
  60. package/src/overlay-trigger.css.dev.js +1 -1
  61. package/src/overlay-trigger.css.dev.js.map +1 -1
  62. package/src/overlay-trigger.css.js +1 -1
  63. package/src/overlay-trigger.css.js.map +1 -1
  64. package/src/overlay-types.d.ts +7 -0
  65. package/src/overlay-types.dev.js.map +1 -1
  66. package/src/overlay-types.js.map +1 -1
  67. package/src/overlay.css.dev.js +1 -3
  68. package/src/overlay.css.dev.js.map +2 -2
  69. package/src/overlay.css.js +1 -3
  70. package/src/overlay.css.js.map +2 -2
  71. package/src/slottable-request-directive.d.ts +17 -0
  72. package/src/slottable-request-directive.dev.js +63 -0
  73. package/src/slottable-request-directive.dev.js.map +7 -0
  74. package/src/slottable-request-directive.js +2 -0
  75. package/src/slottable-request-directive.js.map +7 -0
  76. package/src/slottable-request-event.d.ts +12 -0
  77. package/src/slottable-request-event.dev.js +28 -0
  78. package/src/slottable-request-event.dev.js.map +7 -0
  79. package/src/slottable-request-event.js +2 -0
  80. package/src/slottable-request-event.js.map +7 -0
  81. package/stories/overlay-directive.stories.js +232 -0
  82. package/stories/overlay-directive.stories.js.map +7 -0
  83. package/stories/overlay-element.stories.js +46 -3
  84. package/stories/overlay-element.stories.js.map +2 -2
  85. package/stories/overlay-story-components.js +1 -1
  86. package/stories/overlay-story-components.js.map +1 -1
  87. package/stories/overlay.stories.js +16 -28
  88. package/stories/overlay.stories.js.map +2 -2
  89. package/test/benchmark/basic-test.js +24 -1
  90. package/test/benchmark/basic-test.js.map +2 -2
  91. package/test/benchmark/directive-test.js +43 -0
  92. package/test/benchmark/directive-test.js.map +7 -0
  93. package/test/benchmark/element-test.js +40 -0
  94. package/test/benchmark/element-test.js.map +7 -0
  95. package/test/benchmark/lazy-test.js +47 -0
  96. package/test/benchmark/lazy-test.js.map +7 -0
  97. package/test/index.js +11 -176
  98. package/test/index.js.map +2 -2
  99. package/test/overlay-directive.test-vrt.js +5 -0
  100. package/test/overlay-directive.test-vrt.js.map +7 -0
  101. package/test/overlay-directive.test.js +159 -0
  102. package/test/overlay-directive.test.js.map +7 -0
  103. package/test/overlay-element.test.js +149 -1
  104. package/test/overlay-element.test.js.map +2 -2
  105. package/test/overlay-lifecycle.test.js +11 -4
  106. package/test/overlay-lifecycle.test.js.map +2 -2
  107. package/test/overlay-trigger-directive.test.js +75 -0
  108. package/test/overlay-trigger-directive.test.js.map +7 -0
  109. package/test/overlay-trigger-extended.test.js +1 -1
  110. package/test/overlay-trigger-extended.test.js.map +2 -2
  111. package/test/overlay-trigger-hover-click.test.js +17 -4
  112. package/test/overlay-trigger-hover-click.test.js.map +2 -2
  113. package/test/overlay-trigger-longpress.test.js +6 -1
  114. package/test/overlay-trigger-longpress.test.js.map +2 -2
package/test/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["index.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 { fixture, isOnTopLayer } from '../../../test/testing-helpers.js';\nimport {\n aTimeout,\n elementUpdated,\n expect,\n html,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\n\nimport {\n OverlayTrigger,\n TriggerInteractions,\n} from '@spectrum-web-components/overlay';\nimport '@spectrum-web-components/button/sp-button.js';\nimport { Button } from '@spectrum-web-components/button';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport { Popover } from '@spectrum-web-components/popover';\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { isWebKit } from '@spectrum-web-components/shared';\n\nexport const runOverlayTriggerTests = (type: string): void => {\n describe(`Overlay Trigger - ${type}`, () => {\n describe('open/close', () => {\n beforeEach(async function () {\n this.testDiv = await fixture<HTMLDivElement>(\n html`\n <div>\n <style>\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n </style>\n <overlay-trigger id=\"trigger\" placement=\"top\">\n <sp-button\n id=\"outer-button\"\n variant=\"primary\"\n slot=\"trigger\"\n >\n Show Popover\n </sp-button>\n <sp-popover\n id=\"outer-popover\"\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n >\n <sp-dialog\n no-divider\n class=\"options-popover-content\"\n >\n <overlay-trigger\n id=\"inner-trigger\"\n placement=\"bottom\"\n >\n <sp-button\n id=\"inner-button\"\n slot=\"trigger\"\n >\n Press Me\n </sp-button>\n <sp-popover\n id=\"inner-popover\"\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n >\n <sp-dialog\n no-divider\n class=\"options-popover-content\"\n >\n Another Popover\n <sp-button>\n Does nothing\n </sp-button>\n </sp-dialog>\n </sp-popover>\n </overlay-trigger>\n </sp-dialog>\n </sp-popover>\n <div\n id=\"hover-content\"\n slot=\"hover-content\"\n class=\"tooltip\"\n delay=\"100\"\n >\n Tooltip\n </div>\n </overlay-trigger>\n </div>\n `\n );\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n\n this.innerTrigger = this.testDiv.querySelector(\n '#inner-trigger'\n ) as OverlayTrigger;\n this.outerTrigger = this.testDiv.querySelector(\n '#trigger'\n ) as OverlayTrigger;\n this.innerButton = this.testDiv.querySelector(\n '#inner-button'\n ) as Button;\n this.outerButton = this.testDiv.querySelector(\n '#outer-button'\n ) as Button;\n this.innerClickContent = this.testDiv.querySelector(\n '#inner-popover'\n ) as Popover;\n this.outerClickContent = this.testDiv.querySelector(\n '#outer-popover'\n ) as Popover;\n this.hoverContent = this.testDiv.querySelector(\n '#hover-content'\n ) as HTMLDivElement;\n });\n\n it('opens a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n\n it('[disabled] closes a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n expect(this.outerTrigger.disabled).to.be.false;\n\n expect(this.outerButton).to.exist;\n\n const opened = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await opened;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n\n const closed = oneEvent(this.outerButton, 'sp-closed');\n this.outerTrigger.disabled = true;\n await closed;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n });\n\n it('resizes a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n\n window.dispatchEvent(new Event('resize'));\n window.dispatchEvent(new Event('resize'));\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n\n ['modal', 'replace', 'inline'].map((type: string) => {\n it(`opens a popover - [type=\"${type}\"]`, async function () {\n this.outerTrigger.type = type as Extract<\n TriggerInteractions,\n 'inline' | 'modal' | 'replace'\n >;\n await elementUpdated(this.outerTrigger);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const opened = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await opened;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n });\n\n it('does not open a hover popover when a click popover is open', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerButton.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n composed: true,\n })\n );\n\n await nextFrame();\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n });\n\n it('does not open a popover when [disabled]', async function () {\n const triggerZone = this.outerTrigger.shadowRoot.querySelector(\n '#trigger'\n ) as HTMLDivElement;\n\n expect(this.outerTrigger.disabled).to.be.false;\n let open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover available at point'\n ).to.be.true;\n let closed = oneEvent(this.outerTrigger, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n await closed;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerTrigger.disabled = true;\n await elementUpdated(this.outerTrigger);\n\n expect(this.outerTrigger.disabled).to.be.true;\n expect(this.outerTrigger.hasAttribute('disabled')).to.be.true;\n // // The overlay shouldn't open here.\n this.outerButton.click();\n await aTimeout(150);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n // The overlay shouldn't open here, either.\n triggerZone.dispatchEvent(new Event('mouseenter'));\n await aTimeout(150);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerTrigger.disabled = false;\n await elementUpdated(this.outerTrigger);\n\n expect(this.outerTrigger.disabled).to.be.false;\n expect(this.outerTrigger.hasAttribute('disabled')).to.be.false;\n open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover available at point'\n ).to.be.true;\n closed = oneEvent(this.outerTrigger, 'sp-closed');\n this.outerButton.click();\n await closed;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n });\n\n it('opens a nested popover', async function () {\n if (isWebKit()) {\n // breaks on https://bugs.webkit.org/show_bug.cgi?id=263081 skip for now.\n this.skip();\n }\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n let open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(await isOnTopLayer(this.innerClickContent)).to.be.false;\n\n open = oneEvent(this.innerTrigger, 'sp-opened');\n this.innerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n });\n\n it('focus previous \"modal\" when closing nested \"modal\"', async function () {\n this.outerTrigger.type = 'modal';\n this.innerTrigger.type = 'modal';\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.false;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n // Why does this make the test pass in Chromium? \uD83E\uDD37\uD83C\uDFFB\u200D\u2642\uFE0F\n await sendKeys({\n press: 'Space',\n });\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await innerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n\n expect(\n document.activeElement === this.innerButton,\n 'outer popover recieved focus'\n ).to.be.true;\n });\n\n it('escape closes an open popover', async function () {\n this.outerTrigger.type = 'modal';\n this.innerTrigger.type = 'modal';\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n // Why does this make the test pass in Chromium? \uD83E\uDD37\uD83C\uDFFB\u200D\u2642\uFE0F\n await sendKeys({\n press: 'Space',\n });\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await innerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n\n const outerClose = oneEvent(this.outerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await outerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n });\n\n it('click closes an open popover', async function () {\n if (isWebKit()) {\n // breaks on https://bugs.webkit.org/show_bug.cgi?id=263081 skip for now.\n this.skip();\n }\n this.outerTrigger.type = 'auto';\n this.innerTrigger.type = 'auto';\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is available at point'\n ).to.be.true;\n\n // Test that clicking in the overlay content does not close the overlay\n // 200ms is slightly more than the overlay animation fade out time (130ms)\n this.innerClickContent.click();\n await aTimeout(200);\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n const outerClose = oneEvent(this.outerButton, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n await innerClose;\n await outerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is not available at point'\n ).to.be.not;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is not available at point'\n ).to.be.not;\n });\n\n it('opens a hover popover', async function () {\n expect(await isOnTopLayer(this.hoverContent)).to.be.false;\n\n const rect = this.outerTrigger.getBoundingClientRect();\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await open;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is available at point'\n ).to.be.true;\n\n const close = oneEvent(this.outerTrigger, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width * 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await close;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n\n it('closes a hover popover', async function () {\n expect(await isOnTopLayer(this.hoverContent)).to.be.false;\n\n const rect = this.outerTrigger.getBoundingClientRect();\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await open;\n const close = oneEvent(this.outerTrigger, 'sp-closed');\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is available at point'\n ).to.be.true;\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width * 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await close;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n\n it('dispatches events on open/close', async function () {\n const opened = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n const openedEvent = await opened;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover content is available at point'\n ).to.be.true;\n expect(this.outerTrigger.open).to.equal('click');\n\n expect(openedEvent.detail.interaction).to.equal('auto');\n\n const closed = oneEvent(this.outerButton, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n const closedEvent = await closed;\n expect(closedEvent.detail.interaction).to.equal('auto');\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n });\n describe('System interactions', () => {\n afterEach(async () => {\n const triggers =\n document.querySelectorAll<OverlayTrigger>(\n 'overlay-trigger'\n );\n const closes: Promise<CustomEvent<unknown>>[] = [];\n triggers.forEach((trigger) => {\n if (trigger.open) {\n const close = oneEvent(trigger, 'sp-closed');\n trigger.open = undefined;\n closes.push(close);\n }\n });\n await Promise.all(closes);\n });\n it.skip('manages multiple layers of `type=\"modal\"', async () => {\n const el = await fixture(html`\n <overlay-trigger type=\"modal\">\n <sp-button slot=\"trigger\" variant=\"accent\">\n Toggle Dialog\n </sp-button>\n <sp-popover slot=\"click-content\">\n <sp-dialog no-divider>\n <overlay-trigger>\n <sp-button slot=\"trigger\" variant=\"primary\">\n Toggle Dialog\n </sp-button>\n <sp-popover slot=\"click-content\">\n <sp-dialog no-divider>\n <overlay-trigger type=\"modal\">\n <sp-button\n slot=\"trigger\"\n variant=\"secondary\"\n >\n Toggle Dialog\n </sp-button>\n <sp-popover\n slot=\"click-content\"\n >\n <sp-dialog no-divider>\n <p>\n When you get this\n deep, this\n ActiveOverlay should\n be the only one in\n [slot=\"open\"].\n </p>\n <p>\n All of the rest of\n the ActiveOverlay\n elements should have\n had their [slot]\n attribute removed.\n </p>\n <p>\n Closing this\n ActiveOverlay should\n replace them...\n </p>\n </sp-dialog>\n </sp-popover>\n </overlay-trigger>\n </sp-dialog>\n </sp-popover>\n </overlay-trigger>\n </sp-dialog>\n </sp-popover>\n </overlay-trigger>\n `);\n const overlayTriggers = [\n ...el.querySelectorAll('overlay-trigger'),\n ];\n let activeOverlays = [\n ...document.querySelectorAll('active-overlay'),\n ];\n const triggers = [\n ...el.querySelectorAll('sp-button[slot=\"trigger\"]'),\n ] as Button[];\n\n expect(activeOverlays.length, 'no previous overlays').to.equal(\n 0\n );\n\n let open = oneEvent(triggers[0], 'sp-opened');\n triggers[0]?.click();\n await open;\n await elementUpdated(overlayTriggers[0]);\n activeOverlays = [\n ...document.querySelectorAll('active-overlay'),\n ];\n expect(\n activeOverlays.length,\n 'The first `active-overlay` element has been added.'\n ).to.equal(1);\n expect(\n activeOverlays[0].slot,\n 'first overlay, first time'\n ).to.equal('open');\n\n open = oneEvent(triggers[1], 'sp-opened');\n triggers[1]?.click();\n await open;\n await elementUpdated(overlayTriggers[1]);\n activeOverlays = [\n ...document.querySelectorAll('active-overlay'),\n ];\n expect(\n activeOverlays.length,\n 'The second `active-overlay` element has been added.'\n ).to.equal(2);\n\n expect(\n activeOverlays[0].slot,\n 'first overlay, second time'\n ).to.equal('open');\n expect(\n activeOverlays[1].slot,\n 'second overlay, second time'\n ).to.equal('open');\n\n open = oneEvent(triggers[2], 'sp-opened');\n triggers[2]?.click();\n await open;\n await elementUpdated(overlayTriggers[2]);\n activeOverlays = [\n ...document.querySelectorAll('active-overlay'),\n ];\n expect(\n activeOverlays.length,\n 'The third `active-overlay` element has been added.'\n ).to.equal(3);\n\n expect(\n activeOverlays[0].hasAttribute('slot'),\n 'first overlay, third time'\n ).to.be.false;\n expect(\n activeOverlays[1].hasAttribute('slot'),\n 'second overlay, third time'\n ).to.be.false;\n expect(\n activeOverlays[2].slot,\n 'third overlay, third time'\n ).to.equal('open');\n\n await nextFrame();\n const closed = oneEvent(triggers[2], 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n await closed;\n await elementUpdated(overlayTriggers[2]);\n activeOverlays = [\n ...document.querySelectorAll('active-overlay'),\n ];\n expect(\n activeOverlays.length,\n 'The third `active-overlay` element has been removed.'\n ).to.equal(2);\n\n await waitUntil(() => {\n return activeOverlays[0].slot === 'open';\n }, 'first overlay, last time');\n expect(\n activeOverlays[1].slot,\n 'second overlay, last time'\n ).to.equal('open');\n });\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*/\n\nimport { fixture, isOnTopLayer } from '../../../test/testing-helpers.js';\nimport {\n aTimeout,\n elementUpdated,\n expect,\n html,\n nextFrame,\n oneEvent,\n} from '@open-wc/testing';\n\nimport {\n OverlayTrigger,\n TriggerInteractions,\n} from '@spectrum-web-components/overlay';\nimport '@spectrum-web-components/button/sp-button.js';\nimport { Button } from '@spectrum-web-components/button';\nimport '@spectrum-web-components/popover/sp-popover.js';\nimport { Popover } from '@spectrum-web-components/popover';\nimport '@spectrum-web-components/theme/sp-theme.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\nimport { sendKeys } from '@web/test-runner-commands';\nimport { isChrome } from '@spectrum-web-components/shared';\n\nexport const runOverlayTriggerTests = (type: string): void => {\n describe(`Overlay Trigger - ${type}`, () => {\n describe('open/close', () => {\n beforeEach(async function () {\n this.testDiv = await fixture<HTMLDivElement>(\n html`\n <div>\n <style>\n body {\n display: flex;\n align-items: center;\n justify-content: center;\n }\n </style>\n <overlay-trigger id=\"trigger\" placement=\"top\">\n <sp-button\n id=\"outer-button\"\n variant=\"primary\"\n slot=\"trigger\"\n >\n Show Popover\n </sp-button>\n <sp-popover\n id=\"outer-popover\"\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n >\n <sp-dialog\n no-divider\n class=\"options-popover-content\"\n >\n <overlay-trigger\n id=\"inner-trigger\"\n placement=\"bottom\"\n >\n <sp-button\n id=\"inner-button\"\n slot=\"trigger\"\n >\n Press Me\n </sp-button>\n <sp-popover\n id=\"inner-popover\"\n slot=\"click-content\"\n direction=\"bottom\"\n tip\n >\n <sp-dialog\n no-divider\n class=\"options-popover-content\"\n >\n Another Popover\n <sp-button>\n Does nothing\n </sp-button>\n </sp-dialog>\n </sp-popover>\n </overlay-trigger>\n </sp-dialog>\n </sp-popover>\n <div\n id=\"hover-content\"\n slot=\"hover-content\"\n class=\"tooltip\"\n delay=\"100\"\n >\n Tooltip\n </div>\n </overlay-trigger>\n </div>\n `\n );\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n await nextFrame();\n\n this.innerTrigger = this.testDiv.querySelector(\n '#inner-trigger'\n ) as OverlayTrigger;\n this.outerTrigger = this.testDiv.querySelector(\n '#trigger'\n ) as OverlayTrigger;\n this.innerButton = this.testDiv.querySelector(\n '#inner-button'\n ) as Button;\n this.outerButton = this.testDiv.querySelector(\n '#outer-button'\n ) as Button;\n this.innerClickContent = this.testDiv.querySelector(\n '#inner-popover'\n ) as Popover;\n this.outerClickContent = this.testDiv.querySelector(\n '#outer-popover'\n ) as Popover;\n this.hoverContent = this.testDiv.querySelector(\n '#hover-content'\n ) as HTMLDivElement;\n });\n\n it('opens a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n\n it('[disabled] closes a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n expect(this.outerTrigger.disabled).to.be.false;\n\n expect(this.outerButton).to.exist;\n\n const opened = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await opened;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n\n const closed = oneEvent(this.outerButton, 'sp-closed');\n this.outerTrigger.disabled = true;\n await closed;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n });\n\n it('resizes a popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n\n window.dispatchEvent(new Event('resize'));\n window.dispatchEvent(new Event('resize'));\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n\n ['modal', 'replace', 'inline'].map((type: string) => {\n it(`opens a popover - [type=\"${type}\"]`, async function () {\n this.outerTrigger.type = type as Extract<\n TriggerInteractions,\n 'inline' | 'modal' | 'replace'\n >;\n await elementUpdated(this.outerTrigger);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const opened = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await opened;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n });\n });\n\n it('does not open a hover popover when a click popover is open', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerButton.dispatchEvent(\n new Event('mouseenter', {\n bubbles: true,\n composed: true,\n })\n );\n\n await nextFrame();\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'popover available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover not available at point'\n ).to.be.false;\n });\n\n it('does not open a popover when [disabled]', async function () {\n const triggerZone = this.outerTrigger.shadowRoot.querySelector(\n '#trigger'\n ) as HTMLDivElement;\n\n expect(this.outerTrigger.disabled).to.be.false;\n let open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover available at point'\n ).to.be.true;\n let closed = oneEvent(this.outerTrigger, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n await closed;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerTrigger.disabled = true;\n await elementUpdated(this.outerTrigger);\n\n expect(this.outerTrigger.disabled).to.be.true;\n expect(this.outerTrigger.hasAttribute('disabled')).to.be.true;\n // // The overlay shouldn't open here.\n this.outerButton.click();\n await aTimeout(150);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n // The overlay shouldn't open here, either.\n triggerZone.dispatchEvent(new Event('mouseenter'));\n await aTimeout(150);\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n this.outerTrigger.disabled = false;\n await elementUpdated(this.outerTrigger);\n\n expect(this.outerTrigger.disabled).to.be.false;\n expect(this.outerTrigger.hasAttribute('disabled')).to.be.false;\n open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover available at point'\n ).to.be.true;\n closed = oneEvent(this.outerTrigger, 'sp-closed');\n this.outerButton.click();\n await closed;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n });\n\n it('opens a nested popover', async function () {\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'hover not available at point'\n ).to.be.false;\n\n expect(this.outerButton).to.exist;\n let open = oneEvent(this.outerTrigger, 'sp-opened');\n this.outerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(await isOnTopLayer(this.innerClickContent)).to.be.false;\n\n open = oneEvent(this.innerTrigger, 'sp-opened');\n this.innerButton.click();\n await open;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n });\n\n it('focus previous \"modal\" when closing nested \"modal\"', async function () {\n this.outerTrigger.type = 'modal';\n this.innerTrigger.type = 'modal';\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.false;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n // Why does this make the test pass in Chromium? \uD83E\uDD37\uD83C\uDFFB\u200D\u2642\uFE0F\n await sendKeys({\n press: 'Space',\n });\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await innerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point'\n ).to.be.false;\n\n expect(\n document.activeElement === this.innerButton,\n `outer popover recieved focus: ${document.activeElement?.localName}`\n ).to.be.true;\n });\n\n it('escape closes an open popover', async function () {\n if (isChrome()) {\n // Does a werid test time bleed that allows the `Escape` press through to the\n // parent modal. Manual testing does not exhibit this interaction, which seems\n // to step from how long the `Escape` button in down.\n this.skip();\n }\n\n this.outerTrigger.type = 'modal';\n this.innerTrigger.type = 'modal';\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point'\n ).to.be.true;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point, 1'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await innerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content available at point, 2'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point, 1'\n ).to.be.false;\n\n const outerClose = oneEvent(this.outerButton, 'sp-closed');\n await sendKeys({\n press: 'Escape',\n });\n await outerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content not available at point'\n ).to.be.false;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content not available at point, 2'\n ).to.be.false;\n });\n\n it('click closes an open popover', async function () {\n this.outerTrigger.type = 'auto';\n this.innerTrigger.type = 'auto';\n const outerOpen = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n await outerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n\n const innerOpen = oneEvent(this.innerButton, 'sp-opened');\n this.innerButton.click();\n await innerOpen;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is available at point'\n ).to.be.true;\n\n // Test that clicking in the overlay content does not close the overlay\n // 200ms is slightly more than the overlay animation fade out time (130ms)\n this.innerClickContent.click();\n await aTimeout(200);\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is available at point'\n ).to.be.true;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is available at point'\n ).to.be.true;\n\n const innerClose = oneEvent(this.innerButton, 'sp-closed');\n const outerClose = oneEvent(this.outerButton, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n await innerClose;\n await outerClose;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'outer click content is not available at point'\n ).to.be.not;\n expect(\n await isOnTopLayer(this.innerClickContent),\n 'inner click content is not available at point'\n ).to.be.not;\n });\n\n it('opens a hover popover', async function () {\n expect(await isOnTopLayer(this.hoverContent)).to.be.false;\n\n const rect = this.outerTrigger.getBoundingClientRect();\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await open;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is available at point'\n ).to.be.true;\n\n const close = oneEvent(this.outerTrigger, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width * 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await close;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n\n it('closes a hover popover', async function () {\n expect(await isOnTopLayer(this.hoverContent)).to.be.false;\n\n const rect = this.outerTrigger.getBoundingClientRect();\n const open = oneEvent(this.outerTrigger, 'sp-opened');\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await open;\n const close = oneEvent(this.outerTrigger, 'sp-closed');\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is available at point'\n ).to.be.true;\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width * 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await close;\n expect(\n await isOnTopLayer(this.hoverContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n\n it('dispatches events on open/close', async function () {\n const opened = oneEvent(this.outerButton, 'sp-opened');\n this.outerButton.click();\n const openedEvent = await opened;\n\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover content is available at point'\n ).to.be.true;\n expect(this.outerTrigger.open).to.equal('click');\n\n expect(openedEvent.detail.interaction).to.equal('auto');\n\n const closed = oneEvent(this.outerButton, 'sp-closed');\n sendMouse({\n steps: [\n {\n type: 'click',\n position: [1, 1],\n },\n ],\n });\n const closedEvent = await closed;\n expect(closedEvent.detail.interaction).to.equal('auto');\n expect(\n await isOnTopLayer(this.outerClickContent),\n 'hover content is not available at point'\n ).to.be.false;\n });\n });\n describe('System interactions', () => {\n afterEach(async () => {\n const triggers =\n document.querySelectorAll<OverlayTrigger>(\n 'overlay-trigger'\n );\n const closes: Promise<CustomEvent<unknown>>[] = [];\n triggers.forEach((trigger) => {\n if (trigger.open) {\n const close = oneEvent(trigger, 'sp-closed');\n trigger.open = undefined;\n closes.push(close);\n }\n });\n await Promise.all(closes);\n });\n });\n });\n};\n"],
5
+ "mappings": "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",
6
6
  "names": ["type"]
7
7
  }
package/test/overlay-directive.test-vrt.js ADDED
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+ import * as stories from "../stories/overlay-directive.stories.js";
3
+ import { regressVisuals } from "../../../test/visual/test.js";
4
+ regressVisuals("OverlayDirectiveStories", stories);
5
+ //# sourceMappingURL=overlay-directive.test-vrt.js.map
package/test/overlay-directive.test-vrt.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["overlay-directive.test-vrt.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 * as stories from '../stories/overlay-directive.stories.js';\nimport { regressVisuals } from '../../../test/visual/test.js';\nimport type { TestsType } from '../../../test/visual/test.js';\n\nregressVisuals('OverlayDirectiveStories', stories as unknown as TestsType);\n"],
5
+ "mappings": ";AAYA,YAAY,aAAa;AACzB,SAAS,sBAAsB;AAG/B,eAAe,2BAA2B,OAA+B;",
6
+ "names": []
7
+ }
package/test/overlay-directive.test.js ADDED
@@ -0,0 +1,159 @@
1
+ "use strict";
2
+ import { html } from "@spectrum-web-components/base";
3
+ import {
4
+ elementUpdated,
5
+ expect,
6
+ nextFrame,
7
+ oneEvent,
8
+ waitUntil
9
+ } from "@open-wc/testing";
10
+ import { Default, insertionOptions } from "../stories/overlay-directive.stories.js";
11
+ import { sendMouse } from "../../../test/plugins/browser.js";
12
+ import { fixture } from "../../../test/testing-helpers.js";
13
+ describe("Overlay Directive", () => {
14
+ it("opens declaratively", async function() {
15
+ const test = await fixture(Default({ open: true }));
16
+ await oneEvent(test, "sp-opened");
17
+ const el = test.nextElementSibling;
18
+ expect(el.open).to.be.true;
19
+ });
20
+ it("opens without options", async function() {
21
+ const test = await fixture(Default());
22
+ const opened = oneEvent(test, "sp-opened");
23
+ test.click();
24
+ await opened;
25
+ const el = test.nextElementSibling;
26
+ expect(el.open).to.be.true;
27
+ });
28
+ it("opens an Overlay after the trigger", async function() {
29
+ const test = await fixture(html`
30
+ <div
31
+ style="width: 100%; height: 100vh; display: grid; place-content: center;"
32
+ >
33
+ ${insertionOptions()}
34
+ </div>
35
+ `);
36
+ const el = test.querySelector("sp-button");
37
+ await elementUpdated(el);
38
+ let overlays = document.querySelectorAll("sp-overlay");
39
+ expect(overlays.length).to.equal(0);
40
+ const rect = el.getBoundingClientRect();
41
+ let opened = oneEvent(el, "sp-opened");
42
+ await sendMouse({
43
+ steps: [
44
+ {
45
+ type: "move",
46
+ position: [
47
+ rect.left + rect.width / 2,
48
+ rect.top + rect.height / 2
49
+ ]
50
+ }
51
+ ]
52
+ });
53
+ await opened;
54
+ opened = oneEvent(el, "sp-opened");
55
+ await sendMouse({
56
+ steps: [
57
+ {
58
+ type: "click",
59
+ position: [
60
+ rect.left + rect.width / 2,
61
+ rect.top + rect.height / 2
62
+ ]
63
+ },
64
+ {
65
+ type: "move",
66
+ position: [
67
+ rect.left - rect.width / 2,
68
+ rect.top - rect.height / 2
69
+ ]
70
+ }
71
+ ]
72
+ });
73
+ await opened;
74
+ overlays = document.querySelectorAll("sp-overlay");
75
+ expect(overlays.length).to.be.gt(0);
76
+ expect(overlays[0].previousElementSibling).to.equal(el);
77
+ const closed = oneEvent(overlays[0], "slottable-request");
78
+ await sendMouse({
79
+ steps: [
80
+ {
81
+ type: "click",
82
+ position: [
83
+ rect.left - rect.width / 2,
84
+ rect.top - rect.height / 2
85
+ ]
86
+ }
87
+ ]
88
+ });
89
+ await closed;
90
+ await waitUntil(() => {
91
+ overlays = document.querySelectorAll("sp-overlay");
92
+ return overlays.length === 0;
93
+ }, "not all overlays were cleaned up");
94
+ expect(overlays.length).to.equal(0);
95
+ });
96
+ it("opens an Overlay in a specific part of the DOM", async function() {
97
+ const test = await fixture(html`
98
+ <div
99
+ style="width: 100%; height: 100vh; display: grid; place-content: center;"
100
+ >
101
+ ${insertionOptions(insertionOptions.args)}
102
+ </div>
103
+ `);
104
+ const el = test.querySelector("sp-button");
105
+ await elementUpdated(el);
106
+ const otherElement = test.querySelector(
107
+ "#other-element"
108
+ );
109
+ let overlays = otherElement.querySelectorAll("sp-overlay");
110
+ expect(overlays.length).to.equal(0);
111
+ const rect = el.getBoundingClientRect();
112
+ let opened = oneEvent(el, "sp-opened");
113
+ await sendMouse({
114
+ steps: [
115
+ {
116
+ type: "move",
117
+ position: [
118
+ rect.left + rect.width / 2,
119
+ rect.top + rect.height / 2
120
+ ]
121
+ }
122
+ ]
123
+ });
124
+ await opened;
125
+ opened = oneEvent(el, "sp-opened");
126
+ await sendMouse({
127
+ steps: [
128
+ {
129
+ type: "click",
130
+ position: [
131
+ rect.left + rect.width / 2,
132
+ rect.top + rect.height / 2
133
+ ]
134
+ }
135
+ ]
136
+ });
137
+ await opened;
138
+ overlays = otherElement.querySelectorAll("sp-overlay");
139
+ expect(overlays.length).to.equal(1);
140
+ const closed = oneEvent(overlays[0], "slottable-request");
141
+ await sendMouse({
142
+ steps: [
143
+ {
144
+ type: "click",
145
+ position: [
146
+ rect.left - rect.width / 2,
147
+ rect.top - rect.height / 2
148
+ ]
149
+ }
150
+ ]
151
+ });
152
+ await closed;
153
+ await nextFrame();
154
+ await nextFrame();
155
+ overlays = otherElement.querySelectorAll("sp-overlay");
156
+ expect(overlays.length).to.equal(0);
157
+ });
158
+ });
159
+ //# sourceMappingURL=overlay-directive.test.js.map
package/test/overlay-directive.test.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["overlay-directive.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 { html } from '@spectrum-web-components/base';\nimport {\n elementUpdated,\n expect,\n nextFrame,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { Button } from '@spectrum-web-components/button';\nimport { Overlay } from '@spectrum-web-components/overlay';\nimport { Default, insertionOptions } from '../stories/overlay-directive.stories.js';\nimport { sendMouse } from '../../../test/plugins/browser.js';\nimport { fixture } from '../../../test/testing-helpers.js';\n\ndescribe('Overlay Directive', () => {\n it('opens declaratively', async function() {\n const test = await fixture<Button>(Default({ open: true }));\n await oneEvent(test, 'sp-opened');\n\n const el = test.nextElementSibling as Overlay;\n \n expect(el.open).to.be.true;\n });\n it('opens without options', async function() {\n const test = await fixture<Button>(Default());\n const opened = oneEvent(test, 'sp-opened');\n test.click();\n await opened;\n\n const el = test.nextElementSibling as Overlay;\n \n expect(el.open).to.be.true;\n });\n it('opens an Overlay after the trigger', async function () {\n const test = await fixture<HTMLElement>(html`\n <div\n style=\"width: 100%; height: 100vh; display: grid; place-content: center;\"\n >\n ${insertionOptions()}\n </div>\n `);\n\n const el = test.querySelector('sp-button') as Button;\n\n await elementUpdated(el);\n let overlays = document.querySelectorAll('sp-overlay');\n expect(overlays.length).to.equal(0);\n\n const rect = el.getBoundingClientRect();\n let opened = oneEvent(el, 'sp-opened');\n // Open the Tooltip via \"hover\"\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n opened = oneEvent(el, 'sp-opened');\n // Open the Popover via \"click\"\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n {\n type: 'move',\n position: [\n rect.left - rect.width / 2,\n rect.top - rect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n overlays = document.querySelectorAll('sp-overlay');\n expect(overlays.length).to.be.gt(0);\n expect(overlays[0].previousElementSibling).to.equal(el);\n\n // `slottable-request` comes _after_ `sp-closed` and triggers DOM cleanup\n const closed = oneEvent(overlays[0], 'slottable-request');\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n rect.left - rect.width / 2,\n rect.top - rect.height / 2,\n ],\n },\n ],\n });\n await closed;\n\n await waitUntil(() => {\n overlays = document.querySelectorAll('sp-overlay');\n return overlays.length === 0;\n }, 'not all overlays were cleaned up');\n\n expect(overlays.length).to.equal(0);\n });\n\n it('opens an Overlay in a specific part of the DOM', async function () {\n const test = await fixture<HTMLElement>(html`\n <div\n style=\"width: 100%; height: 100vh; display: grid; place-content: center;\"\n >\n ${insertionOptions(insertionOptions.args)}\n </div>\n `);\n\n const el = test.querySelector('sp-button') as Button;\n\n await elementUpdated(el);\n\n const otherElement = test.querySelector(\n '#other-element'\n ) as HTMLElement;\n let overlays = otherElement.querySelectorAll('sp-overlay');\n expect(overlays.length).to.equal(0);\n\n const rect = el.getBoundingClientRect();\n let opened = oneEvent(el, 'sp-opened');\n // Open the Tooltip via \"hover\"\n await sendMouse({\n steps: [\n {\n type: 'move',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n opened = oneEvent(el, 'sp-opened');\n // Open the Popover via \"click\"\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n rect.left + rect.width / 2,\n rect.top + rect.height / 2,\n ],\n },\n ],\n });\n await opened;\n\n overlays = otherElement.querySelectorAll('sp-overlay');\n expect(overlays.length).to.equal(1);\n\n // `slottable-request` comes _after_ `sp-closed` and triggers DOM cleanup\n const closed = oneEvent(overlays[0], 'slottable-request');\n await sendMouse({\n steps: [\n {\n type: 'click',\n position: [\n rect.left - rect.width / 2,\n rect.top - rect.height / 2,\n ],\n },\n ],\n });\n await closed;\n\n // Wait for DOM clean up to complete\n await nextFrame();\n await nextFrame();\n\n overlays = otherElement.querySelectorAll('sp-overlay');\n expect(overlays.length).to.equal(0);\n });\n});\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
package/test/overlay-element.test.js CHANGED
@@ -17,6 +17,10 @@ import "@spectrum-web-components/button/sp-button.js";
17
17
  import { sendMouse } from "../../../test/plugins/browser.js";
18
18
  import { sendKeys } from "@web/test-runner-commands";
19
19
  import { click, receivesFocus } from "../stories/overlay-element.stories.js";
20
+ import {
21
+ removeSlottableRequest
22
+ } from "../src/slottable-request-event.js";
23
+ import { stub } from "sinon";
20
24
  const OVERLAY_TYPES = ["modal", "page", "hint", "auto", "manual"];
21
25
  async function styledFixture(story) {
22
26
  const test = await fixture(html`
@@ -48,6 +52,120 @@ describe("sp-overlay", () => {
48
52
  expect(content.open).to.be.true;
49
53
  });
50
54
  }
55
+ describe("`slottable-request` event", () => {
56
+ it("dispatched before `sp-opened`", async function() {
57
+ let slottableRequestTime = 0;
58
+ let openedTime = 0;
59
+ const el = await fixture(html`
60
+ <sp-overlay
61
+ @slottable-request=${() => slottableRequestTime = performance.now()}
62
+ @sp-opened=${() => openedTime = performance.now()}
63
+ >
64
+ <sp-popover>test</sp-popover>
65
+ </sp-overlay>
66
+ `);
67
+ await elementUpdated(el);
68
+ const opened = oneEvent(el, "sp-opened");
69
+ el.open = true;
70
+ await opened;
71
+ expect(slottableRequestTime).to.be.lt(openedTime);
72
+ });
73
+ it("dispatched after `sp-closed`", async function() {
74
+ let slottableRequestTime = 0;
75
+ let closedTime = 0;
76
+ const el = await fixture(html`
77
+ <sp-overlay
78
+ @sp-closed=${() => closedTime = performance.now()}
79
+ @slottable-request=${() => slottableRequestTime = performance.now()}
80
+ >
81
+ <sp-popover>test</sp-popover>
82
+ </sp-overlay>
83
+ `);
84
+ await elementUpdated(el);
85
+ const opened = oneEvent(el, "sp-opened");
86
+ el.open = true;
87
+ await opened;
88
+ await nextFrame();
89
+ await nextFrame();
90
+ const closed = oneEvent(el, "sp-closed");
91
+ el.open = false;
92
+ await closed;
93
+ await nextFrame();
94
+ await nextFrame();
95
+ expect(
96
+ slottableRequestTime,
97
+ `slottable-request: ${slottableRequestTime}, sp-closed: ${closedTime}`
98
+ ).to.be.gt(closedTime);
99
+ });
100
+ it("follows transition timing from lazily added children", async function() {
101
+ let slottableRequestTime = 0;
102
+ let openedTime = 0;
103
+ const popover = document.createElement("sp-popover");
104
+ popover.textContent = "Test";
105
+ const el = await fixture(html`
106
+ <sp-overlay
107
+ @slottable-request=${(event) => {
108
+ slottableRequestTime = performance.now();
109
+ if (event.data !== removeSlottableRequest) {
110
+ event.target.append(popover);
111
+ } else {
112
+ popover.remove();
113
+ }
114
+ }}
115
+ @sp-opened=${() => openedTime = performance.now()}
116
+ ></sp-overlay>
117
+ `);
118
+ await elementUpdated(el);
119
+ const opened = oneEvent(el, "sp-opened");
120
+ el.open = true;
121
+ await opened;
122
+ expect(slottableRequestTime).to.be.lte(openedTime);
123
+ expect(openedTime - slottableRequestTime).to.be.gt(130);
124
+ });
125
+ describe("dev mode", () => {
126
+ let consoleWarnStub;
127
+ before(() => {
128
+ window.__swc.verbose = true;
129
+ consoleWarnStub = stub(console, "warn");
130
+ });
131
+ afterEach(() => {
132
+ consoleWarnStub.resetHistory();
133
+ });
134
+ after(() => {
135
+ window.__swc.verbose = false;
136
+ consoleWarnStub.restore();
137
+ });
138
+ it("warns that `slottable-request` events are experimental", async () => {
139
+ const el = await fixture(html`
140
+ <sp-overlay>
141
+ <sp-popover>test</sp-popover>
142
+ </sp-overlay>
143
+ `);
144
+ await elementUpdated(el);
145
+ const opened = oneEvent(el, "sp-opened");
146
+ el.open = true;
147
+ await opened;
148
+ expect(consoleWarnStub.called).to.be.true;
149
+ const spyCall = consoleWarnStub.getCall(0);
150
+ expect(
151
+ spyCall.args.at(0).includes(
152
+ "`slottable-request` events are experimental"
153
+ ),
154
+ "`slottable-request`-centric message"
155
+ ).to.be.true;
156
+ expect(
157
+ spyCall.args.at(-1),
158
+ "confirm `data` shape"
159
+ ).to.deep.equal({
160
+ data: {
161
+ localName: "base",
162
+ type: "api",
163
+ level: "high"
164
+ }
165
+ });
166
+ });
167
+ });
168
+ });
51
169
  describe('[type="modal"]', () => {
52
170
  opensDeclaratively("modal");
53
171
  describe("interaction with other non-ancestor overlays", function() {
@@ -691,7 +809,7 @@ describe("sp-overlay", () => {
691
809
  expect(this.manual.open).to.be.true;
692
810
  });
693
811
  });
694
- describe("only close when mnually closed", function() {
812
+ describe("only close when manually closed", function() {
695
813
  it("does not close when clicking away", async () => {
696
814
  const test = await fixture(html`
697
815
  <div>
@@ -727,6 +845,36 @@ describe("sp-overlay", () => {
727
845
  expect(el === overlay).to.be.true;
728
846
  expect(el.open).to.be.false;
729
847
  });
848
+ it("does not close when pressing `Escape`", async () => {
849
+ const test = await fixture(html`
850
+ <div>
851
+ ${click({
852
+ ...click.args,
853
+ interaction: "click",
854
+ placement: "bottom",
855
+ type: "manual",
856
+ delayed: false,
857
+ receivesFocus: "auto"
858
+ })}
859
+ </div>
860
+ `);
861
+ const el = test.querySelector("sp-overlay");
862
+ expect(el.open).to.be.false;
863
+ const opened = oneEvent(el, "sp-opened");
864
+ el.open = true;
865
+ let { overlay } = await opened;
866
+ expect(el === overlay).to.be.true;
867
+ await sendKeys({
868
+ press: "Escape"
869
+ });
870
+ await aTimeout(200);
871
+ expect(el.open).to.be.true;
872
+ const closed = oneEvent(el, "sp-closed");
873
+ el.open = false;
874
+ ({ overlay } = await closed);
875
+ expect(el === overlay).to.be.true;
876
+ expect(el.open).to.be.false;
877
+ });
730
878
  });
731
879
  });
732
880
  });