javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-07 15:07:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

test(ripple-effect): enable ripple effect test (#26928)

Browse Source
This commit is contained in:
Sean Perkins
2023-03-10 15:00:05 -05:00
committed by GitHub
parent 27a5356fa2
commit 389595de3b
1 changed files with 11 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
core/src/components/ripple-effect/test/basic/ripple-effect.e2e.ts
View File

@ -2,8 +2,12 @@ import { expect } from '@playwright/test';
import type { E2EPage } from '@utils/test/playwright';
import { test } from '@utils/test/playwright';
// TODO FW-3081
test.describe.skip('ripple-effect: basic', () => {
test.describe('ripple-effect: basic', () => {
test.beforeEach(async ({ skip }) => {
skip.rtl();
skip.mode('ios');
});
test('should add .ion-activated when pressed', async ({ page }) => {
await verifyRippleEffect(page, '#small-btn');
await verifyRippleEffect(page, '#large-btn');
@ -14,7 +18,7 @@ test.describe.skip('ripple-effect: basic', () => {
test.describe('ripple effect with nested ion-button', () => {
test('should add .ion-activated when the block is pressed', async ({ page }) => {
await page.goto(`/src/components/ripple-effect/test/basic?ionic:_testing=false&ionic:mode=md`);
await page.goto('/src/components/ripple-effect/test/basic?ionic:_testing=false');
const el = page.locator('#ripple-with-button');
@ -30,9 +34,7 @@ test.describe.skip('ripple-effect: basic', () => {
// Waits for the ripple effect to be added
await page.waitForSelector('.ion-activated');
const elHandle = await el.elementHandle();
const classes = await elHandle?.evaluate((el) => el.classList.value);
expect(classes).toMatch(/ion-activated/);
await expect(el).toHaveClass(/ion-activated/);
});
test('should add .ion-activated when the button is pressed', async ({ page }) => {
@ -42,7 +44,7 @@ test.describe.skip('ripple-effect: basic', () => {
});
const verifyRippleEffect = async (page: E2EPage, selector: string) => {
await page.goto(`/src/components/ripple-effect/test/basic?ionic:_testing=false&ionic:mode=md`);
await page.goto('/src/components/ripple-effect/test/basic?ionic:_testing=false');
const el = page.locator(selector);
@ -55,10 +57,7 @@ const verifyRippleEffect = async (page: E2EPage, selector: string) => {
await page.mouse.down();
}
// Waits for the ripple effect to be added
await page.waitForSelector(`${selector}.ion-activated`);
await page.waitForSelector('.ion-activated');
const elHandle = await el.elementHandle();
const classes = await elHandle?.evaluate((el) => el.classList.value);
expect(classes).toMatch(/ion-activated/);
await expect(el).toHaveClass(/ion-activated/);
};