genesys-spark-components 4.82.0 → 4.83.0

package/dist/collection/components/stable/gux-tabs-advanced/tests/gux-tabs-advanced.e2e.js

@@ -1,222 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { a11yCheck } from "../../../../test/e2eTestUtils";
-const axeExclusions = [
-    {
-        issueId: 'duplicate-id-aria',
-        exclusionReason: 'Test uses seeded value for Math.random, so duplicate ids are expected (tooltips)'
-    },
-    {
-        issueId: 'duplicate-id-active',
-        exclusionReason: 'Test uses seeded value for Math.random, so duplicate ids are expected (option buttons)'
-    },
-    {
-        issueId: 'aria-required-children',
-        target: '.gux-tablist',
-        exclusionReason: 'To be addressed in COMUI-2392. New violation picked up after upgrading from axe-core v4.4.2 to v4.8.2'
-    }
-];
-async function newNonrandomE2EPage({ html }, lang = 'en') {
-    const page = await newE2EPage();
-    await page.evaluateOnNewDocument(() => {
-        Math.random = () => 0.5;
-    });
-    await page.setContent(`<div lang=${lang}>${html}</div>`);
-    await page.waitForChanges();
-    await page.addScriptTag({
-        path: '../../node_modules/axe-core/axe.min.js'
-    });
-    await page.waitForChanges();
-    return page;
-}
-describe('gux-tabs-advanced', () => {
-    const htmlExample1 = `
-  <gux-tabs-advanced>
-    <gux-tab-advanced-list
-      slot="tab-list"
-      allow-sort="false"
-      show-new-tab-button="true"
-    >
-      <gux-tab-advanced tab-id="1-1">
-        Tab Header 1
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="close" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-2">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 2
-      </gux-tab-advanced>
-      <gux-tab-advanced gux-disabled tab-id="1-3">
-        Tab Header 3
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-4">
-        Tab Header 4
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-5">
-        Tab Header 5 long long
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-6">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 6
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="close" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-7">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Tab Header 7 long long long
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-            Close
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-8">
-      Tab Header 8 longlonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglonglong
-      <gux-list slot="dropdown-options">
-        <gux-list-item>
-          <gux-icon icon-name="close" decorative="true"></gux-icon>
-          Close
-        </gux-list-item>
-      </gux-list>
-    </gux-tab-advanced>
-      <gux-tab-advanced gux-disabled tab-id="1-9">
-        Tab Header 9 long long long
-      </gux-tab-advanced>
-    </gux-tab-advanced-list>
-    <gux-tab-advanced-panel tab-id="1-1">
-      <span>Tab content 1</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-2">
-      <span>Tab content 2</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-3">
-      <span>Tab content 3</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-4">
-      <span>Tab content 4</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-5">
-      <span>Tab content 5</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-6">
-      <span>Tab content 6</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-7">
-      <span>Tab content 7</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-8">
-      <span>Tab content 8</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-9">
-      <span>Tab content 9</span>
-    </gux-tab-advanced-panel>
-  </gux-tabs-advanced>
-`;
-    const htmlExample2 = `
-    <gux-tabs-advanced>
-      <gux-tab-advanced-list
-        slot="tab-list"
-        allow-sort="false"
-        show-new-tab-button="true"
-      >
-        <gux-tab-advanced tab-id="1-1">
-          Tab Header 1
-        </gux-tab-advanced>
-        <gux-tab-advanced tab-id="1-2">
-          <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-          Tab Header 2
-        </gux-tab-advanced>
-        <gux-tab-advanced gux-disabled tab-id="1-3">
-          Tab Header 3
-        </gux-tab-advanced>
-        <gux-tab-advanced tab-id="1-4">
-          Tab Header 4
-        </gux-tab-advanced>
-      </gux-tab-advanced-list>
-    <gux-tab-advanced-panel tab-id="1-1">
-      <span>Tab content 1</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-2">
-      <span>Tab content 2</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-3">
-      <span>Tab content 3</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-4">
-      <span>Tab content 4</span>
-    </gux-tab-advanced-panel>
-
-    </gux-tabs-advanced>
-    `;
-    describe('#render', () => {
-        // This test is flaky
-        it('renders', async () => {
-            const page = await newNonrandomE2EPage({ html: htmlExample2 });
-            const element = await page.find('gux-tabs-advanced');
-            await a11yCheck(page, axeExclusions);
-            expect(element.outerHTML).toMatchSnapshot();
-        });
-        it('renders i18n strings', async () => {
-            const restrictedWidthHtml = `<div style="width: 200px">${htmlExample2}</div>`;
-            const page = await newNonrandomE2EPage({ html: restrictedWidthHtml }, 'ja');
-            const element = await page.find('gux-tabs-advanced');
-            expect(element.outerHTML).toMatchSnapshot();
-        });
-        it('does not render the scroll buttons when tabs fit container', async () => {
-            const page = await newNonrandomE2EPage({ html: htmlExample2 });
-            const scrollButtons = await page.findAll('.gux-scroll-button');
-            await a11yCheck(page, axeExclusions);
-            expect(scrollButtons.length).toBe(0);
-        });
-        it('renders scroll buttons when tabs overflow container', async () => {
-            const restrictedWidthHtml = `<div style="width: 200px">${htmlExample2}</div>`;
-            const page = await newNonrandomE2EPage({ html: restrictedWidthHtml });
-            const scrollButtons = await page.findAll('.gux-scroll-button');
-            await a11yCheck(page, axeExclusions);
-            expect(scrollButtons.length).toBe(2);
-        });
-    });
-    describe('#interactions', () => {
-        it('should change tabpanel content when tab is changed', async () => {
-            const page = await newNonrandomE2EPage({ html: htmlExample1 });
-            const tabTarget = await page.find('gux-tab-advanced[tab-id="1-2"]');
-            const tabPanel = await page.find('gux-tab-advanced-panel[tab-id="1-2"]');
-            const spyOnActivePanelChangeEvent = await tabPanel.spyOnEvent('guxactivepanelchange');
-            await tabTarget.click();
-            await page.waitForChanges();
-            expect(spyOnActivePanelChangeEvent.length).toBe(1);
-            expect(spyOnActivePanelChangeEvent.events[0].detail).toBe('1-2');
-        });
-        it('should not change tabpanel content when tab is disabled', async () => {
-            const page = await newNonrandomE2EPage({ html: htmlExample1 });
-            const tabTarget = await page.find('gux-tab-advanced[tab-id="1-3"]');
-            const tabPanel = await page.find('gux-tab-advanced-panel[tab-id="1-3"]');
-            const spyOnActivePanelChangeEvent = await tabPanel.spyOnEvent('guxactivepanelchange');
-            await tabTarget.click();
-            await page.waitForChanges();
-            expect(spyOnActivePanelChangeEvent.length).toBe(0);
-        });
-        it('should open and close options popup on click', async () => {
-            const page = await newNonrandomE2EPage({ html: htmlExample1 });
-            const optionPopoverTarget = await page.find('gux-tab-advanced[tab-id="1-1"] .gux-tab-options-trigger');
-            await optionPopoverTarget.click();
-            await page.waitForChanges();
-            await a11yCheck(page, axeExclusions, 'options popover expanded');
-            const optionPopover = await page.find('gux-tab-advanced[tab-id="1-1"] gux-popover-list');
-            let optionPopoverOpen = optionPopover.getAttribute('is-open');
-            expect(optionPopoverOpen).toBe('');
-            await optionPopoverTarget.click();
-            await page.waitForChanges();
-            optionPopoverOpen = optionPopover.getAttribute('is-open');
-            expect(optionPopoverOpen).toBe(null);
-        });
-    });
-});

package/dist/collection/components/stable/gux-tabs-advanced/tests/gux-tabs-advanced.spec.js

@@ -1,73 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxTabsAdvanced } from "../gux-tabs-advanced";
-import { GuxTabAdvanced } from "../gux-tab-advanced/gux-tab-advanced";
-import { GuxTabAdvancedList } from "../gux-tab-advanced-list/gux-tab-advanced-list";
-import { GuxTabAdvancedPanel } from "../gux-tab-advanced-panel/gux-tab-advanced-panel";
-const components = [
-    GuxTabsAdvanced,
-    GuxTabAdvanced,
-    GuxTabAdvancedList,
-    GuxTabAdvancedPanel
-];
-const html = `
-  <gux-tabs-advanced lang="en" id="interactive">
-    <gux-tab-advanced-list slot="tab-list" show-new-tab-button="true">
-      <gux-tab-advanced tab-id="1-1">
-        <gux-icon icon-name="lock" decorative="true"></gux-icon>
-        Hello World
-        <gux-list slot="dropdown-options">
-          <gux-list-item>
-            <gux-icon icon-name="edit" decorative="true"></gux-icon>
-            Edit
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="clone" decorative="true"></gux-icon>
-            Clone
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="share" decorative="true"></gux-icon>
-            Share
-          </gux-list-item>
-          <gux-list-item>
-            <gux-icon icon-name="download" decorative="true"></gux-icon>
-            Download
-          </gux-list-item>
-        </gux-list>
-      </gux-tab-advanced>
-      <gux-tab-advanced tab-id="1-2">
-        <gux-icon icon-name="user-directory" decorative="true"></gux-icon>
-        Hello World 2 long long long long long
-      </gux-tab-advanced>
-      <gux-tab-advanced gux-disabled tab-id="1-3">
-      Hello World 3
-    </gux-tab-advanced>
-    <div slot="add-tab">
-      <gux-icon icon-name="file-preview" decorative></gux-icon>
-      Add View
-    </div>
-    </gux-tab-advanced-list>
-    <gux-tab-advanced-panel tab-id="1-1">
-      <span>Tab content 1</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-2">
-      <span>Tab content 2</span>
-    </gux-tab-advanced-panel>
-    <gux-tab-advanced-panel tab-id="1-3">
-    <span>Tab content 3</span>
-    </gux-tab-advanced-panel>
-  </gux-tabs-advanced>
-`;
-const language = 'en';
-describe('gux-tabs-advanced', () => {
-    describe('#render', () => {
-        it(`should render as expected`, async () => {
-            const page = await newSpecPage({
-                components,
-                html,
-                language
-            });
-            expect(page.rootInstance).toBeInstanceOf(GuxTabsAdvanced);
-            expect(page.root).toMatchSnapshot();
-        });
-    });
-});

package/dist/collection/components/stable/gux-tag/tests/gux-tag.e2e.js

@@ -1,161 +0,0 @@
-import { newSparkE2EPage, a11yCheck } from "../../../../test/e2eTestUtils";
-describe('gux-tag', () => {
-    describe('#render', () => {
-        [
-            '<gux-tag lang="en">default</gux-tag>',
-            '<gux-tag lang="en" accent="default">default (explicit)</gux-tag>',
-            '<gux-tag lang="en" accent="1">navy</gux-tag>',
-            '<gux-tag lang="en" accent="1"><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>',
-            '<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>',
-            '<gux-tag lang="en" accent="1" removable disabled><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>',
-            '<gux-tag lang="en" emphasis="subtle" accent="1">Subtle 1</gux-tag>',
-            '<gux-tag lang="en" emphasis="bold" accent="1">Bold 1</gux-tag>',
-            '<gux-tag lang="en" size="small" accent="1">Small 1</gux-tag>',
-            '<gux-tag lang="en" size="large" accent="1">Large 1</gux-tag>'
-        ].forEach((html, index) => {
-            it(`should render component as expected (${index + 1})`, async () => {
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                await a11yCheck(page);
-                expect(element.outerHTML).toMatchSnapshot();
-            });
-        });
-    });
-    describe('delete', () => {
-        describe('click', () => {
-            it('should not have a delete button if tag is not removable', async () => {
-                const html = `<gux-tag lang="en" accent="1"><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                expect(deleteButton).toBeNull();
-            });
-            it('should emit guxdelete if tag is removable and not disabled', async () => {
-                const html = `<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const guxdeleteSpy = await page.spyOnEvent('guxdelete');
-                await deleteButton.click();
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveReceivedEvent();
-            });
-            it('should not emit guxdelete if tag is removable and disabled', async () => {
-                const html = `<gux-tag lang="en" accent="1" removable disabled><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const guxdeleteSpy = await page.spyOnEvent('guxdelete');
-                await deleteButton.click();
-                await page.waitForChanges();
-                expect(guxdeleteSpy).not.toHaveReceivedEvent();
-            });
-        });
-        describe('keypress', () => {
-            it('should emit guxdelete if tag is focused and removable and "Delete" is pressed', async () => {
-                const html = `<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const guxdeleteSpy = await page.spyOnEvent('guxdelete');
-                await deleteButton.press('Delete');
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveReceivedEvent();
-            });
-            it('should emit guxdelete if tag is focused and removable and "Backspace" is pressed', async () => {
-                const html = `<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>navy</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const guxdeleteSpy = await page.spyOnEvent('guxdelete');
-                await deleteButton.press('Backspace');
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveReceivedEvent();
-            });
-        });
-    });
-    describe('tooltip', () => {
-        describe('hover', () => {
-            it('should show the tooltip on hover for tags with overflow text', async () => {
-                const html = `<gux-tag style="width:100px" lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>Long long long long long long long</gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const titleElement = await element.find('pierce/gux-tooltip-title');
-                const tooltipElement = await titleElement.find('gux-tooltip');
-                expect(tooltipElement).not.toBeNull();
-                expect(tooltipElement).toHaveAttribute('hidden');
-                expect(tooltipElement.textContent).toEqual('Long long long long long long long');
-                await titleElement.hover();
-                await page.waitForChanges();
-                expect(tooltipElement).not.toHaveAttribute('hidden');
-                await deleteButton.hover();
-                await page.waitForChanges();
-                expect(tooltipElement).toHaveAttribute('hidden');
-            });
-            it('should show the tooltip on hover for tags with icon only', async () => {
-                const html = `<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" screenreader-text="test tag"></gux-icon></gux-tag>`;
-                const page = await newSparkE2EPage({ html });
-                const element = await page.find('gux-tag');
-                const deleteButton = await element.find('pierce/.gux-tag-remove-button');
-                const titleElement = await element.find('pierce/gux-tooltip-title');
-                const tooltipElement = await titleElement.find('gux-tooltip');
-                expect(tooltipElement).not.toBeNull();
-                expect(tooltipElement).toHaveAttribute('hidden');
-                expect(tooltipElement.textContent).toEqual('test tag');
-                await titleElement.hover();
-                await page.waitForChanges();
-                expect(tooltipElement).not.toHaveAttribute('hidden');
-                await deleteButton.hover();
-                await page.waitForChanges();
-                expect(tooltipElement).toHaveAttribute('hidden');
-            });
-        });
-    });
-    describe('a11y', () => {
-        ['small', 'large'].forEach(size => {
-            describe(size, () => {
-                ['bold', 'subtle'].forEach(emphasis => {
-                    describe(emphasis, () => {
-                        [
-                            'default',
-                            '1',
-                            '2',
-                            '3',
-                            '4',
-                            '5',
-                            '6',
-                            '7',
-                            '8',
-                            '9',
-                            '10'
-                        ].forEach(accent => {
-                            describe(`accent: ${accent}`, () => {
-                                it('should be accessible', async () => {
-                                    const html = `<gux-tag lang="en" size="${size}" emphasis="${emphasis}" accent="${accent}" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>tag</gux-tag>`;
-                                    const page = await newSparkE2EPage({ html });
-                                    await a11yCheck(page);
-                                });
-                                it('should be accessible when disabled', async () => {
-                                    const html = `<gux-tag lang="en" size="${size}" emphasis="${emphasis}" accent="${accent}" removable disabled><gux-icon icon-name="bolt" decorative="true"></gux-icon>tag</gux-tag>`;
-                                    const page = await newSparkE2EPage({ html });
-                                    await a11yCheck(page);
-                                });
-                            });
-                        });
-                    });
-                });
-            });
-        });
-        it('should be accessible when the text overflows the tag', async () => {
-            const html = `<gux-tag style="width:100px" lang="en" accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>Long long long long long long long</gux-tag>`;
-            const page = await newSparkE2EPage({ html });
-            await a11yCheck(page);
-        });
-        it('should be accessible when there is an icon only tag', async () => {
-            const html = `<gux-tag lang="en" accent="1" removable><gux-icon icon-name="bolt" screenreader-text="test tag"></gux-icon></gux-tag>`;
-            const page = await newSparkE2EPage({ html });
-            await a11yCheck(page);
-        });
-    });
-});

package/dist/collection/components/stable/gux-tag/tests/gux-tag.spec.js

@@ -1,134 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxTag } from "../gux-tag";
-const components = [GuxTag];
-const language = 'en';
-describe('gux-tag', () => {
-    describe('#render', () => {
-        [
-            '<gux-tag>default</gux-tag>',
-            '<gux-tag accent="default">default (explicit)</gux-tag>',
-            '<gux-tag accent="1">Accent 1</gux-tag>',
-            '<gux-tag accent="1"><gux-icon icon-name="bolt" decorative="true"></gux-icon>Accent 1</gux-tag>',
-            '<gux-tag accent="1" removable><gux-icon icon-name="bolt" decorative="true"></gux-icon>Accent 1</gux-tag>',
-            '<gux-tag accent="1" removable disabled><gux-icon icon-name="bolt" decorative="true"></gux-icon>Accent 1</gux-tag>',
-            '<gux-tag emphasis="subtle" accent="1">Subtle 1</gux-tag>',
-            '<gux-tag emphasis="bold" accent="1">Bold 1</gux-tag>',
-            '<gux-tag size="small" accent="1">Small 1</gux-tag>',
-            '<gux-tag size="large" accent="1">Large 1</gux-tag>'
-        ].forEach((html, index) => {
-            it(`should render component as expected (${index + 1})`, async () => {
-                const page = await newSpecPage({ components, html, language });
-                expect(page.root).toMatchSnapshot();
-            });
-        });
-    });
-    describe('delete', () => {
-        describe('click', () => {
-            it('should not have a delete button if tag is not removable', async () => {
-                const html = `
-          <gux-tag accent="1">
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const deleteButton = element.shadowRoot.querySelector('.gux-tag-remove-button');
-                expect(deleteButton).toBeNull();
-            });
-            it('should emit guxdelete if tag is removable and not disabled', async () => {
-                const html = `
-          <gux-tag accent="1" removable>
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const deleteButton = element.shadowRoot.querySelector('.gux-tag-remove-button');
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                deleteButton.click();
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveBeenCalled();
-            });
-            it('should not emit guxdelete if tag is removable and disabled', async () => {
-                const html = `
-          <gux-tag accent="1" removable disabled>
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const deleteButton = element.shadowRoot.querySelector('.gux-tag-remove-button');
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                deleteButton.click();
-                await page.waitForChanges();
-                expect(guxdeleteSpy).not.toHaveBeenCalled();
-            });
-        });
-        describe('keypress', () => {
-            it('should emit guxdelete if tag is focused and removable and "Delete" is pressed', async () => {
-                const html = `
-          <gux-tag accent="1" removable>
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                element.dispatchEvent(new KeyboardEvent('keydown', { key: 'Delete' }));
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveBeenCalled();
-            });
-            it('should emit guxdelete if tag is focused and removable and "Backspace" is pressed', async () => {
-                const html = `
-          <gux-tag accent="1" removable>
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>`;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                element.dispatchEvent(new KeyboardEvent('keydown', { key: 'Backspace' }));
-                await page.waitForChanges();
-                expect(guxdeleteSpy).toHaveBeenCalled();
-            });
-            it('should not emit guxdelete if tag is focused and not removable and "Delete" is pressed', async () => {
-                const html = `
-          <gux-tag accent="1">
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                element.dispatchEvent(new KeyboardEvent('keydown', { key: 'Delete' }));
-                await page.waitForChanges();
-                expect(guxdeleteSpy).not.toHaveBeenCalled();
-            });
-            it('should not emit guxdelete if tag is focused and not removable and "Backspace" is pressed', async () => {
-                const html = `
-          <gux-tag accent="1">
-            <gux-icon icon-name="bolt" decorative="true"></gux-icon>
-            navy
-          </gux-tag>
-        `;
-                const page = await newSpecPage({ components, html, language });
-                const element = page.root;
-                const guxdeleteSpy = jest.fn();
-                page.win.addEventListener('guxdelete', guxdeleteSpy);
-                element.dispatchEvent(new KeyboardEvent('keydown', { key: 'Backspace' }));
-                await page.waitForChanges();
-                expect(guxdeleteSpy).not.toHaveBeenCalled();
-            });
-        });
-    });
-});