genesys-spark-components 4.81.3 → 4.83.0

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

@@ -1,136 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxDropdown } from "../gux-dropdown";
-import { GuxListbox } from "../../gux-listbox/gux-listbox";
-import { GuxOption } from "../../gux-listbox/options/gux-option/gux-option";
-import { GuxOptionIcon } from "../../gux-listbox/options/gux-option-icon/gux-option-icon";
-import { GuxOptionGroup } from "../../gux-listbox/option-group/gux-option-group";
-const language = 'en';
-describe('gux-dropdown', () => {
-    describe('#render', () => {
-        it(`should render as expected with gux-option`, async () => {
-            const components = [GuxDropdown, GuxListbox, GuxOption];
-            const html = `
-      <gux-dropdown lang="en" value="j">
-        <gux-listbox aria-label="Animals">
-          <gux-option value="a">Ant<span slot="subtext">Small</span></gux-option>
-          <gux-option value="b">Bat</gux-option>
-          <gux-option value="c">Cat</gux-option>
-          <gux-option value="d">Dog</gux-option>
-          <gux-option value="e">Eel</gux-option>
-          <gux-option value="f">Frog</gux-option>
-          <gux-option value="g">Goat</gux-option>
-          <gux-option value="h">Horse<span slot="subtext">Large</span></gux-option>
-          <gux-option value="i">Ibis</gux-option>
-        </gux-listbox>
-      </gux-dropdown>
-      `;
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxDropdown);
-            expect(page.root).toMatchSnapshot();
-        });
-        it(`should render as expected with gux-option-icon`, async () => {
-            const components = [GuxDropdown, GuxListbox, GuxOptionIcon];
-            const html = `
-      <gux-dropdown lang="en" value="j">
-        <gux-listbox aria-label="Animals">
-          <gux-option-icon
-          icon-name="user"
-          icon-color="var(--gux-blue-60)"
-          value="leonardo"
-          >Leonardo<span slot="subtext">TMNT</span></gux-option-icon
-        >
-        <gux-option-icon icon-name="user" icon-color="#8452cf" value="donatello"
-          >Donatello</gux-option-icon
-        >
-        <gux-option-icon
-          icon-name="user"
-          icon-color="rgb(234, 11, 11)"
-          value="raphael"
-          >Raphael</gux-option-icon
-        >
-        <gux-option-icon
-          icon-name="user"
-          icon-color="#e08915"
-          icon-sr-text="Screenreader information about the icon goes here, if needed"
-          value="michelangelo"
-          >Michelangelo</gux-option-icon
-        >
-        </gux-listbox>
-      </gux-dropdown>
-      `;
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxDropdown);
-            expect(page.root).toMatchSnapshot();
-        });
-        it(`should render as expected with gux-option-group and gux-option`, async () => {
-            const components = [GuxDropdown, GuxListbox, GuxOption, GuxOptionGroup];
-            const html = `
-      <gux-dropdown lang="en" value="f">
-        <gux-listbox aria-label="Animals">
-          <gux-option-group-beta label="Group 1">
-            <gux-option value="a">Ant</gux-option>
-            <gux-option value="b">Bat</gux-option>
-            <gux-option value="c" disabled>Cat</gux-option>
-            <gux-option value="d">Dog</gux-option>
-          </gux-option-group-beta>
-          <gux-option-group-beta label="Group 2">
-            <gux-option value="e">Eel</gux-option>
-            <gux-option value="f">Frog</gux-option>
-            <gux-option value="g">Goat</gux-option>
-          </gux-option-group-beta>
-          <gux-option-group-beta label="Group 3">
-            <gux-option value="h">Horse</gux-option>
-            <gux-option value="i">Ibis</gux-option>
-          </gux-option-group-beta>
-        </gux-listbox>
-      </gux-dropdown>
-      `;
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxDropdown);
-            expect(page.root).toMatchSnapshot();
-        });
-        it(`should render as expected with gux-option-group and gux-option-icon`, async () => {
-            const components = [
-                GuxDropdown,
-                GuxListbox,
-                GuxOptionIcon,
-                GuxOptionGroup
-            ];
-            const html = `
-      <gux-dropdown lang="en" value="f">
-        <gux-listbox aria-label="Animals">
-          <gux-option-group-beta label="Group 1">
-            <gux-option-icon
-            icon-name="user"
-            icon-color="var(--gux-blue-60)"
-            value="leonardo"
-            >Leonardo<span slot="subtext">TMNT</span></gux-option-icon
-          >
-          <gux-option-icon icon-name="user" icon-color="#8452cf" value="donatello"
-            >Donatello</gux-option-icon
-          >
-          </gux-option-group-beta>
-          <gux-option-group-beta label="Group 2">
-            <gux-option-icon
-              icon-name="user"
-              icon-color="rgb(234, 11, 11)"
-              value="raphael"
-              >Raphael</gux-option-icon
-            >
-            <gux-option-icon
-              icon-name="user"
-              icon-color="#e08915"
-              icon-sr-text="Screenreader information about the icon goes here, if needed"
-              value="michelangelo"
-              >Michelangelo</gux-option-icon
-            >
-          </gux-option-group-beta>
-        </gux-listbox>
-      </gux-dropdown>
-      `;
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxDropdown);
-            expect(page.root).toMatchSnapshot();
-        });
-    });
-});

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

@@ -1,284 +0,0 @@
-import { newSparkE2EPage, a11yCheck } from "../../../../test/e2eTestUtils";
-const axeExclusions = [
-    {
-        issueId: 'target-size',
-        target: 'gux-dropdown-multi,button',
-        exclusionReason: 'COMUI-2948 Fix any of the following: Target has insufficient size (20px by 18px, should be at least 24px by 24px); Target has insufficient space to its closest neighbors. Safe clickable space has a diameter of 20px instead of at least 24px.'
-    }
-];
-describe('gux-dropdown-multi', () => {
-    const html = `
-    <gux-dropdown-multi lang="en">
-      <gux-listbox-multi aria-label="Animals">
-        <gux-option-multi value="a">Ant<span slot="subtext">Small</span></gux-option-multi>
-        <gux-option-multi value="b">Bat</gux-option-multi>
-        <gux-option-multi value="c">Cat</gux-option-multi>
-        <gux-option-multi value="d">Dog</gux-option-multi>
-        <gux-option-multi value="e">Eel</gux-option-multi>
-        <gux-option-multi value="f">Frog</gux-option-multi>
-        <gux-option-multi value="g">Goat</gux-option-multi>
-        <gux-option-multi value="h">Horse<span slot="subtext">Large</span></gux-option-multi>
-        <gux-option-multi value="i">Ibis</gux-option-multi>
-      </gux-listbox-multi>
-    </gux-dropdown-multi>
-  `;
-    describe('#render', () => {
-        it('renders', async () => {
-            const page = await newSparkE2EPage({ html });
-            const element = await page.find('gux-dropdown-multi');
-            expect(element).toHaveAttribute('hydrated');
-        });
-    });
-    describe('click', () => {
-        it('opens drop down on click', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            await a11yCheck(page, axeExclusions, 'before opening dropdown');
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            await a11yCheck(page, axeExclusions, 'after opening dropdown');
-            const dropMenu = await page.find('pierce/.gux-popup-container');
-            expect(dropMenu.className.split(' ')).toContain('gux-expanded');
-        });
-        it('selects and unselects items on click', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            let selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(0);
-            const listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi');
-            await listboxItems[0].click();
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(1);
-            await listboxItems[1].click();
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(2);
-            await listboxItems[0].click();
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(1);
-        });
-        it('clears all selections', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            const listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi');
-            await listboxItems[0].click();
-            await listboxItems[1].click();
-            await listboxItems[2].click();
-            await page.waitForChanges();
-            let selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(3);
-            let removeButton = await page.findAll('pierce/.gux-tag-remove-button');
-            expect(removeButton.length).toBe(1);
-            await removeButton[0].click();
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(0);
-            removeButton = await page.findAll('pierce/.gux-tag-remove-button');
-            expect(removeButton.length).toBe(0);
-        });
-        it('does not close dropdown when an option is selected', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            const dropMenu = await page.find('pierce/.gux-popup-container');
-            expect(dropMenu.className.split(' ')).toContain('gux-expanded');
-        });
-    });
-    describe('press', () => {
-        it('opens and closes dropdown on keypress', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.press('ArrowDown');
-            const dropdownMenu = await page.find('pierce/.gux-popup-container');
-            expect(dropdownMenu.className.split(' ')).toContain('gux-expanded');
-            await dropdownMenu.press('Escape');
-            expect(dropdownMenu.className.split(' ')).not.toContain('gux-expanded');
-        });
-        it('focuses the listbox when down arrow is pressed', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.press('ArrowDown');
-            const listbox = await page.find('gux-dropdown-multi gux-listbox-multi');
-            const focusEl = await page.find(':focus');
-            expect(listbox.outerHTML).toContain(focusEl.outerHTML);
-        });
-        it('moves between options when arrow keys are pressed', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.press('ArrowDown');
-            const listbox = await page.find('gux-dropdown-multi gux-listbox-multi');
-            const listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi');
-            let activeItem = await listbox.findAll('.gux-active');
-            expect(activeItem.length).toBe(1);
-            expect(activeItem[0].outerHTML).toContain(listboxItems[0].outerHTML);
-            await activeItem[0].press('ArrowDown');
-            activeItem = await listbox.findAll('.gux-active');
-            expect(activeItem[0].outerHTML).toContain(listboxItems[1].outerHTML);
-        });
-        it('selects and unselects listbox options on keypress', async () => {
-            const page = await newSparkE2EPage({ html });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.press('ArrowDown');
-            let listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi');
-            let selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(0);
-            await page.keyboard.press('Enter');
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi');
-            expect(selectedItems.length).toBe(1);
-            expect(selectedItems[0].outerHTML).toContain(listboxItems[0].outerHTML);
-            await page.keyboard.press('ArrowDown');
-            await page.keyboard.press('ArrowDown');
-            await page.keyboard.press('Enter');
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(2);
-            await page.keyboard.press('Enter');
-            await page.waitForChanges();
-            selectedItems = await page.findAll('.gux-selected');
-            expect(selectedItems.length).toBe(1);
-        });
-    });
-    describe('filter', () => {
-        it('filters dropdown contents (filter-type starts-with)', async () => {
-            const filterableDropdown = `
-      <gux-dropdown-multi filter-type="starts-with" lang="en">
-        <gux-listbox-multi aria-label="Animals">
-          <gux-option-multi value="ant">Ant</gux-option-multi>
-          <gux-option-multi value="bear">Bear</gux-option-multi>
-          <gux-option-multi value="bat">Bat</gux-option-multi>
-          <gux-option-multi value="cat">Cat</gux-option-multi>
-          <gux-option-multi value="dog">Dog</gux-option-multi>
-        </gux-listbox-multi>
-      </gux-dropdown-multi>
-    `;
-            const page = await newSparkE2EPage({ html: filterableDropdown });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            let listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi:not(.gux-filtered)');
-            expect(listboxItems.length).toBe(5);
-            await page.keyboard.press('b');
-            await page.waitForChanges();
-            listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi:not(.gux-filtered)');
-            expect(listboxItems.length).toBe(2);
-            expect(listboxItems[0].textContent).toEqual('Bear');
-        });
-        it('does not filter dropdown contents (filter-type custom)', async () => {
-            const filterableDropdown = `
-      <gux-dropdown-multi filter-type="custom" lang="en">
-        <gux-listbox-multi aria-label="Animals">
-          <gux-option-multi value="ant">Ant</gux-option-multi>
-          <gux-option-multi value="bear">Bear</gux-option-multi>
-          <gux-option-multi value="bat">Bat</gux-option-multi>
-          <gux-option-multi value="cat">Cat</gux-option-multi>
-          <gux-option-multi value="dog">Dog</gux-option-multi>
-        </gux-listbox-multi>
-      </gux-dropdown-multi>
-    `;
-            const page = await newSparkE2EPage({ html: filterableDropdown });
-            await page.waitForChanges();
-            const dropdownButtonElement = await page.find('pierce/.gux-field');
-            await dropdownButtonElement.click();
-            await page.waitForChanges();
-            let listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi:not(.gux-filtered)');
-            expect(listboxItems.length).toBe(5);
-            await page.keyboard.press('b');
-            await page.waitForChanges();
-            listboxItems = await page.findAll('gux-dropdown-multi gux-listbox-multi gux-option-multi:not(.gux-filtered)');
-            expect(listboxItems.length).toBe(5);
-            expect(listboxItems[0].textContent).toEqual('Ant');
-        });
-        describe('with the create option set', () => {
-            it('provides the option to create items', async () => {
-                const { page, dropdown } = await setupPage(creatableDropdown);
-                await inputFilter(page, dropdown, 'bee');
-                const createAction = await getCreateAction(dropdown);
-                await a11yCheck(page, axeExclusions);
-                expect(createAction).not.toBeNull();
-                expect(createAction).not.toHaveClass('gux-filtered');
-            });
-            it('does not provide a create option if there is an exact match', async () => {
-                const { page, dropdown } = await setupPage(creatableDropdown);
-                await inputFilter(page, dropdown, 'cat');
-                const createAction = await getCreateAction(dropdown);
-                expect(createAction).toHaveClass('gux-filtered');
-            });
-            it('updates dropdown multi and listbox value when slot changes', async () => {
-                const { page, dropdown, listbox } = await setupPage(creatableDropdown);
-                let dropdownValue = await dropdown.getProperty('value');
-                let listboxValue = await listbox.getProperty('value');
-                let selectedItems = await page.findAll('.gux-selected');
-                expect(selectedItems.length).toBe(0);
-                expect(dropdownValue).toEqual(undefined);
-                expect(listboxValue).toEqual(undefined);
-                await addNewCustomOption(page);
-                selectedItems = await page.findAll('.gux-selected');
-                expect(selectedItems.length).toBe(1);
-                dropdownValue = await dropdown.getProperty('value');
-                listboxValue = await listbox.getProperty('value');
-                expect(dropdownValue).toEqual('newoption');
-                expect(listboxValue).toEqual('newoption');
-            });
-        });
-    });
-});
-// HELPER FUNCTIONS
-async function setupPage(html) {
-    const page = await newSparkE2EPage({ html });
-    await page.waitForChanges();
-    const dropdown = await page.find('gux-dropdown-multi');
-    const listbox = await page.find('gux-listbox-multi');
-    const listboxOptions = await page.findAll('gux-option-multi');
-    return { page, dropdown, listbox, listboxOptions };
-}
-async function inputFilter(page, dropdown, text) {
-    const dropdownButton = await dropdown.find('pierce/.gux-field');
-    await dropdownButton.click();
-    await page.waitForChanges();
-    const input = await dropdown.find('pierce/.gux-filter-input');
-    for (const char of text.split('')) {
-        await input.press(char);
-    }
-}
-async function getCreateAction(dropdown) {
-    return await dropdown.find('gux-create-option');
-}
-async function addNewCustomOption(page) {
-    await page.evaluate(() => {
-        const listboxElement = document.querySelector('gux-listbox-multi');
-        const element = document.createElement('gux-option-multi');
-        element.setAttribute('custom', 'true');
-        element.setAttribute('value', 'newoption');
-        element.innerText = 'newoption';
-        listboxElement.appendChild(element);
-    });
-    await page.waitForChanges();
-}
-const creatableDropdown = `
-<gux-dropdown-multi lang="en">
-  <gux-listbox-multi aria-label="Animals">
-    <gux-create-option slot="create"></gux-create-option>
-    <gux-option-multi value="ant">Ant<span slot="subtext">Small</span></gux-option-multi>
-    <gux-option-multi value="bear">Bear</gux-option-multi>
-    <gux-option-multi value="cat">Cat</gux-option-multi>
-  </gux-listbox-multi>
-</gux-dropdown-multi>
-`;

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

@@ -1,24 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxDropdownMulti } from "../gux-dropdown-multi";
-import { GuxListboxMulti } from "../../gux-listbox-multi/gux-listbox-multi";
-import { GuxOptionMulti } from "../../gux-listbox-multi/gux-option-multi/gux-option-multi";
-const components = [GuxDropdownMulti, GuxListboxMulti, GuxOptionMulti];
-const html = `
-<gux-dropdown-multi>
-  <gux-listbox-multi aria-label="Animals">
-    <gux-option-multi value="a" disabled>Ant</gux-option-multi>
-    <gux-option-multi value="b">Bat</gux-option-multi>
-    <gux-option-multi value="c">Cat<span slot="subtext">Medium</span></gux-option-multi>
-  </gux-listbox-multi>
-</gux-dropdown-multi>
-`;
-const language = 'en';
-describe('gux-dropdown', () => {
-    describe('#render', () => {
-        it(`should render as expected`, async () => {
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxDropdownMulti);
-            expect(page.root).toMatchSnapshot();
-        });
-    });
-});

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

@@ -1,71 +0,0 @@
-import { newSparkE2EPage, a11yCheck } from "../../../../test/e2eTestUtils";
-describe('gux-flyout-menu', () => {
-    const html = `
-    <gux-flyout-menu>
-      <span slot="target">Example Target Element</span>
-      <gux-menu slot="menu">
-        <gux-menu-option>Option One</gux-menu-option>
-        <gux-submenu label="Submenu Two">
-          <gux-menu-option>Option One</gux-menu-option>
-          <gux-submenu label="Submenu Two">
-            <gux-menu-option>Option One</gux-menu-option>
-            <gux-menu-option>Option Two</gux-menu-option>
-            <gux-menu-option>Option Three</gux-menu-option>
-          </gux-submenu>
-          <gux-menu-option>Option Three</gux-menu-option>
-        </gux-submenu>
-        <gux-menu-option>Option Three</gux-menu-option>
-        <gux-menu-option>Option Four</gux-menu-option>
-        <gux-submenu label="Submenu Five">
-          <gux-menu-option>Option One</gux-menu-option>
-          <gux-menu-option>Option Two</gux-menu-option>
-          <gux-submenu label="Submenu Three">
-            <gux-menu-option>Option One</gux-menu-option>
-            <gux-submenu label="Submenu Two">
-              <gux-menu-option>Option One</gux-menu-option>
-              <gux-submenu label="Submenu Two">
-                <gux-menu-option>Option One</gux-menu-option>
-                <gux-menu-option>Option Two</gux-menu-option>
-                <gux-menu-option>Option Three</gux-menu-option>
-              </gux-submenu>
-              <gux-menu-option>Option Three</gux-menu-option>
-            </gux-submenu>
-            <gux-menu-option>Option Three</gux-menu-option>
-          </gux-submenu>
-        </gux-submenu>
-      </gux-menu>
-    </gux-flyout-menu>
-  `;
-    describe('#render', () => {
-        it(`should render as expected`, async () => {
-            const page = await newSparkE2EPage({ html });
-            const element = await page.find('gux-flyout-menu');
-            await a11yCheck(page);
-            expect(element.outerHTML).toMatchSnapshot();
-        });
-    });
-    describe('hover', () => {
-        it('opens flyout menu', async () => {
-            const page = await newSparkE2EPage({ html });
-            const element = await page.find('gux-flyout-menu');
-            const menuWrapper = await element.find('pierce/.gux-flyout-menu-content');
-            expect(menuWrapper).not.toHaveClass('gux-shown');
-            await element.hover();
-            await page.waitForChanges();
-            await a11yCheck(page);
-            expect(menuWrapper).toHaveClass('gux-shown');
-        });
-        it('opens submenus', async () => {
-            const page = await newSparkE2EPage({ html });
-            const element = await page.find('gux-flyout-menu');
-            await element.hover();
-            await page.waitForChanges();
-            const submenu = await page.find('gux-submenu');
-            const submenuWrapper = await submenu.find('pierce/.gux-submenu-wrapper');
-            await submenu.hover();
-            await page.waitForChanges();
-            await a11yCheck(page);
-            expect(submenuWrapper).toHaveClass('gux-shown');
-        });
-    });
-});

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

@@ -1,52 +0,0 @@
-import { newSpecPage } from "../../../../test/specTestUtils";
-import { GuxFlyoutMenu } from "../gux-flyout-menu";
-import { GuxMenu } from "../gux-menu/gux-menu";
-import { GuxSubmenu } from "../gux-menu/gux-submenu/gux-submenu";
-import { GuxMenuOption } from "../gux-menu/gux-menu-option/gux-menu-option";
-const components = [GuxFlyoutMenu, GuxMenu, GuxSubmenu, GuxMenuOption];
-const html = `
-  <gux-flyout-menu>
-    <span slot="target">Example Target Element</span>
-    <gux-menu slot="menu">
-      <gux-menu-option>Option One</gux-menu-option>
-      <gux-submenu label="Submenu Two">
-        <gux-menu-option>Option One</gux-menu-option>
-        <gux-submenu label="Submenu Two">
-          <gux-menu-option>Option One</gux-menu-option>
-          <gux-menu-option>Option Two</gux-menu-option>
-          <gux-menu-option>Option Three</gux-menu-option>
-        </gux-submenu>
-        <gux-menu-option>Option Three</gux-menu-option>
-      </gux-submenu>
-      <gux-menu-option>Option Three</gux-menu-option>
-      <gux-menu-option>Option Four</gux-menu-option>
-      <gux-submenu label="Submenu Five">
-        <gux-menu-option>Option One</gux-menu-option>
-        <gux-menu-option>Option Two</gux-menu-option>
-        <gux-submenu label="Submenu Three">
-          <gux-menu-option>Option One</gux-menu-option>
-          <gux-submenu label="Submenu Two">
-            <gux-menu-option>Option One</gux-menu-option>
-            <gux-submenu label="Submenu Two">
-              <gux-menu-option>Option One</gux-menu-option>
-              <gux-menu-option>Option Two</gux-menu-option>
-              <gux-menu-option>Option Three</gux-menu-option>
-            </gux-submenu>
-            <gux-menu-option>Option Three</gux-menu-option>
-          </gux-submenu>
-          <gux-menu-option>Option Three</gux-menu-option>
-        </gux-submenu>
-      </gux-submenu>
-    </gux-menu>
-  </gux-flyout-menu>
-`;
-const language = 'en';
-describe('gux-flyout-menu', () => {
-    describe('#render', () => {
-        it(`should render as expected`, async () => {
-            const page = await newSpecPage({ components, html, language });
-            expect(page.rootInstance).toBeInstanceOf(GuxFlyoutMenu);
-            expect(page.root).toMatchSnapshot();
-        });
-    });
-});

package/dist/collection/components/stable/gux-form-field/components/gux-form-field-checkbox/tests/gux-form-field-checkbox.e2e.js

@@ -1,93 +0,0 @@
-import { newE2EPage } from "@stencil/core/testing";
-import { newSparkE2EPage, a11yCheck } from "../../../../../../test/e2eTestUtils";
-const axeExclusions = [];
-async function newNonrandomE2EPage({ html }) {
-    const page = await newE2EPage();
-    await page.evaluateOnNewDocument(() => {
-        Math.random = () => 0.5;
-    });
-    await page.setContent(html);
-    await page.waitForChanges();
-    return page;
-}
-describe('gux-form-field-checkbox', () => {
-    describe('#render', () => {
-        [
-            `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
-          <label slot="label">Pizza</label>
-        </gux-form-field-checkbox>
-      `,
-            `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza" disabled/>
-          <label slot="label">Pizza</label>
-        </gux-form-field-checkbox>
-      `,
-            `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
-          <label slot="label">Pizza</label>
-          <span slot="error">This is an error message</span>
-        </gux-form-field-checkbox>
-      `,
-            `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza" checked/>
-          <label slot="label">Pizza</label>
-        </gux-form-field-checkbox>
-      `,
-            `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
-          <label slot="label">Pizza</label>
-          <span slot="error">Error message</span>
-        </gux-form-field-checkbox>
-      `,
-            `
-      <gux-form-field-checkbox>
-        <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
-        <label slot="label">Pizza</label>
-        <span slot="help">This is a help message</span>
-      </gux-form-field-checkbox>
-    `
-        ].forEach((html, index) => {
-            it(`should render component as expected (${index + 1})`, async () => {
-                const page = await newNonrandomE2EPage({ html });
-                const element = await page.find('gux-form-field-checkbox');
-                const elementShadowDom = await element.find('pierce/.gux-form-field-container');
-                expect(element.outerHTML).toMatchSnapshot();
-                expect(elementShadowDom).toMatchSnapshot();
-            });
-            it(`should be accessible (${index + 1})`, async () => {
-                const page = await newSparkE2EPage({ html });
-                await a11yCheck(page, axeExclusions);
-            });
-        });
-    });
-    it('switches between states when clicked', async () => {
-        const page = await newSparkE2EPage({
-            html: `
-        <gux-form-field-checkbox>
-          <input slot="input" type="checkbox" name="food-1[]" value="pizza"/>
-          <label slot="label">Pizza</label>
-        </gux-form-field-checkbox>
-      `
-        });
-        const element = await page.find('gux-form-field-checkbox');
-        const label = await element.find('label');
-        const input = await element.find('input');
-        await a11yCheck(page, axeExclusions, 'Before checking checkbox');
-        await label.click();
-        await page.waitForChanges();
-        expect(await input.getProperty('checked')).toBe(true);
-        await a11yCheck(page, axeExclusions, 'After checking checkbox');
-        await label.click();
-        await page.waitForChanges();
-        expect(await input.getProperty('checked')).toBe(false);
-        await label.click();
-        await page.waitForChanges();
-        expect(await input.getProperty('checked')).toBe(true);
-    });
-});