q2-tecton-elements 1.46.1 → 1.48.0

package/dist/test/elements/q2-dropdown-item-test.e2e.js

@@ -1,12 +1,13 @@
 import { setTestStrings, setup, dispatchEvent, testDeprecatedAriaLabel, getListOfStyleCompilationIssues, evaluateA11y, } from "../helpers";
 describe('q2-dropdown-item', () => {
-    it('properly compiles CSS vars and functions', async () => {
-        const page = await setup({ html: '<q2-dropdown-item></q2-dropdown-item>' });
-        expect(await getListOfStyleCompilationIssues(page, 'q2-dropdown-item')).toHaveLength(0);
-    });
+    let page;
+    let item;
+    let itemBtn;
+    let itemSeparator;
+    let removeBtn;
     describe('[A11y] guideline compliance', () => {
         it('Does not have accessibility violations with only label', async () => {
-            const page = await setup({
+            page = await setup({
                 html: `
                     <div role="menu">
                         <q2-dropdown-item value="itemValue">item text</q2-dropdown-item>
@@ -17,74 +18,38 @@ describe('q2-dropdown-item', () => {
             expect(hasViolations).toBe(false);
         });
     });
+    it('properly compiles CSS vars and functions', async () => {
+        page = await setup({ html: '<q2-dropdown-item></q2-dropdown-item>' });
+        expect(await getListOfStyleCompilationIssues(page, 'q2-dropdown-item')).toHaveLength(0);
+    });
     it('renders base state', async function () {
-        const page = await setup({
+        page = await setup({
             html: `
                 <q2-dropdown-item value="itemValue">item text</q2-dropdown-item>
             `,
         });
-        const itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
+        itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
         expect(itemBtn).not.toBeNull();
         expect(itemBtn.tagName.toLowerCase()).toEqual('q2-btn');
         expect(itemBtn).toHaveClass('dropdown-item');
         expect(itemBtn).not.toHaveAttribute('disabled');
         expect(await itemBtn.getProperty('_role')).toEqual('menuitem');
-        const itemSeparator = await page.find('q2-dropdown-item >>> [test-id="dropdownItemSeparator"]');
+        itemSeparator = await page.find('q2-dropdown-item >>> [test-id="dropdownItemSeparator"]');
         expect(itemSeparator).toBeNull();
         const itemSlotText = await page.$eval('q2-dropdown-item', (element) => element.shadowRoot.querySelector('slot').assignedNodes()[0].textContent);
         expect(itemSlotText).toEqual('item text');
-        const item = await page.find('q2-dropdown-item');
+        item = await page.find('q2-dropdown-item');
         item.setProperty('disabled', true);
         await page.waitForChanges();
         expect(itemBtn).toHaveAttribute('disabled');
     });
-    it('renders as separator', async function () {
-        const page = await setup({
-            html: `
-                <q2-dropdown-item value="itemValue" separator>item text</q2-dropdown-item>
-            `,
-        });
-        const itemSeparator = await page.find('q2-dropdown-item >>> [test-id="dropdownItemSeparator"]');
-        expect(itemSeparator).not.toBeNull();
-        expect(itemSeparator).toEqualAttribute('role', 'separator');
-        expect(itemSeparator).toHaveClass('dropdown-separator');
-        const itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
-        expect(itemBtn).toBeNull();
-    });
-    it('handles removability', async function () {
-        const page = await setup({
-            html: `
-                <q2-dropdown-item value="itemValue">item text</q2-dropdown-item>
-            `,
-        });
-        let removeBtn = await page.find('q2-dropdown-item >>> [test-id="removeDropdownItem"]');
-        expect(removeBtn).toBeNull();
-        await setTestStrings(page, {
-            'tecton.element.dropdownItem.remove': 'Remove Option {0}',
-        });
-        const item = await page.find('q2-dropdown-item');
-        item.setProperty('removable', true);
-        await page.waitForChanges();
-        removeBtn = await page.find('q2-dropdown-item >>> [test-id="removeDropdownItem"]');
-        expect(removeBtn).not.toBeNull();
-        expect(removeBtn).toHaveClass('remove-dropdown-item');
-        expect(removeBtn).not.toHaveAttribute('disabled');
-        expect(removeBtn).toEqualAttribute('label', 'Remove Option ');
-        expect(await removeBtn.getProperty('_role')).toEqual('menuitem');
-        item.setProperty('label', 'Item Text');
-        await page.waitForChanges();
-        expect(removeBtn).toEqualAttribute('label', 'Remove Option Item Text');
-        item.setProperty('disabled', true);
-        await page.waitForChanges();
-        expect(removeBtn).toHaveAttribute('disabled');
-    });
     it('correctly emits click event', async function () {
-        const page = await setup({
+        page = await setup({
             html: `
                 <q2-dropdown-item value="itemValue" removable>item text</q2-dropdown-item>
             `,
         });
-        const item = await page.find('q2-dropdown-item');
+        item = await page.find('q2-dropdown-item');
         const clickSpy = await item.spyOnEvent('click');
         await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'click');
         expect(clickSpy).toHaveReceivedEventTimes(1);
@@ -93,56 +58,8 @@ describe('q2-dropdown-item', () => {
         expect(clickSpy).toHaveReceivedEventTimes(2);
         expect(clickSpy).toHaveReceivedEventDetail({ type: 'remove', value: 'itemValue' });
     });
-    it('does not trigger focus delegator when item or remove btn focused', async function () {
-        const page = await setup({
-            html: `
-                <q2-dropdown-item value="itemValue" removable>item text</q2-dropdown-item>
-            `,
-        });
-        const item = await page.find('q2-dropdown-item');
-        const itemFocusSpy = await item.spyOnEvent('focus');
-        const itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
-        const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');
-        expect(itemFocusSpy).toHaveReceivedEventTimes(0);
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'focus');
-        expect(itemFocusSpy).toHaveReceivedEventTimes(0);
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'focus');
-        expect(itemFocusSpy).toHaveReceivedEventTimes(0);
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);
-    });
-    it('handles focus manipulation', async function () {
-        const page = await setup({
-            html: `
-                <q2-dropdown-item value="itemValue" removable>item text</q2-dropdown-item>
-            `,
-        });
-        const itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
-        const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');
-        const removeBtn = await page.find('q2-dropdown-item >>> [test-id="removeDropdownItem"]');
-        const removeBtnFocusSpy = await removeBtn.spyOnEvent('focus');
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
-        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(0);
-        await dispatchEvent(page, 'q2-dropdown-item', 'focus');
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'keydown', {
-            key: 'ArrowRight',
-        });
-        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(2);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'keydown', {
-            key: 'ArrowLeft',
-        });
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(4);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'keydown', {
-            key: 'Right',
-        });
-        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(4);
-        await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'keydown', { key: 'Left' });
-        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(6);
-    });
     it('item content is the same width as the q2-btn', async function () {
-        const page = await setup({
+        page = await setup({
             html: `<q2-dropdown-item>Test</q2-dropdown-item>`,
         });
         const { btnWidth, contentWidth, btnPadding } = await page.$eval('q2-dropdown-item', (el) => {
@@ -159,17 +76,179 @@ describe('q2-dropdown-item', () => {
         });
         expect(btnWidth).toEqual(contentWidth + btnPadding * 2);
     });
+    describe('Props', () => {
+        describe('label', () => {
+            describe('when provided', () => {
+                it('applies label to itemDOM() button', async () => {
+                    page = await setup({
+                        html: `
+                        <div role="menu">
+                            <q2-dropdown-item value="itemValue" label="item text"></q2-dropdown-item>
+                        </div>
+                    `,
+                    });
+                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                    expect(itemBtn.getAttribute('label')).toEqual('item text');
+                });
+            });
+            describe('when not provided', () => {
+                it('tries to use textContent to apply label to itemDOM() button', async () => {
+                    page = await setup({
+                        html: `
+                        <div role="menu">
+                            <q2-dropdown-item value="itemValue">item text</q2-dropdown-item>
+                        </div>
+                    `,
+                    });
+                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                    expect(itemBtn.getAttribute('label')).toEqual('item text');
+                });
+                it('applies label to itemDOM() button when using q2-loc component (TCT-2678)', async () => {
+                    page = await setup({
+                        html: `
+                        <div role="menu">
+                            <q2-dropdown-item value="itemValue"><q2-loc value="item text"/></q2-dropdown-item>
+                        </div>
+                    `,
+                    });
+                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                    expect(itemBtn.getAttribute('label')).toEqual('item text');
+                });
+            });
+        });
+        describe('separator', () => {
+            it('renders as a separator', async () => {
+                page = await setup({
+                    html: `
+                    <q2-dropdown-item value="itemValue" separator>item text</q2-dropdown-item>
+                `,
+                });
+                itemSeparator = await page.find('q2-dropdown-item >>> .dropdown-separator');
+                expect(itemSeparator).not.toBeNull();
+                expect(itemSeparator).toEqualAttribute('role', 'separator');
+                expect(itemSeparator).toHaveClass('dropdown-separator');
+                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                expect(itemBtn).toBeNull();
+            });
+        });
+        describe('removable', () => {
+            beforeEach(async () => {
+                page = await setup({
+                    html: ``,
+                });
+                await setTestStrings(page, {
+                    'tecton.element.dropdownItem.remove': 'Remove Option {0}',
+                });
+                await page.setContent('<q2-dropdown-item value="itemValue" removable></q2-dropdown-item>');
+                await page.waitForChanges();
+            });
+            it('renders a remove button', async () => {
+                item = await page.find('q2-dropdown-item');
+                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');
+                expect(removeBtn).not.toBeNull();
+                expect(removeBtn).not.toHaveAttribute('disabled');
+                expect(removeBtn).toEqualAttribute('label', 'Remove Option ');
+                expect(await removeBtn.getProperty('_role')).toEqual('menuitem');
+            });
+            it('uses item label in remove button label', async () => {
+                item = await page.find('q2-dropdown-item');
+                item.setProperty('label', 'Item Text');
+                await page.waitForChanges();
+                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');
+                expect(removeBtn).not.toBeNull();
+                expect(removeBtn).toEqualAttribute('label', 'Remove Option Item Text');
+            });
+        });
+        describe('disabled', () => {
+            it('disables the dropdown item', async () => {
+                page = await setup({
+                    html: `
+                        <div role="menu">
+                            <q2-dropdown-item value="itemValue" disabled></q2-dropdown-item>
+                        </div>
+                    `,
+                });
+                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                expect(itemBtn).toHaveAttribute('disabled');
+            });
+            it('disables the remove button when removable', async () => {
+                page = await setup({
+                    html: `
+                        <div role="menu">
+                            <q2-dropdown-item value="itemValue" disabled removable></q2-dropdown-item>
+                        </div>
+                    `,
+                });
+                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');
+                expect(itemBtn).toHaveAttribute('disabled');
+                expect(removeBtn).toHaveAttribute('disabled');
+            });
+        });
+    });
+    describe('Focus', () => {
+        it('does not trigger focus delegator when item or remove btn focused', async function () {
+            page = await setup({
+                html: `
+                <q2-dropdown-item value="itemValue" removable>item text</q2-dropdown-item>
+            `,
+            });
+            item = await page.find('q2-dropdown-item');
+            const itemFocusSpy = await item.spyOnEvent('focus');
+            itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
+            const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');
+            expect(itemFocusSpy).toHaveReceivedEventTimes(0);
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'focus');
+            expect(itemFocusSpy).toHaveReceivedEventTimes(0);
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'focus');
+            expect(itemFocusSpy).toHaveReceivedEventTimes(0);
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);
+        });
+        it('handles focus manipulation', async function () {
+            page = await setup({
+                html: `
+                <q2-dropdown-item value="itemValue" removable>item text</q2-dropdown-item>
+            `,
+            });
+            itemBtn = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
+            const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');
+            removeBtn = await page.find('q2-dropdown-item >>> [test-id="removeDropdownItem"]');
+            const removeBtnFocusSpy = await removeBtn.spyOnEvent('focus');
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);
+            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(0);
+            await dispatchEvent(page, 'q2-dropdown-item', 'focus');
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'keydown', {
+                key: 'ArrowRight',
+            });
+            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(2);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'keydown', {
+                key: 'ArrowLeft',
+            });
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(4);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="dropdownItem"]'], 'keydown', {
+                key: 'Right',
+            });
+            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(4);
+            await dispatchEvent(page, ['q2-dropdown-item', '[test-id="removeDropdownItem"]'], 'keydown', {
+                key: 'Left',
+            });
+            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(6);
+        });
+    });
     describe('Deprecations', () => {
         it('handles deprecated `ariaLabel` prop', async () => {
             const label = 'My Label';
-            const page = await setup({
+            page = await setup({
                 html: `<q2-dropdown-item aria-label="${label}">Text</q2-dropdown-item>`,
             });
             await page.waitForChanges();
             await testDeprecatedAriaLabel(await page.find('q2-dropdown-item'), label);
-            const button = await page.find('q2-dropdown-item >>> [test-id="dropdownItem"]');
-            expect(button).toEqualAttribute('label', label);
-            expect(button).toHaveAttribute('hide-label');
+            itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');
+            expect(itemBtn).toEqualAttribute('label', label);
+            expect(itemBtn).toHaveAttribute('hide-label');
         });
     });
 });

package/dist/test/elements/q2-dropdown-item-test.e2e.js.map

@@ -1 +1 @@
-{"version":3,"file":"q2-dropdown-item-test.e2e.js","sourceRoot":"","sources":["../../../test/elements/q2-dropdown-item-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n    setTestStrings,\n    setup,\n    dispatchEvent,\n    testDeprecatedAriaLabel,\n    getListOfStyleCompilationIssues,\n    evaluateA11y,\n} from '../helpers';\n\ndescribe('q2-dropdown-item', () => {\n    it('properly compiles CSS vars and functions', async () => {\n        const page = await setup({ html: '<q2-dropdown-item></q2-dropdown-item>' });\n        expect(await getListOfStyleCompilationIssues(page, 'q2-dropdown-item')).toHaveLength(0);\n    });\n\n    describe('[A11y] guideline compliance', () => {\n        it('Does not have accessibility violations with only label', async () => {\n            const page = await setup({\n                html: `\n                    <div role=\"menu\">\n                        <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n                    </div>\n                `,\n            });\n            const hasViolations = await evaluateA11y(page);\n            expect(hasViolations).toBe(false);\n        });\n    });\n\n    it('renders base state', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n            `,\n        });\n\n        const itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n        expect(itemBtn).not.toBeNull();\n        expect(itemBtn.tagName.toLowerCase()).toEqual('q2-btn');\n        expect(itemBtn).toHaveClass('dropdown-item');\n        expect(itemBtn).not.toHaveAttribute('disabled');\n        expect(await itemBtn.getProperty('_role')).toEqual('menuitem');\n\n        const itemSeparator = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItemSeparator\"]');\n        expect(itemSeparator).toBeNull();\n\n        const itemSlotText = await page.$eval(\n            'q2-dropdown-item',\n            (element: HTMLQ2DropdownItemElement) =>\n                element.shadowRoot.querySelector('slot').assignedNodes()[0].textContent\n        );\n        expect(itemSlotText).toEqual('item text');\n\n        const item = await page.find('q2-dropdown-item');\n        item.setProperty('disabled', true);\n        await page.waitForChanges();\n\n        expect(itemBtn).toHaveAttribute('disabled');\n    });\n\n    it('renders as separator', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\" separator>item text</q2-dropdown-item>\n            `,\n        });\n\n        const itemSeparator = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItemSeparator\"]');\n        expect(itemSeparator).not.toBeNull();\n        expect(itemSeparator).toEqualAttribute('role', 'separator');\n        expect(itemSeparator).toHaveClass('dropdown-separator');\n\n        const itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n        expect(itemBtn).toBeNull();\n    });\n\n    it('handles removability', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n            `,\n        });\n\n        let removeBtn = await page.find('q2-dropdown-item >>> [test-id=\"removeDropdownItem\"]');\n        expect(removeBtn).toBeNull();\n\n        await setTestStrings(page, {\n            'tecton.element.dropdownItem.remove': 'Remove Option {0}',\n        });\n        const item = await page.find('q2-dropdown-item');\n        item.setProperty('removable', true);\n        await page.waitForChanges();\n\n        removeBtn = await page.find('q2-dropdown-item >>> [test-id=\"removeDropdownItem\"]');\n        expect(removeBtn).not.toBeNull();\n        expect(removeBtn).toHaveClass('remove-dropdown-item');\n        expect(removeBtn).not.toHaveAttribute('disabled');\n        expect(removeBtn).toEqualAttribute('label', 'Remove Option ');\n        expect(await removeBtn.getProperty('_role')).toEqual('menuitem');\n\n        item.setProperty('label', 'Item Text');\n        await page.waitForChanges();\n        expect(removeBtn).toEqualAttribute('label', 'Remove Option Item Text');\n\n        item.setProperty('disabled', true);\n        await page.waitForChanges();\n        expect(removeBtn).toHaveAttribute('disabled');\n    });\n\n    it('correctly emits click event', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n        });\n\n        const item = await page.find('q2-dropdown-item');\n        const clickSpy = await item.spyOnEvent('click');\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'click');\n        expect(clickSpy).toHaveReceivedEventTimes(1);\n        expect(clickSpy).toHaveReceivedEventDetail({ type: 'select', value: 'itemValue' });\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'click');\n        expect(clickSpy).toHaveReceivedEventTimes(2);\n        expect(clickSpy).toHaveReceivedEventDetail({ type: 'remove', value: 'itemValue' });\n    });\n\n    it('does not trigger focus delegator when item or remove btn focused', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n        });\n\n        const item = await page.find('q2-dropdown-item');\n        const itemFocusSpy = await item.spyOnEvent('focus');\n\n        const itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n        const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');\n\n        expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'focus');\n        expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'focus');\n        expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);\n    });\n\n    it('handles focus manipulation', async function (): Promise<void> {\n        const page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n        });\n\n        const itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n        const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');\n        const removeBtn = await page.find('q2-dropdown-item >>> [test-id=\"removeDropdownItem\"]');\n        const removeBtnFocusSpy = await removeBtn.spyOnEvent('focus');\n\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n        await dispatchEvent(page, 'q2-dropdown-item', 'focus');\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'keydown', {\n            key: 'ArrowRight',\n        });\n        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(2);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'keydown', {\n            key: 'ArrowLeft',\n        });\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(4);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'keydown', {\n            key: 'Right',\n        });\n        expect(removeBtnFocusSpy).toHaveReceivedEventTimes(4);\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'keydown', { key: 'Left' });\n        expect(itemBtnFocusSpy).toHaveReceivedEventTimes(6);\n    });\n\n    it('item content is the same width as the q2-btn', async function (): Promise<void> {\n        const page = await setup({\n            html: `<q2-dropdown-item>Test</q2-dropdown-item>`,\n        });\n\n        const { btnWidth, contentWidth, btnPadding } = await page.$eval(\n            'q2-dropdown-item',\n            (el: HTMLQ2DropdownItemElement) => {\n                const itemBtn = el.shadowRoot.querySelector('.dropdown-item');\n                const itemContent = el.shadowRoot.querySelector('.dropdown-item-content');\n                const contentWidth = itemContent.clientWidth;\n                const btnWidth = itemBtn.clientWidth;\n                const btnPadding = parseInt(getComputedStyle(itemBtn).getPropertyValue('padding'));\n                return {\n                    btnWidth,\n                    contentWidth,\n                    btnPadding,\n                };\n            }\n        );\n\n        expect(btnWidth).toEqual(contentWidth + btnPadding * 2);\n    });\n\n    describe('Deprecations', () => {\n        it('handles deprecated `ariaLabel` prop', async () => {\n            const label = 'My Label';\n            const page = await setup({\n                html: `<q2-dropdown-item aria-label=\"${label}\">Text</q2-dropdown-item>`,\n            });\n            await page.waitForChanges();\n            await testDeprecatedAriaLabel(await page.find('q2-dropdown-item'), label);\n            const button = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n            expect(button).toEqualAttribute('label', label);\n            expect(button).toHaveAttribute('hide-label');\n        });\n    });\n});\n"]}
+{"version":3,"file":"q2-dropdown-item-test.e2e.js","sourceRoot":"","sources":["../../../test/elements/q2-dropdown-item-test.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { E2EElement, E2EPage } from '@stencil/core/testing';\nimport {\n    setTestStrings,\n    setup,\n    dispatchEvent,\n    testDeprecatedAriaLabel,\n    getListOfStyleCompilationIssues,\n    evaluateA11y,\n} from '../helpers';\n\ndescribe('q2-dropdown-item', () => {\n    let page: E2EPage;\n    let item: E2EElement;\n    let itemBtn: E2EElement;\n    let itemSeparator: E2EElement;\n    let removeBtn: E2EElement;\n\n    describe('[A11y] guideline compliance', () => {\n        it('Does not have accessibility violations with only label', async () => {\n            page = await setup({\n                html: `\n                    <div role=\"menu\">\n                        <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n                    </div>\n                `,\n            });\n            const hasViolations = await evaluateA11y(page);\n            expect(hasViolations).toBe(false);\n        });\n    });\n\n    it('properly compiles CSS vars and functions', async () => {\n        page = await setup({ html: '<q2-dropdown-item></q2-dropdown-item>' });\n        expect(await getListOfStyleCompilationIssues(page, 'q2-dropdown-item')).toHaveLength(0);\n    });\n\n    it('renders base state', async function (): Promise<void> {\n        page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n            `,\n        });\n\n        itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n        expect(itemBtn).not.toBeNull();\n        expect(itemBtn.tagName.toLowerCase()).toEqual('q2-btn');\n        expect(itemBtn).toHaveClass('dropdown-item');\n        expect(itemBtn).not.toHaveAttribute('disabled');\n        expect(await itemBtn.getProperty('_role')).toEqual('menuitem');\n\n        itemSeparator = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItemSeparator\"]');\n        expect(itemSeparator).toBeNull();\n\n        const itemSlotText = await page.$eval(\n            'q2-dropdown-item',\n            (element: HTMLQ2DropdownItemElement) =>\n                element.shadowRoot.querySelector('slot').assignedNodes()[0].textContent\n        );\n        expect(itemSlotText).toEqual('item text');\n\n        item = await page.find('q2-dropdown-item');\n        item.setProperty('disabled', true);\n        await page.waitForChanges();\n\n        expect(itemBtn).toHaveAttribute('disabled');\n    });\n\n    it('correctly emits click event', async function (): Promise<void> {\n        page = await setup({\n            html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n        });\n\n        item = await page.find('q2-dropdown-item');\n        const clickSpy = await item.spyOnEvent('click');\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'click');\n        expect(clickSpy).toHaveReceivedEventTimes(1);\n        expect(clickSpy).toHaveReceivedEventDetail({ type: 'select', value: 'itemValue' });\n\n        await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'click');\n        expect(clickSpy).toHaveReceivedEventTimes(2);\n        expect(clickSpy).toHaveReceivedEventDetail({ type: 'remove', value: 'itemValue' });\n    });\n\n    it('item content is the same width as the q2-btn', async function (): Promise<void> {\n        page = await setup({\n            html: `<q2-dropdown-item>Test</q2-dropdown-item>`,\n        });\n\n        const { btnWidth, contentWidth, btnPadding } = await page.$eval(\n            'q2-dropdown-item',\n            (el: HTMLQ2DropdownItemElement) => {\n                const itemBtn = el.shadowRoot.querySelector('.dropdown-item');\n                const itemContent = el.shadowRoot.querySelector('.dropdown-item-content');\n                const contentWidth = itemContent.clientWidth;\n                const btnWidth = itemBtn.clientWidth;\n                const btnPadding = parseInt(getComputedStyle(itemBtn).getPropertyValue('padding'));\n                return {\n                    btnWidth,\n                    contentWidth,\n                    btnPadding,\n                };\n            }\n        );\n\n        expect(btnWidth).toEqual(contentWidth + btnPadding * 2);\n    });\n\n    describe('Props', () => {\n        describe('label', () => {\n            describe('when provided', () => {\n                it('applies label to itemDOM() button', async () => {\n                    page = await setup({\n                        html: `\n                        <div role=\"menu\">\n                            <q2-dropdown-item value=\"itemValue\" label=\"item text\"></q2-dropdown-item>\n                        </div>\n                    `,\n                    });\n                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n                    expect(itemBtn.getAttribute('label')).toEqual('item text');\n                });\n            });\n            describe('when not provided', () => {\n                it('tries to use textContent to apply label to itemDOM() button', async () => {\n                    page = await setup({\n                        html: `\n                        <div role=\"menu\">\n                            <q2-dropdown-item value=\"itemValue\">item text</q2-dropdown-item>\n                        </div>\n                    `,\n                    });\n                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n                    expect(itemBtn.getAttribute('label')).toEqual('item text');\n                });\n                it('applies label to itemDOM() button when using q2-loc component (TCT-2678)', async () => {\n                    page = await setup({\n                        html: `\n                        <div role=\"menu\">\n                            <q2-dropdown-item value=\"itemValue\"><q2-loc value=\"item text\"/></q2-dropdown-item>\n                        </div>\n                    `,\n                    });\n                    itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n                    expect(itemBtn.getAttribute('label')).toEqual('item text');\n                });\n            });\n        });\n\n        describe('separator', () => {\n            it('renders as a separator', async () => {\n                page = await setup({\n                    html: `\n                    <q2-dropdown-item value=\"itemValue\" separator>item text</q2-dropdown-item>\n                `,\n                });\n\n                itemSeparator = await page.find('q2-dropdown-item >>> .dropdown-separator');\n                expect(itemSeparator).not.toBeNull();\n                expect(itemSeparator).toEqualAttribute('role', 'separator');\n                expect(itemSeparator).toHaveClass('dropdown-separator');\n\n                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n                expect(itemBtn).toBeNull();\n            });\n        });\n\n        describe('removable', () => {\n            beforeEach(async () => {\n                page = await setup({\n                    html: ``,\n                });\n                await setTestStrings(page, {\n                    'tecton.element.dropdownItem.remove': 'Remove Option {0}',\n                });\n                await page.setContent('<q2-dropdown-item value=\"itemValue\" removable></q2-dropdown-item>');\n                await page.waitForChanges();\n            });\n            it('renders a remove button', async () => {\n                item = await page.find('q2-dropdown-item');\n                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');\n\n                expect(removeBtn).not.toBeNull();\n                expect(removeBtn).not.toHaveAttribute('disabled');\n                expect(removeBtn).toEqualAttribute('label', 'Remove Option ');\n                expect(await removeBtn.getProperty('_role')).toEqual('menuitem');\n            });\n\n            it('uses item label in remove button label', async () => {\n                item = await page.find('q2-dropdown-item');\n                item.setProperty('label', 'Item Text');\n                await page.waitForChanges();\n                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');\n\n                expect(removeBtn).not.toBeNull();\n                expect(removeBtn).toEqualAttribute('label', 'Remove Option Item Text');\n            });\n        });\n\n        describe('disabled', () => {\n            it('disables the dropdown item', async () => {\n                page = await setup({\n                    html: `\n                        <div role=\"menu\">\n                            <q2-dropdown-item value=\"itemValue\" disabled></q2-dropdown-item>\n                        </div>\n                    `,\n                });\n                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n\n                expect(itemBtn).toHaveAttribute('disabled');\n            });\n\n            it('disables the remove button when removable', async () => {\n                page = await setup({\n                    html: `\n                        <div role=\"menu\">\n                            <q2-dropdown-item value=\"itemValue\" disabled removable></q2-dropdown-item>\n                        </div>\n                    `,\n                });\n                itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n                removeBtn = await page.find('q2-dropdown-item >>> .remove-dropdown-item');\n                expect(itemBtn).toHaveAttribute('disabled');\n                expect(removeBtn).toHaveAttribute('disabled');\n            });\n        });\n    });\n\n    describe('Focus', () => {\n        it('does not trigger focus delegator when item or remove btn focused', async function (): Promise<void> {\n            page = await setup({\n                html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n            });\n\n            item = await page.find('q2-dropdown-item');\n            const itemFocusSpy = await item.spyOnEvent('focus');\n\n            itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n            const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');\n\n            expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'focus');\n            expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'focus');\n            expect(itemFocusSpy).toHaveReceivedEventTimes(0);\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);\n        });\n\n        it('handles focus manipulation', async function (): Promise<void> {\n            page = await setup({\n                html: `\n                <q2-dropdown-item value=\"itemValue\" removable>item text</q2-dropdown-item>\n            `,\n            });\n\n            itemBtn = await page.find('q2-dropdown-item >>> [test-id=\"dropdownItem\"]');\n            const itemBtnFocusSpy = await itemBtn.spyOnEvent('focus');\n            removeBtn = await page.find('q2-dropdown-item >>> [test-id=\"removeDropdownItem\"]');\n            const removeBtnFocusSpy = await removeBtn.spyOnEvent('focus');\n\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(0);\n            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(0);\n\n            await dispatchEvent(page, 'q2-dropdown-item', 'focus');\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(2);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'keydown', {\n                key: 'ArrowRight',\n            });\n            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(2);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'keydown', {\n                key: 'ArrowLeft',\n            });\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(4);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"dropdownItem\"]'], 'keydown', {\n                key: 'Right',\n            });\n            expect(removeBtnFocusSpy).toHaveReceivedEventTimes(4);\n\n            await dispatchEvent(page, ['q2-dropdown-item', '[test-id=\"removeDropdownItem\"]'], 'keydown', {\n                key: 'Left',\n            });\n            expect(itemBtnFocusSpy).toHaveReceivedEventTimes(6);\n        });\n    });\n\n    describe('Deprecations', () => {\n        it('handles deprecated `ariaLabel` prop', async () => {\n            const label = 'My Label';\n            page = await setup({\n                html: `<q2-dropdown-item aria-label=\"${label}\">Text</q2-dropdown-item>`,\n            });\n            await page.waitForChanges();\n            await testDeprecatedAriaLabel(await page.find('q2-dropdown-item'), label);\n            itemBtn = await page.find('q2-dropdown-item >>> .dropdown-item');\n            expect(itemBtn).toEqualAttribute('label', label);\n            expect(itemBtn).toHaveAttribute('hide-label');\n        });\n    });\n});\n"]}