diff --git a/core/src/components/action-sheet/test/alert-from-action-sheet/e2e.ts b/core/src/components/action-sheet/test/alert-from-action-sheet/e2e.ts new file mode 100644 index 0000000000..1741496183 --- /dev/null +++ b/core/src/components/action-sheet/test/alert-from-action-sheet/e2e.ts @@ -0,0 +1,34 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: alertFromActionSheet', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/alert-from-action-sheet?ionic:animate=false` + }); + + const presentBtn = await page.find('#alertFromActionSheet'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + let compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); + + const openAlertBtn = await page.find({ text: 'Open Alert' }); + await openAlertBtn.click(); + + const alert = await page.find('ion-alert'); + await alert.waitForVisible(); + + compare = await page.compareScreenshot(`alert open`); + expect(compare).toMatchScreenshot(); + + const alertOkayBtn = await page.find({ contains: 'Okay' }); + await alertOkayBtn.click(); + + await Promise.all([ + alert.waitForNotVisible(), + actionSheet.waitForNotVisible() + ]); + +}); diff --git a/core/src/components/action-sheet/test/alert-from-action-sheet/index.html b/core/src/components/action-sheet/test/alert-from-action-sheet/index.html new file mode 100644 index 0000000000..a8d9f860c5 --- /dev/null +++ b/core/src/components/action-sheet/test/alert-from-action-sheet/index.html @@ -0,0 +1,68 @@ + + + + + + Action Sheet - Alert From Action Sheet + + + + + + + + + + + Action Sheet - Alert From Action Sheet + + + + + + + + Alert from Action Sheet + + + + + + + + + diff --git a/core/src/components/action-sheet/test/basic/e2e.js b/core/src/components/action-sheet/test/basic/e2e.js deleted file mode 100644 index 0573b54a79..0000000000 --- a/core/src/components/action-sheet/test/basic/e2e.js +++ /dev/null @@ -1,67 +0,0 @@ -'use strict'; - -const { By, until } = require('selenium-webdriver'); -const { Page, platforms, register } = require('../../../../../scripts/e2e'); - -class E2ETestPage extends Page { - constructor(driver, platform) { - super(driver, `http://localhost:3333/src/components/action-sheet/test/basic?ionic:mode=${platform}`); - } - - async present(buttonId) { - await this.navigate('#basic'); - this.driver.findElement(By.id(buttonId)).click(); - await this.driver.wait(until.elementLocated(By.css('.action-sheet-container'))); - return await this.driver.wait(until.elementIsVisible(this.driver.findElement(By.css('.action-sheet-container')))); - } - - async closeWithBackdrop() { - this.driver.findElement(By.css('ion-backdrop')).click(); - return await this.driver.wait(until.elementIsNotVisible(this.driver.findElement(By.css('ion-backdrop')))); - } -} - -platforms.forEach(platform => { - describe('action-sheet/basic', () => { - register('should init', driver => { - const page = new E2ETestPage(driver, platform); - return page.navigate('#basic'); - }); - - register('should open action sheet', driver => { - const page = new E2ETestPage(driver, platform); - return page.present('basic'); - }); - - register('should close with backdrop click', async driver => { - const page = new E2ETestPage(driver, platform); - await page.present('basic'); - return page.closeWithBackdrop(); - }); - - register('shows noBackdropDismiss', (driver) => { - const page = new E2ETestPage(driver, platform); - return page.present('noBackdropDismiss'); - }); - - register('shows alertFromActionSheet', (driver) => { - const page = new E2ETestPage(driver, platform); - return page.present('alertFromActionSheet'); - }); - - register('shows scrollableOptions', (driver) => { - const page = new E2ETestPage(driver, platform); - return page.present('scrollableOptions'); - }); - - register('shows scrollWithoutCancel', (driver) => { - const page = new E2ETestPage(driver, platform); - return page.present('scrollWithoutCancel'); - }); - - register('shows cancelOnly', (driver) => { - const page = new E2ETestPage(driver, platform); - return page.present('cancelOnly'); - }); - }); -}); diff --git a/core/src/components/action-sheet/test/basic/e2e.ts b/core/src/components/action-sheet/test/basic/e2e.ts new file mode 100644 index 0000000000..0d638420fa --- /dev/null +++ b/core/src/components/action-sheet/test/basic/e2e.ts @@ -0,0 +1,30 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: basic', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/basic?ionic:animate=false` + }); + + let compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); + + const presentBtn = await page.find('#basic'); + await presentBtn.click(); + + let actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + compare = await page.compareScreenshot(`presented`); + expect(compare).toMatchScreenshot(); + + const backdrop = await page.find('ion-backdrop'); + await backdrop.click(); + + await actionSheet.waitForNotVisible(); + + compare = await page.compareScreenshot(`dismissed`); + expect(compare).toMatchScreenshot(); + + actionSheet = await page.find('ion-action-sheet'); + expect(actionSheet).toBe(null); +}); diff --git a/core/src/components/action-sheet/test/basic/index.html b/core/src/components/action-sheet/test/basic/index.html index e70d7d16ab..04d4371376 100644 --- a/core/src/components/action-sheet/test/basic/index.html +++ b/core/src/components/action-sheet/test/basic/index.html @@ -22,26 +22,8 @@ Basic - No Backdrop Dismiss - Alert from Action Sheet - Scrollable Options - Scroll Without Cancel - Cancel Only - Icons - Custom CSS Class - - - diff --git a/core/src/components/action-sheet/test/cancel-only/e2e.ts b/core/src/components/action-sheet/test/cancel-only/e2e.ts new file mode 100644 index 0000000000..1d956f3c18 --- /dev/null +++ b/core/src/components/action-sheet/test/cancel-only/e2e.ts @@ -0,0 +1,16 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: cancelOnly', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/cancel-only?ionic:animate=false` + }); + + const presentBtn = await page.find('#cancelOnly'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/action-sheet/test/cancel-only/index.html b/core/src/components/action-sheet/test/cancel-only/index.html new file mode 100644 index 0000000000..ec061c924a --- /dev/null +++ b/core/src/components/action-sheet/test/cancel-only/index.html @@ -0,0 +1,50 @@ + + + + + + Action Sheet - Cancel Only + + + + + + + + + + + Action Sheet - Cancel Only + + + + + + + Cancel Only + + + + + + + + + diff --git a/core/src/components/action-sheet/test/custom-css/e2e.ts b/core/src/components/action-sheet/test/custom-css/e2e.ts new file mode 100644 index 0000000000..b39b7b6019 --- /dev/null +++ b/core/src/components/action-sheet/test/custom-css/e2e.ts @@ -0,0 +1,16 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: cssClass', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/custom-css?ionic:animate=false` + }); + + const presentBtn = await page.find('#cssClass'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/action-sheet/test/custom-css/index.html b/core/src/components/action-sheet/test/custom-css/index.html new file mode 100644 index 0000000000..7ac1494040 --- /dev/null +++ b/core/src/components/action-sheet/test/custom-css/index.html @@ -0,0 +1,64 @@ + + + + + + Action Sheet - Custom CSS Class + + + + + + + + + + + Action Sheet - Custom CSS Class + + + + + + + Custom CSS Class + + + + + + + + + + + diff --git a/core/src/components/action-sheet/test/icons/e2e.ts b/core/src/components/action-sheet/test/icons/e2e.ts new file mode 100644 index 0000000000..df105c7d47 --- /dev/null +++ b/core/src/components/action-sheet/test/icons/e2e.ts @@ -0,0 +1,16 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: icons', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/icons?ionic:animate=false` + }); + + const presentBtn = await page.find('#icons'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/action-sheet/test/icons/index.html b/core/src/components/action-sheet/test/icons/index.html new file mode 100644 index 0000000000..2bfbc8c4a5 --- /dev/null +++ b/core/src/components/action-sheet/test/icons/index.html @@ -0,0 +1,77 @@ + + + + + + Action Sheet - Icons + + + + + + + + + + + Action Sheet - Icons + + + + + + + Icons + + + + + + + + diff --git a/core/src/components/action-sheet/test/no-backdrop-dismiss/e2e.ts b/core/src/components/action-sheet/test/no-backdrop-dismiss/e2e.ts new file mode 100644 index 0000000000..d7d38b782c --- /dev/null +++ b/core/src/components/action-sheet/test/no-backdrop-dismiss/e2e.ts @@ -0,0 +1,33 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: noBackdropDismiss', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/no-backdrop-dismiss?ionic:animate=false` + }); + + const presentBtn = await page.find('#noBackdropDismiss'); + await presentBtn.click(); + + let actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + let compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); + + const backdrop = await page.find('ion-backdrop'); + await backdrop.click(); + + compare = await page.compareScreenshot(`dismissed`); + expect(compare).toMatchScreenshot(); + + const isVisible = await actionSheet.isVisible(); + expect(isVisible).toBe(true); + + const cancel = await page.find('.action-sheet-cancel'); + await cancel.click(); + + await actionSheet.waitForNotVisible(); + + actionSheet = await page.find('ion-action-sheet'); + expect(actionSheet).toBe(null); +}); diff --git a/core/src/components/action-sheet/test/no-backdrop-dismiss/index.html b/core/src/components/action-sheet/test/no-backdrop-dismiss/index.html new file mode 100644 index 0000000000..78406f2a22 --- /dev/null +++ b/core/src/components/action-sheet/test/no-backdrop-dismiss/index.html @@ -0,0 +1,59 @@ + + + + + + Action Sheet - No Backdrop Dismiss + + + + + + + + + + + Action Sheet - No Backdrop Dismiss + + + + + + + No Backdrop Dismiss + + + + + + + + diff --git a/core/src/components/action-sheet/test/scroll-without-cancel/e2e.ts b/core/src/components/action-sheet/test/scroll-without-cancel/e2e.ts new file mode 100644 index 0000000000..df1cb2c3c4 --- /dev/null +++ b/core/src/components/action-sheet/test/scroll-without-cancel/e2e.ts @@ -0,0 +1,16 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: scrollWithoutCancel', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/scroll-without-cancel?ionic:animate=false` + }); + + const presentBtn = await page.find('#scrollWithoutCancel'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/action-sheet/test/scroll-without-cancel/index.html b/core/src/components/action-sheet/test/scroll-without-cancel/index.html new file mode 100644 index 0000000000..98fdae22ed --- /dev/null +++ b/core/src/components/action-sheet/test/scroll-without-cancel/index.html @@ -0,0 +1,104 @@ + + + + + + Action Sheet - Scroll Without Cancel + + + + + + + + + + + Action Sheet - Scroll Without Cancel + + + + + + + Scroll Without Cancel + + + + + + + + diff --git a/core/src/components/action-sheet/test/scrollable-options/e2e.ts b/core/src/components/action-sheet/test/scrollable-options/e2e.ts new file mode 100644 index 0000000000..f5549a7ea3 --- /dev/null +++ b/core/src/components/action-sheet/test/scrollable-options/e2e.ts @@ -0,0 +1,16 @@ +import { newE2EPage } from '@stencil/core/testing'; + +it('action-sheet: scrollableOptions', async () => { + const page = await newE2EPage({ + url: `/src/components/action-sheet/test/scrollable-options?ionic:animate=false` + }); + + const presentBtn = await page.find('#scrollableOptions'); + await presentBtn.click(); + + const actionSheet = await page.find('ion-action-sheet'); + await actionSheet.waitForVisible(); + + const compare = await page.compareScreenshot(); + expect(compare).toMatchScreenshot(); +}); diff --git a/core/src/components/action-sheet/test/scrollable-options/index.html b/core/src/components/action-sheet/test/scrollable-options/index.html new file mode 100644 index 0000000000..9653450930 --- /dev/null +++ b/core/src/components/action-sheet/test/scrollable-options/index.html @@ -0,0 +1,110 @@ + + + + + + Action Sheet - Scrollable Options + + + + + + + + + + + Action Sheet - Scrollable Options + + + + + + + Scrollable Options + + + + + + + +