javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

test(picker-column-internal): migrate tests to playwright (#25211)

Browse Source
This commit is contained in:
Sean Perkins
2022-04-29 13:04:12 -04:00
committed by GitHub
parent 68b2f8bfe1
commit ad94e872bd
7 changed files with 124 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
core/src/components/picker-column-internal/test/basic/e2e.ts
View File

@ -1,76 +0,0 @@
import type { E2EPage } from '@stencil/core/testing';
import { newE2EPage } from '@stencil/core/testing';
describe('picker-column-internal', () => {
let page: E2EPage;
describe('default', () => {
beforeEach(async () => {
page = await newE2EPage({
url: '/src/components/picker-column-internal/test/basic?ionic:_testing=true',
});
});
it('should render a picker item for each item', async () => {
const columns = await page.findAll('ion-picker-column-internal >>> .picker-item:not(.picker-item-empty)');
expect(columns.length).toEqual(24);
});
it('should render 6 empty picker items', async () => {
const columns = await page.findAll('ion-picker-column-internal >>> .picker-item-empty');
expect(columns.length).toEqual(6);
});
it('should not have an active item when value is not set', async () => {
const activeColumn = await page.findAll('ion-picker-column-internal >>> .picker-item-active');
expect(activeColumn.length).toEqual(0);
});
it('should have an active item when value is set', async () => {
await page.$eval('ion-picker-column-internal#default', (el: any) => {
el.value = '12';
});
await page.waitForChanges();
const activeColumn = await page.find('ion-picker-column-internal >>> .picker-item-active');
expect(activeColumn).not.toBeNull();
});
it('scrolling should change the active item', async () => {
await page.$eval('ion-picker-column-internal#default', (el: any) => {
el.scrollTop = 801;
});
await page.waitForChanges();
const activeColumn = await page.find('ion-picker-column-internal >>> .picker-item-active');
expect(activeColumn.innerText).toEqual('23');
});
it('should not emit ionChange when the value is modified externally', async () => {
const pickerColumn = await page.find('#default');
const ionChangeSpy = await pickerColumn.spyOnEvent('ionChange');
await page.$eval('#default', (el: any) => {
el.value = '12';
});
expect(ionChangeSpy).not.toHaveReceivedEvent();
});
it('should emit ionChange when the picker is scrolled', async () => {
const pickerColumn = await page.find('#default');
const ionChangeSpy = await pickerColumn.spyOnEvent('ionChange');
await page.$eval('#default', (el: any) => {
el.scrollTo(0, el.scrollHeight);
});
await ionChangeSpy.next();
expect(ionChangeSpy).toHaveReceivedEvent();
});
});
});

74
core/src/components/picker-column-internal/test/basic/picker-column-internal.e2e.ts Normal file
View File

@ -0,0 +1,74 @@
import { expect } from '@playwright/test';
import { test } from '@utils/test/playwright';
test.describe('picker-column-internal', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/src/components/picker-column-internal/test/basic');
});
test('should render a picker item for each item', async ({ page }) => {
const columns = page.locator('ion-picker-column-internal .picker-item:not(.picker-item-empty)');
expect(columns).toHaveCount(24);
});
test('should render 6 empty picker items', async ({ page }) => {
const columns = page.locator('ion-picker-column-internal .picker-item-empty');
expect(columns).toHaveCount(6);
});
test('should not have an active item when value is not set', async ({ page }) => {
const activeColumn = page.locator('ion-picker-column-internal .picker-item-active');
expect(activeColumn).toHaveCount(0);
});
test('should have an active item when value is set', async ({ page }) => {
await page.locator('#default').evaluate((el: HTMLIonPickerColumnInternalElement) => {
el.value = '12';
});
await page.waitForChanges();
const activeColumn = page.locator('ion-picker-column-internal .picker-item-active');
expect(activeColumn).not.toBeNull();
});
test('scrolling should change the active item', async ({ page, browserName }) => {
test.skip(browserName === 'firefox', 'https://bugzilla.mozilla.org/show_bug.cgi?id=1766890');
await page.locator('#default').evaluate((el: HTMLIonPickerColumnInternalElement) => {
el.scrollTop = 801;
});
await page.waitForChanges();
const activeColumn = page.locator('ion-picker-column-internal .picker-item-active');
expect(await activeColumn?.innerText()).toEqual('23');
});
test('should not emit ionChange when the value is modified externally', async ({ page, browserName }) => {
test.skip(browserName === 'firefox', 'https://bugzilla.mozilla.org/show_bug.cgi?id=1766890');
const ionChangeSpy = await page.spyOnEvent('ionChange');
await page.locator('#default').evaluate((el: HTMLIonPickerColumnInternalElement) => {
el.value = '12';
});
expect(ionChangeSpy).not.toHaveReceivedEvent();
});
test('should emit ionChange when the picker is scrolled', async ({ page, browserName }) => {
test.skip(browserName === 'firefox', 'https://bugzilla.mozilla.org/show_bug.cgi?id=1766890');
const ionChangeSpy = await page.spyOnEvent('ionChange');
await page.locator('#default').evaluate((el: HTMLIonPickerColumnInternalElement) => {
el.scrollTo(0, el.scrollHeight);
});
await page.waitForChanges();
await ionChangeSpy.next();
expect(ionChangeSpy).toHaveReceivedEvent();
});
});