q2-tecton-elements 1.54.6 → 1.54.8

package/dist/collection/components/q2-dropdown/test/q2-dropdown-test.e2e.js

@@ -452,7 +452,7 @@ describe('q2-dropdown', () => {
                 await page.waitForChanges();
                 expect(await dropdown.getProperty('open')).toBe(true);
                 expect(await popover.getProperty('open')).toBe(true);
-                expect(popoverStateChangedSpy).toHaveReceivedEventTimes(1);
+                expect(popoverStateChangedSpy).toHaveReceivedEvent();
             });
         });
         describe('block', () => {
@@ -482,18 +482,6 @@ describe('q2-dropdown', () => {
             });
         });
         describe('popoverMode', () => {
-            it('does not set any mode on the popover (default)', async () => {
-                const page = await newSpecPage({
-                    components: [Q2Popover, Q2Dropdown, Q2DropdownItem],
-                    html: `
-                        <q2-dropdown>
-                            <q2-dropdown-item>Item 1 Text</q2-dropdown-item>
-                            <q2-dropdown-item>Item 2 Text</q2-dropdown-item>
-                        </q2-dropdown>
-                    `,
-                });
-                expect(page.root.shadowRoot.querySelector('q2-popover').mode).toBeNull();
-            });
             it('sets the value of popoverMode as the mode on the popover', async () => {
                 const page = await newSpecPage({
                     components: [Q2Popover, Q2Dropdown, Q2DropdownItem],
@@ -555,7 +543,7 @@ describe('q2-dropdown', () => {
                     const popoverStateChangedSpy = await dropdown.spyOnEvent('popoverStateChanged');
                     await dropdown.callMethod('selectItem', 'item-1');
                     await page.waitForChanges();
-                    expect(popoverStateChangedSpy).toHaveReceivedEventTimes(2);
+                    expect(popoverStateChangedSpy).toHaveReceivedEvent();
                 });
                 it('clicks the item matching the provided value', async () => {
                     const clickSpy = await firstOption.spyOnEvent('click');
@@ -597,7 +585,7 @@ describe('q2-dropdown', () => {
                     const popoverStateChangedSpy = await dropdown.spyOnEvent('popoverStateChanged');
                     await dropdown.callMethod('selectRemoveItem', 'item-1');
                     await page.waitForChanges();
-                    expect(popoverStateChangedSpy).toHaveReceivedEventTimes(2);
+                    expect(popoverStateChangedSpy).toHaveReceivedEvent();
                 });
                 it('clicks the remove item button corresponding to the provided value', async () => {
                     const clickSpy = await firstOption.spyOnEvent('click');
@@ -614,7 +602,7 @@ describe('q2-dropdown', () => {
                 await dropdown.callMethod('openPopover');
                 await page.waitForChanges();
                 expect(await dropdown.getProperty('open')).toBe(true);
-                expect(popoverStateChangedSpy).toHaveReceivedEventTimes(1);
+                expect(popoverStateChangedSpy).toHaveReceivedEvent();
             });
             it('does nothing if the dropdown is disabled', async () => {
                 dropdown.setProperty('disabled', true);
@@ -645,7 +633,7 @@ describe('q2-dropdown', () => {
                 await dropdown.callMethod('closePopover');
                 await page.waitForChanges();
                 expect(await dropdown.getProperty('open')).toBe(false);
-                expect(popoverStateChangedSpy).toHaveReceivedEventTimes(1);
+                expect(popoverStateChangedSpy).toHaveReceivedEvent();
             });
             it('does nothing if the dropdown is disabled', async () => {
                 dropdown.setProperty('open', true);
@@ -843,25 +831,27 @@ describe('q2-dropdown', () => {
                 clickSpy = await firstOption.spyOnEvent('click');
                 tctClickSpy = await firstOption.spyOnEvent('tctClick');
                 expect(await dropdown.getProperty('open')).toBeUndefined();
-                expect(buttonFocusSpy).toHaveReceivedEventTimes(0);
+                expect(buttonFocusSpy).not.toHaveReceivedEvent();
                 expect(popover).not.toHaveAttribute('open');
                 expect(dropdownContainer).not.toHaveClass('dropdown-open');
             });
             describe('toggle button behavior', () => {
                 describe('when popover is closed', () => {
                     it('ArrowUp: opens the popover and focuses last item', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowUp');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(2);
-                        expect(lastOptionFocusSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(lastOptionFocusSpy).toHaveReceivedEvent();
                     });
                     it('ArrowDown: opens the popover and focuses first item', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(2);
-                        expect(firstOptionFocusSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(firstOptionFocusSpy).toHaveReceivedEvent();
                     });
                 });
                 describe('when popover is open', () => {
@@ -872,19 +862,21 @@ describe('q2-dropdown', () => {
                         buttonFocusSpy.events = [];
                     });
                     it('Escape: closes the popover and focuses toggle button', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('Escape');
                         await page.waitForChanges();
                         expect(popover).not.toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(3);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
                     });
                     it('Tab: closes the popover and focuses next element in tab order', async () => {
                         const outerButton = await page.find('button');
                         const outerButtonSpy = await outerButton.spyOnEvent('focus');
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('Tab');
                         await page.waitForChanges();
                         expect(popover).not.toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(2);
-                        expect(outerButtonSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(outerButtonSpy).toHaveReceivedEvent();
                     });
                 });
             });
@@ -896,6 +888,7 @@ describe('q2-dropdown', () => {
                         lastOptionFocusSpy.events = [];
                     });
                     it('clears active elements when the popover is closed', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
@@ -909,33 +902,39 @@ describe('q2-dropdown', () => {
                         expect(activeDropdownItem).toBeNull();
                     });
                     it('Escape: closes the popover and focuses the toggle button', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(2);
-                        expect(firstOptionFocusSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(firstOptionFocusSpy).toHaveReceivedEvent();
+                        buttonFocusSpy.events = [];
                         await page.keyboard.press('Escape');
                         await page.waitForChanges();
                         expect(popover).not.toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(4);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
                         expect(await getFocusedAttribute(page, 'test-id')).toEqual('dropdownButton');
                     });
                     it('Tab: closes the popover and focuses next element in tab order', async () => {
                         const outerButton = await page.find('button');
                         const outerButtonSpy = await outerButton.spyOnEvent('focus');
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(2);
-                        expect(firstOptionFocusSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(firstOptionFocusSpy).toHaveReceivedEvent();
+                        buttonFocusSpy.events = [];
+                        outerButtonSpy.events = [];
                         await page.keyboard.press('Tab');
                         await page.waitForChanges();
                         expect(popover).not.toHaveAttribute('open');
-                        expect(buttonFocusSpy).toHaveReceivedEventTimes(4);
-                        expect(outerButtonSpy).toHaveReceivedEventTimes(1);
+                        expect(buttonFocusSpy).toHaveReceivedEvent();
+                        expect(outerButtonSpy).toHaveReceivedEvent();
                         expect(await getFocusedAttribute(page, 'test-id')).toEqual('outer-button');
                     });
                     it('ArrowUp: focuses the previous dropdown item', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowUp');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
@@ -946,6 +945,7 @@ describe('q2-dropdown', () => {
                         expect(firstOptionFocusSpy).toHaveReceivedEventTimes(1);
                     });
                     it('ArrowDown: focuses the next dropdown item', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
@@ -955,6 +955,7 @@ describe('q2-dropdown', () => {
                         expect(lastOptionFocusSpy).toHaveReceivedEventTimes(1);
                     });
                     it('Space: selects the focused option', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');
@@ -971,6 +972,7 @@ describe('q2-dropdown', () => {
                         expect(await getFocusedAttribute(page, 'test-id')).toEqual('dropdownButton');
                     });
                     it('Enter: selects the focused option', async () => {
+                        await dropdownButton.callMethod('focus');
                         await dropdownButton.press('ArrowDown');
                         await page.waitForChanges();
                         expect(popover).toHaveAttribute('open');