diff --git a/packages/components/cypress/e2e/megadropdown.cy.ts b/packages/components/cypress/e2e/megadropdown.cy.ts index 4ad3d2bf98..bae52d55fb 100644 --- a/packages/components/cypress/e2e/megadropdown.cy.ts +++ b/packages/components/cypress/e2e/megadropdown.cy.ts @@ -2,9 +2,9 @@ const MEGADROPDOWN_ID = '212efc4e-875b-4497-912d-d28c6baf32f5'; describe('megadropdown', () => { describe('default', () => { - describe('mobile', () => { + describe('desktop', () => { beforeEach(() => { - cy.viewport('iphone-6+'); + cy.viewport(1920, 1080); cy.getComponents( MEGADROPDOWN_ID, 'tests', @@ -24,33 +24,29 @@ describe('megadropdown', () => { it('should open on trigger click', () => { cy.get('@megadropdown-trigger').should('exist'); cy.get('@megadropdown-trigger').click(); - cy.wait(500); cy.get('@megadropdown').should(`be.visible`); }); - it('should show back button', () => { + it('should show close button', () => { cy.get('@megadropdown-trigger').click(); - cy.wait(500); - cy.get('@back-btn').should(`be.visible`); + cy.get('@close-btn').should(`be.visible`); }); - it('should not show close button', () => { + it('should not show back button', () => { cy.get('@megadropdown-trigger').click(); - cy.wait(500); - cy.get('@close-btn').should(`be.hidden`); + cy.get('@back-btn').should(`be.hidden`); }); - it('should close on back button click', () => { + it('should close on close button click', () => { cy.get('@megadropdown-trigger').click(); - cy.get('@back-btn').click(); - cy.wait(500); + cy.get('@close-btn').click(); cy.get('@megadropdown').should(`be.hidden`); }); }); - describe('desktop', () => { + describe('mobile', () => { beforeEach(() => { - cy.viewport(1920, 1080); + cy.viewport(500, 1200); cy.getComponents( MEGADROPDOWN_ID, 'tests', @@ -61,36 +57,19 @@ describe('megadropdown', () => { cy.get('@megadropdown').find('.close-button').as('close-btn'); }); - it('should render', () => { - cy.get('@megadropdown').should('exist'); - cy.get('@megadropdown-trigger').should('exist'); - cy.get('@megadropdown').should(`be.hidden`); - }); - it('should open on trigger click', () => { - cy.get('@megadropdown-trigger').should('exist'); cy.get('@megadropdown-trigger').click(); - cy.wait(500); cy.get('@megadropdown').should(`be.visible`); }); - it('should show close button', () => { - cy.get('@megadropdown-trigger').click(); - cy.wait(500); - cy.get('@close-btn').should(`be.visible`); - }); - - it('should not show back button', () => { + it('should show back button', () => { cy.get('@megadropdown-trigger').click(); - cy.wait(500); - cy.get('@back-btn').should(`be.hidden`); + cy.get('@back-btn').should(`be.visible`); }); - it('should close on close button click', () => { + it('should not show close button', () => { cy.get('@megadropdown-trigger').click(); - cy.get('@close-btn').click(); - cy.wait(500); - cy.get('@megadropdown').should(`be.hidden`); + cy.get('@close-btn').should(`be.hidden`); }); }); }); diff --git a/packages/components/src/components/post-megadropdown/post-megadropdown.tsx b/packages/components/src/components/post-megadropdown/post-megadropdown.tsx index 0ccbc975d6..b6ebdcc94e 100644 --- a/packages/components/src/components/post-megadropdown/post-megadropdown.tsx +++ b/packages/components/src/components/post-megadropdown/post-megadropdown.tsx @@ -82,7 +82,7 @@ export class PostMegadropdown { private handleFocusout(event: FocusEvent) { const relatedTarget = event.relatedTarget as HTMLElement; - const megadropdown= this.popoverRef.querySelector('.megadropdown'); + const megadropdown = this.popoverRef.querySelector('.megadropdown'); if (!megadropdown.contains(relatedTarget)) { this.hide(); }