diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts new file mode 100644 index 0000000000..226b84b4b7 --- /dev/null +++ b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts @@ -0,0 +1,151 @@ +import { expect } from '@playwright/test'; +import type { Locator } from '@playwright/test'; +import { test } from '@utils/test/playwright'; +import type { E2EPage } from '@utils/test/playwright'; + +test.describe('action sheet: basic', () => { + let actionSheetFixture: ActionSheetFixture; + test.beforeEach(async ({ page }) => { + await page.goto(`/src/components/action-sheet/test/basic`); + actionSheetFixture = new ActionSheetFixture(page); + }); + test.describe('action sheet: data', () => { + test('should return data', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + const ionActionSheetDidDismiss = await page.spyOnEvent('ionActionSheetDidDismiss'); + + await actionSheetFixture.open('#buttonData'); + + const buttonOption = page.locator('ion-action-sheet button#option'); + await buttonOption.click(); + + await ionActionSheetDidDismiss.next(); + expect(ionActionSheetDidDismiss).toHaveReceivedEventDetail({ data: { type: '1' } }); + }); + test('should return cancel button data', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + const ionActionSheetDidDismiss = await page.spyOnEvent('ionActionSheetDidDismiss'); + + await actionSheetFixture.open('#buttonData'); + + const buttonOption = page.locator('ion-action-sheet button.action-sheet-cancel'); + await buttonOption.click(); + + await ionActionSheetDidDismiss.next(); + expect(ionActionSheetDidDismiss).toHaveReceivedEventDetail({ data: { type: 'cancel' }, role: 'cancel' }); + }); + }); + test.describe('action sheet: attributes', () => { + test('should set htmlAttributes', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + await actionSheetFixture.open('#basic'); + + const actionSheet = page.locator('ion-action-sheet'); + expect(actionSheet).toHaveAttribute('data-testid', 'basic-action-sheet'); + }); + }); + test.describe('action sheet: variants', () => { + test('should open basic action sheet', async () => { + await actionSheetFixture.open('#basic'); + await actionSheetFixture.screenshot('basic'); + + /** + * We want to test that the dismiss method + * actually works, but we do not need to test + * it every time. As a result, we only + * call dismiss in this test. + */ + await actionSheetFixture.dismiss(); + }); + test('should open cancel only action sheet', async () => { + await actionSheetFixture.open('#cancelOnly'); + await actionSheetFixture.screenshot('cancel-only'); + }); + test('should open custom action sheet', async () => { + await actionSheetFixture.open('#custom'); + await actionSheetFixture.screenshot('custom'); + }); + test('should open scrollable action sheet', async () => { + await actionSheetFixture.open('#scrollableOptions'); + await actionSheetFixture.screenshot('scrollable-options'); + }); + test('should open scrollable action sheet without cancel', async () => { + await actionSheetFixture.open('#scrollWithoutCancel'); + await actionSheetFixture.screenshot('scroll-without-cancel'); + }); + test('should open custom backdrop action sheet', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + await actionSheetFixture.open('#customBackdrop'); + + const backdrop = page.locator('ion-action-sheet ion-backdrop'); + expect(backdrop).toHaveCSS('opacity', '1'); + }); + test('should open alert from action sheet', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + const ionAlertDidPresent = await page.spyOnEvent('ionAlertDidPresent'); + await actionSheetFixture.open('#alertFromActionSheet'); + + await page.locator('#open-alert').click(); + + await ionAlertDidPresent.next(); + }); + test('should not dismiss action sheet when backdropDismiss: false', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + await actionSheetFixture.open('#noBackdropDismiss'); + + const actionSheet = page.locator('ion-action-sheet'); + await actionSheet.locator('ion-backdrop').click(); + + expect(actionSheet).toBeVisible(); + }); + }); + test.describe('action sheet: focus trap', () => { + test('it should trap focus in action sheet', async ({ page, browserName }, testInfo) => { + test.skip(testInfo.project.metadata.rtl === true, 'This does not test LTR vs. RTL layout.'); + const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab'; + + await actionSheetFixture.open('#basic'); + const buttons = page.locator('ion-action-sheet button'); + + await page.keyboard.press(tabKey); + await expect(buttons.nth(0)).toBeFocused(); + + await page.keyboard.press(`Shift+${tabKey}`); + await expect(buttons.nth(4)).toBeFocused(); + + await page.keyboard.press(tabKey); + await expect(buttons.nth(0)).toBeFocused(); + }); + }); +}); + +class ActionSheetFixture { + readonly page: E2EPage; + + private actionSheet!: Locator; + + constructor(page: E2EPage) { + this.page = page; + } + + async open(selector: string) { + const ionActionSheetDidPresent = await this.page.spyOnEvent('ionActionSheetDidPresent'); + await this.page.locator(selector).click(); + await ionActionSheetDidPresent.next(); + this.actionSheet = this.page.locator('ion-action-sheet'); + expect(this.actionSheet).toBeVisible(); + } + + async dismiss() { + const ionActionSheetDidDismiss = await this.page.spyOnEvent('ionActionSheetDidDismiss'); + await this.actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.dismiss()); + await ionActionSheetDidDismiss.next(); + expect(this.actionSheet).not.toBeVisible(); + } + + async screenshot(modifier: string) { + expect(await this.actionSheet.screenshot()).toMatchSnapshot( + `action-sheet-${modifier}-diff-${this.page.getSnapshotSettings()}.png` + ); + } +} diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..140b6b99ed Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..9d0fd1f4ce Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..4e8634447b Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..475bc42687 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..0c2f89ddde Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..e7ddb4571d Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..05f0f4046d Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..5a60aa2d75 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..784abe3029 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..158985dffe Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..31b435160b Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..2db25fb099 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-basic-diff-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..4ada7d72b9 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..0d3e8a1101 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..1ba058ea3c Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..f3c8502ec6 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..aebbc9feea Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..d2593b0038 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..23739bd73e Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..e23d01d025 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..e91111dbcd Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..2d5839d68f Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..1912b7ebf6 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..d2425daf99 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-cancel-only-diff-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..7e08a8996e Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..b5194bcfe4 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..4bc7642350 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..1dd876f405 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..3a4175b6b2 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..ab553e16f3 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..3a9c296404 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..0cde21dbc1 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..552bfc7f34 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..a9198da0d7 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..c32e2f66f3 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..29980cdb0b Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-custom-diff-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..cadff2b31d Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..7325d68d1e Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..482a083c91 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..cadff2b31d Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..fee03b4ee9 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..482a083c91 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..2c021e3223 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..6c284734c5 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..5d746997f8 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..2984670eeb Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..17b6c1bec5 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..1dbd582443 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scroll-without-cancel-diff-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..62d3c92c6e Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..82ea7f9d10 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..1c1dcd0f7f Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..62d3c92c6e Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..0010271dc9 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..1c1dcd0f7f Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-ios-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..87489f4191 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..581347a23b Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..c490c9c48d Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..5920d4c727 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..23507936d9 Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Safari-linux.png new file mode 100644 index 0000000000..3e2fdbe2dd Binary files /dev/null and b/core/src/components/action-sheet/test/basic/action-sheet.e2e.ts-snapshots/action-sheet-scrollable-options-diff-md-rtl-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/basic/e2e.ts b/core/src/components/action-sheet/test/basic/e2e.ts deleted file mode 100644 index f83bdfdc9e..0000000000 --- a/core/src/components/action-sheet/test/basic/e2e.ts +++ /dev/null @@ -1,164 +0,0 @@ -import { newE2EPage } from '@stencil/core/testing'; - -import { testActionSheet, testActionSheetAlert, testActionSheetBackdrop } from '../test.utils'; - -const DIRECTORY = 'basic'; -const getActiveElementText = async (page) => { - const activeElement = await page.evaluateHandle(() => document.activeElement); - return page.evaluate((el) => el?.textContent, activeElement); -}; - -test('action-sheet: data', async () => { - const page = await newE2EPage({ url: '/src/components/action-sheet/test/basic?ionic:_testing=true' }); - const didDismiss = await page.spyOnEvent('ionActionSheetDidDismiss'); - - await page.click('#buttonData'); - await page.waitForSelector('#buttonData'); - - const actionSheet = await page.find('ion-action-sheet'); - await actionSheet.waitForVisible(); - - const button = await actionSheet.find('button#option'); - await button.click(); - - expect(didDismiss).toHaveReceivedEventDetail({ data: { type: '1' } }); -}); - -test('action-sheet: data cancel', async () => { - const page = await newE2EPage({ url: '/src/components/action-sheet/test/basic?ionic:_testing=true' }); - const didDismiss = await page.spyOnEvent('ionActionSheetDidDismiss'); - - await page.click('#buttonData'); - await page.waitForSelector('#buttonData'); - - const actionSheet = await page.find('ion-action-sheet'); - await actionSheet.waitForVisible(); - - const button = await actionSheet.find('button.action-sheet-cancel'); - await button.click(); - - expect(didDismiss).toHaveReceivedEventDetail({ data: { type: 'cancel' }, role: 'cancel' }); -}); - -test('action-sheet: focus trap', async () => { - const page = await newE2EPage({ url: '/src/components/action-sheet/test/basic?ionic:_testing=true' }); - - await page.click('#basic'); - await page.waitForSelector('#basic'); - - const actionSheet = await page.find('ion-action-sheet'); - - expect(actionSheet).not.toBe(null); - await actionSheet.waitForVisible(); - - await page.keyboard.press('Tab'); - - const activeElementText = await getActiveElementText(page); - expect(activeElementText).toEqual('Delete'); - - await page.keyboard.down('Shift'); - await page.keyboard.press('Tab'); - await page.keyboard.up('Shift'); - - const activeElementTextTwo = await getActiveElementText(page); - expect(activeElementTextTwo).toEqual('Cancel'); - - await page.keyboard.press('Tab'); - - const activeElementTextThree = await getActiveElementText(page); - expect(activeElementTextThree).toEqual('Delete'); -}); - -test('action-sheet: basic', async () => { - await testActionSheet(DIRECTORY, '#basic'); -}); - -test('action-sheet: basic, alert from action sheet', async () => { - await testActionSheet(DIRECTORY, '#alertFromActionSheet', false, testActionSheetAlert); -}); - -test('action-sheet: basic, cancel only', async () => { - await testActionSheet(DIRECTORY, '#cancelOnly'); -}); - -test('action-sheet: basic, custom', async () => { - await testActionSheet(DIRECTORY, '#custom'); -}); - -test('action-sheet: basic, icons', async () => { - await testActionSheet(DIRECTORY, '#icons'); -}); - -test('action-sheet: basic, no backdrop dismiss', async () => { - await testActionSheet(DIRECTORY, '#noBackdropDismiss', false, testActionSheetBackdrop); -}); - -test('action-sheet: basic, scrollable options', async () => { - await testActionSheet(DIRECTORY, '#scrollableOptions'); -}); - -test('action-sheet: basic, scroll without cancel', async () => { - await testActionSheet(DIRECTORY, '#scrollWithoutCancel'); -}); - -test('action-sheet: basic, custom backdrop', async () => { - await testActionSheet(DIRECTORY, '#customBackdrop'); -}); - -/** - * RTL Tests - */ - -test('action-sheet:rtl: basic', async () => { - await testActionSheet(DIRECTORY, '#basic', true); -}); - -test('action-sheet:rtl: basic, alert from action sheet', async () => { - await testActionSheet(DIRECTORY, '#alertFromActionSheet', true, testActionSheetAlert); -}); - -test('action-sheet:rtl: basic, cancel only', async () => { - await testActionSheet(DIRECTORY, '#cancelOnly', true); -}); - -test('action-sheet:rtl: basic, custom', async () => { - await testActionSheet(DIRECTORY, '#custom', true); -}); - -test('action-sheet:rtl: basic, icons', async () => { - await testActionSheet(DIRECTORY, '#icons', true); -}); - -test('action-sheet:rtl: basic, no backdrop dismiss', async () => { - await testActionSheet(DIRECTORY, '#noBackdropDismiss', true, testActionSheetBackdrop); -}); - -test('action-sheet:rtl: basic, scrollable options', async () => { - await testActionSheet(DIRECTORY, '#scrollableOptions', true); -}); - -test('action-sheet:rtl: basic, scroll without cancel', async () => { - await testActionSheet(DIRECTORY, '#scrollWithoutCancel', true); -}); - -test('action-sheet:rtl: basic, custom backdrop', async () => { - await testActionSheet(DIRECTORY, '#customBackdrop', true); -}); - -// Attributes - -test('action-sheet: htmlAttributes', async () => { - const page = await newE2EPage({ url: '/src/components/action-sheet/test/basic?ionic:_testing=true' }); - - await page.click('#basic'); - await page.waitForSelector('#basic'); - - const toast = await page.find('ion-action-sheet'); - - expect(toast).not.toBe(null); - await toast.waitForVisible(); - - const attribute = await page.evaluate(() => document.querySelector('ion-action-sheet').getAttribute('data-testid')); - - expect(attribute).toEqual('basic-action-sheet'); -}); diff --git a/core/src/components/action-sheet/test/basic/index.html b/core/src/components/action-sheet/test/basic/index.html index 859354c471..d2f94721e0 100644 --- a/core/src/components/action-sheet/test/basic/index.html +++ b/core/src/components/action-sheet/test/basic/index.html @@ -139,6 +139,7 @@ buttons: [ { text: 'Open Alert', + id: 'open-alert', handler: async () => { const alert = Object.assign(document.createElement('ion-alert'), { header: 'Alert from Action Sheet', diff --git a/core/src/components/action-sheet/test/spec/e2e.ts b/core/src/components/action-sheet/test/spec/e2e.ts deleted file mode 100644 index 2c3634d449..0000000000 --- a/core/src/components/action-sheet/test/spec/e2e.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { testActionSheet } from '../test.utils'; - -const DIRECTORY = 'spec'; - -test('action-sheet: spec', async () => { - await testActionSheet(DIRECTORY, '#spec'); -}); diff --git a/core/src/components/action-sheet/test/spec/index.html b/core/src/components/action-sheet/test/spec/index.html deleted file mode 100644 index a160cc051a..0000000000 --- a/core/src/components/action-sheet/test/spec/index.html +++ /dev/null @@ -1,84 +0,0 @@ - - - - - Action Sheet - Spec - - - - - - - - - - - - - Action Sheet - Spec - - - - - Spec - - - - - - diff --git a/core/src/components/action-sheet/test/test.utils.ts b/core/src/components/action-sheet/test/test.utils.ts deleted file mode 100644 index 615eb83da8..0000000000 --- a/core/src/components/action-sheet/test/test.utils.ts +++ /dev/null @@ -1,73 +0,0 @@ -import { newE2EPage } from '@stencil/core/testing'; -import { generateE2EUrl } from '@utils/test'; - -export const testActionSheet = async ( - type: string, - selector: string, - rtl = false, - afterScreenshotHook?: (...args: any[]) => void -) => { - try { - const pageUrl = generateE2EUrl('action-sheet', type, rtl); - - const page = await newE2EPage({ - url: pageUrl, - }); - - const screenshotCompares = []; - - const presentBtn = await page.find(selector); - await presentBtn.click(); - - let actionSheet = await page.find('ion-action-sheet'); - await actionSheet.waitForVisible(); - - screenshotCompares.push(await page.compareScreenshot()); - - if (afterScreenshotHook) { - await afterScreenshotHook(page, screenshotCompares, actionSheet); - } - - await actionSheet.callMethod('dismiss'); - await actionSheet.waitForNotVisible(); - - screenshotCompares.push(await page.compareScreenshot('dismiss')); - - actionSheet = await page.find('ion-action-sheet'); - expect(actionSheet).toBe(null); - - for (const screenshotCompare of screenshotCompares) { - expect(screenshotCompare).toMatchScreenshot(); - } - } catch (err) { - throw err; - } -}; - -export const testActionSheetBackdrop = async (page: any, screenshotCompares: any, actionSheet: any) => { - try { - const backdrop = await page.find('ion-backdrop'); - await backdrop.click(); - - screenshotCompares.push(await page.compareScreenshot(`dismiss backdrop`)); - - const isVisible = await actionSheet.isVisible(); - expect(isVisible).toBe(true); - } catch (err) { - throw err; - } -}; - -export const testActionSheetAlert = async (page: any, screenshotCompares: any) => { - const openAlertBtn = await page.find({ text: 'Open Alert' }); - await openAlertBtn.click(); - - const alert = await page.find('ion-alert'); - await alert.waitForVisible(); - await page.waitForTimeout(250); - - screenshotCompares.push(await page.compareScreenshot(`alert open`)); - - const alertOkayBtn = await page.find({ contains: 'Okay' }); - await alertOkayBtn.click(); -}; diff --git a/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts new file mode 100644 index 0000000000..c32529090a --- /dev/null +++ b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts @@ -0,0 +1,26 @@ +import { expect } from '@playwright/test'; +import { test } from '@utils/test/playwright'; + +test.describe('action sheet: translucent', () => { + test('should not have visual regressions', async ({ page }, testInfo) => { + test.skip(testInfo.project.metadata.mode === 'md', 'Translucent effect is only active on iOS mode'); + test.skip( + testInfo.project.metadata.rtl === true, + 'This tests how the component is painted, not layout. RTL tests are not needed here' + ); + + await page.goto(`/src/components/action-sheet/test/translucent`); + + const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent'); + + const basic = page.locator('#basic'); + await basic.click(); + + await ionActionSheetDidPresent.next(); + + const actionSheet = page.locator('ion-action-sheet'); + expect(await actionSheet.screenshot()).toMatchSnapshot( + `action-sheet-translucent-${page.getSnapshotSettings()}.png` + ); + }); +}); diff --git a/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Chrome-linux.png new file mode 100644 index 0000000000..d066c46938 Binary files /dev/null and b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Chrome-linux.png differ diff --git a/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Firefox-linux.png new file mode 100644 index 0000000000..5a55b099ad Binary files /dev/null and b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Firefox-linux.png differ diff --git a/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Safari-linux.png b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Safari-linux.png new file mode 100644 index 0000000000..526813b684 Binary files /dev/null and b/core/src/components/action-sheet/test/translucent/action-sheet.e2e.ts-snapshots/action-sheet-translucent-ios-ltr-Mobile-Safari-linux.png differ diff --git a/core/src/components/action-sheet/test/translucent/e2e.ts b/core/src/components/action-sheet/test/translucent/e2e.ts deleted file mode 100644 index 1438cf06ca..0000000000 --- a/core/src/components/action-sheet/test/translucent/e2e.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { testActionSheet } from '../test.utils'; - -const DIRECTORY = 'translucent'; - -test('action-sheet: translucent', async () => { - await testActionSheet(DIRECTORY, '#basic'); -});