mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 19:57:22 +08:00
test(many): add await to async asserts (#26456)
This commit is contained in:
@ -19,7 +19,7 @@ test.describe('accordion: states', () => {
|
|||||||
const accordionGroup = page.locator('ion-accordion-group');
|
const accordionGroup = page.locator('ion-accordion-group');
|
||||||
const accordion = page.locator('ion-accordion');
|
const accordion = page.locator('ion-accordion');
|
||||||
|
|
||||||
expect(accordion).toHaveJSProperty('readonly', false);
|
await expect(accordion).toHaveJSProperty('readonly', false);
|
||||||
|
|
||||||
await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
|
await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
|
||||||
el.readonly = true;
|
el.readonly = true;
|
||||||
@ -27,7 +27,7 @@ test.describe('accordion: states', () => {
|
|||||||
|
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
expect(accordion).toHaveJSProperty('readonly', true);
|
await expect(accordion).toHaveJSProperty('readonly', true);
|
||||||
});
|
});
|
||||||
|
|
||||||
test('should properly set disabled on child accordions', async ({ page }) => {
|
test('should properly set disabled on child accordions', async ({ page }) => {
|
||||||
@ -43,7 +43,7 @@ test.describe('accordion: states', () => {
|
|||||||
const accordionGroup = page.locator('ion-accordion-group');
|
const accordionGroup = page.locator('ion-accordion-group');
|
||||||
const accordion = page.locator('ion-accordion');
|
const accordion = page.locator('ion-accordion');
|
||||||
|
|
||||||
expect(accordion).toHaveJSProperty('disabled', false);
|
await expect(accordion).toHaveJSProperty('disabled', false);
|
||||||
|
|
||||||
await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
|
await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
|
||||||
el.disabled = true;
|
el.disabled = true;
|
||||||
@ -51,6 +51,6 @@ test.describe('accordion: states', () => {
|
|||||||
|
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
expect(accordion).toHaveJSProperty('disabled', true);
|
await expect(accordion).toHaveJSProperty('disabled', true);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -41,7 +41,7 @@ test.describe('action sheet: basic', () => {
|
|||||||
await actionSheetFixture.open('#basic');
|
await actionSheetFixture.open('#basic');
|
||||||
|
|
||||||
const actionSheet = page.locator('ion-action-sheet');
|
const actionSheet = page.locator('ion-action-sheet');
|
||||||
expect(actionSheet).toHaveAttribute('data-testid', 'basic-action-sheet');
|
await expect(actionSheet).toHaveAttribute('data-testid', 'basic-action-sheet');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
test.describe('action sheet: variants', () => {
|
test.describe('action sheet: variants', () => {
|
||||||
@ -78,7 +78,7 @@ test.describe('action sheet: basic', () => {
|
|||||||
await actionSheetFixture.open('#customBackdrop');
|
await actionSheetFixture.open('#customBackdrop');
|
||||||
|
|
||||||
const backdrop = page.locator('ion-action-sheet ion-backdrop');
|
const backdrop = page.locator('ion-action-sheet ion-backdrop');
|
||||||
expect(backdrop).toHaveCSS('opacity', '1');
|
await expect(backdrop).toHaveCSS('opacity', '1');
|
||||||
});
|
});
|
||||||
test('should open alert from action sheet', async ({ page, skip }) => {
|
test('should open alert from action sheet', async ({ page, skip }) => {
|
||||||
skip.rtl();
|
skip.rtl();
|
||||||
@ -96,7 +96,7 @@ test.describe('action sheet: basic', () => {
|
|||||||
const actionSheet = page.locator('ion-action-sheet');
|
const actionSheet = page.locator('ion-action-sheet');
|
||||||
await actionSheet.locator('ion-backdrop').click();
|
await actionSheet.locator('ion-backdrop').click();
|
||||||
|
|
||||||
expect(actionSheet).toBeVisible();
|
await expect(actionSheet).toBeVisible();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
test.describe('action sheet: focus trap', () => {
|
test.describe('action sheet: focus trap', () => {
|
||||||
@ -133,14 +133,14 @@ class ActionSheetFixture {
|
|||||||
await this.page.locator(selector).click();
|
await this.page.locator(selector).click();
|
||||||
await ionActionSheetDidPresent.next();
|
await ionActionSheetDidPresent.next();
|
||||||
this.actionSheet = this.page.locator('ion-action-sheet');
|
this.actionSheet = this.page.locator('ion-action-sheet');
|
||||||
expect(this.actionSheet).toBeVisible();
|
await expect(this.actionSheet).toBeVisible();
|
||||||
}
|
}
|
||||||
|
|
||||||
async dismiss() {
|
async dismiss() {
|
||||||
const ionActionSheetDidDismiss = await this.page.spyOnEvent('ionActionSheetDidDismiss');
|
const ionActionSheetDidDismiss = await this.page.spyOnEvent('ionActionSheetDidDismiss');
|
||||||
await this.actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.dismiss());
|
await this.actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.dismiss());
|
||||||
await ionActionSheetDidDismiss.next();
|
await ionActionSheetDidDismiss.next();
|
||||||
expect(this.actionSheet).not.toBeVisible();
|
await expect(this.actionSheet).not.toBeVisible();
|
||||||
}
|
}
|
||||||
|
|
||||||
async screenshot(modifier: string) {
|
async screenshot(modifier: string) {
|
||||||
|
@ -51,7 +51,7 @@ test.describe('alert: basic', () => {
|
|||||||
await page.goto(`/src/components/alert/test/basic`);
|
await page.goto(`/src/components/alert/test/basic`);
|
||||||
|
|
||||||
const alert = await openAlert(page, 'basic');
|
const alert = await openAlert(page, 'basic');
|
||||||
expect(alert).toHaveAttribute('data-testid', 'basic-alert');
|
await expect(alert).toHaveAttribute('data-testid', 'basic-alert');
|
||||||
});
|
});
|
||||||
|
|
||||||
test('should dismiss when async handler resolves', async ({ page, skip }) => {
|
test('should dismiss when async handler resolves', async ({ page, skip }) => {
|
||||||
|
@ -14,21 +14,21 @@ test.describe('datetime-button: switching to correct view', () => {
|
|||||||
});
|
});
|
||||||
test('should switch to a date-only view when the date button is clicked', async ({ page }) => {
|
test('should switch to a date-only view when the date button is clicked', async ({ page }) => {
|
||||||
const datetime = page.locator('ion-datetime');
|
const datetime = page.locator('ion-datetime');
|
||||||
expect(datetime).toHaveJSProperty('presentation', 'date-time');
|
await expect(datetime).toHaveJSProperty('presentation', 'date-time');
|
||||||
|
|
||||||
await page.locator('#date-button').click();
|
await page.locator('#date-button').click();
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
expect(datetime).toHaveJSProperty('presentation', 'date');
|
await expect(datetime).toHaveJSProperty('presentation', 'date');
|
||||||
});
|
});
|
||||||
test('should switch to a time-only view when the time button is clicked', async ({ page }) => {
|
test('should switch to a time-only view when the time button is clicked', async ({ page }) => {
|
||||||
const datetime = page.locator('ion-datetime');
|
const datetime = page.locator('ion-datetime');
|
||||||
expect(datetime).toHaveJSProperty('presentation', 'date-time');
|
await expect(datetime).toHaveJSProperty('presentation', 'date-time');
|
||||||
|
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
expect(datetime).toHaveJSProperty('presentation', 'time');
|
await expect(datetime).toHaveJSProperty('presentation', 'time');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -68,38 +68,38 @@ test.describe('datetime-button: popover', () => {
|
|||||||
|
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
|
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the time popover', async ({ page }) => {
|
test('should open the time popover', async ({ page }) => {
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
|
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
|
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the date popover then the time popover', async ({ page }) => {
|
test('should open the date popover then the time popover', async ({ page }) => {
|
||||||
await page.locator('#date-button').click();
|
await page.locator('#date-button').click();
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
|
|
||||||
await popover.evaluate((el: HTMLIonPopoverElement) => el.dismiss());
|
await popover.evaluate((el: HTMLIonPopoverElement) => el.dismiss());
|
||||||
await ionPopoverDidDismiss.next();
|
await ionPopoverDidDismiss.next();
|
||||||
|
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the time popover then the date popover', async ({ page }) => {
|
test('should open the time popover then the date popover', async ({ page }) => {
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
|
|
||||||
await popover.evaluate((el: HTMLIonPopoverElement) => el.dismiss());
|
await popover.evaluate((el: HTMLIonPopoverElement) => el.dismiss());
|
||||||
await ionPopoverDidDismiss.next();
|
await ionPopoverDidDismiss.next();
|
||||||
|
|
||||||
await page.locator('#date-button').click();
|
await page.locator('#date-button').click();
|
||||||
await ionPopoverDidPresent.next();
|
await ionPopoverDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -130,37 +130,37 @@ test.describe('datetime-button: modal', () => {
|
|||||||
|
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
|
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the time modal', async ({ page }) => {
|
test('should open the time modal', async ({ page }) => {
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
|
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
|
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the date modal then the time modal', async ({ page }) => {
|
test('should open the date modal then the time modal', async ({ page }) => {
|
||||||
await page.locator('#date-button').click();
|
await page.locator('#date-button').click();
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
|
|
||||||
await modal.evaluate((el: HTMLIonModalElement) => el.dismiss());
|
await modal.evaluate((el: HTMLIonModalElement) => el.dismiss());
|
||||||
await ionModalDidDismiss.next();
|
await ionModalDidDismiss.next();
|
||||||
|
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
test('should open the time modal then the date modal', async ({ page }) => {
|
test('should open the time modal then the date modal', async ({ page }) => {
|
||||||
await page.locator('#time-button').click();
|
await page.locator('#time-button').click();
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
|
|
||||||
await modal.evaluate((el: HTMLIonModalElement) => el.dismiss());
|
await modal.evaluate((el: HTMLIonModalElement) => el.dismiss());
|
||||||
await ionModalDidDismiss.next();
|
await ionModalDidDismiss.next();
|
||||||
|
|
||||||
await page.locator('#date-button').click();
|
await page.locator('#date-button').click();
|
||||||
await ionModalDidPresent.next();
|
await ionModalDidPresent.next();
|
||||||
expect(datetime).toBeVisible();
|
await expect(datetime).toBeVisible();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -214,8 +214,8 @@ test.describe('datetime: prefer wheel', () => {
|
|||||||
const monthValues = page.locator('.month-column .picker-item:not(.picker-item-empty)');
|
const monthValues = page.locator('.month-column .picker-item:not(.picker-item-empty)');
|
||||||
const dayValues = page.locator('.day-column .picker-item:not(.picker-item-empty)');
|
const dayValues = page.locator('.day-column .picker-item:not(.picker-item-empty)');
|
||||||
|
|
||||||
expect(monthValues).toHaveText(['1月', '2月', '3月']);
|
await expect(monthValues).toHaveText(['1月', '2月', '3月']);
|
||||||
expect(dayValues).toHaveText(['1日', '2日', '3日']);
|
await expect(dayValues).toHaveText(['1日', '2日', '3日']);
|
||||||
});
|
});
|
||||||
test('should render the columns according to locale - en-US', async ({ page }) => {
|
test('should render the columns according to locale - en-US', async ({ page }) => {
|
||||||
await page.setContent(`
|
await page.setContent(`
|
||||||
@ -334,7 +334,7 @@ test.describe('datetime: prefer wheel', () => {
|
|||||||
|
|
||||||
const dateValues = page.locator('.date-column .picker-item:not(.picker-item-empty)');
|
const dateValues = page.locator('.date-column .picker-item:not(.picker-item-empty)');
|
||||||
|
|
||||||
expect(dateValues).toHaveText(['2月1日(火)', '2月2日(水)', '2月3日(木)']);
|
await expect(dateValues).toHaveText(['2月1日(火)', '2月2日(水)', '2月3日(木)']);
|
||||||
});
|
});
|
||||||
test('should respect min and max bounds even across years', async ({ page }) => {
|
test('should respect min and max bounds even across years', async ({ page }) => {
|
||||||
await page.setContent(`
|
await page.setContent(`
|
||||||
@ -495,7 +495,7 @@ test.describe('datetime: prefer wheel', () => {
|
|||||||
|
|
||||||
const dateValues = page.locator('.date-column .picker-item:not(.picker-item-empty)');
|
const dateValues = page.locator('.date-column .picker-item:not(.picker-item-empty)');
|
||||||
|
|
||||||
expect(dateValues).toHaveText(['2月1日(火)', '2月2日(水)', '2月3日(木)']);
|
await expect(dateValues).toHaveText(['2月1日(火)', '2月2日(水)', '2月3日(木)']);
|
||||||
});
|
});
|
||||||
test('should respect min and max bounds even across years', async ({ page }) => {
|
test('should respect min and max bounds even across years', async ({ page }) => {
|
||||||
await page.setContent(`
|
await page.setContent(`
|
||||||
|
@ -47,28 +47,28 @@ test.describe('fab: basic (functionality checks)', () => {
|
|||||||
const fab = page.locator('#fab1');
|
const fab = page.locator('#fab1');
|
||||||
const fabList = fab.locator('ion-fab-list');
|
const fabList = fab.locator('ion-fab-list');
|
||||||
|
|
||||||
expect(fabList).not.toHaveClass(/fab-list-active/);
|
await expect(fabList).not.toHaveClass(/fab-list-active/);
|
||||||
|
|
||||||
// open fab
|
// open fab
|
||||||
await fab.click();
|
await fab.click();
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
expect(fabList).toHaveClass(/fab-list-active/);
|
await expect(fabList).toHaveClass(/fab-list-active/);
|
||||||
|
|
||||||
// close fab
|
// close fab
|
||||||
await fab.click();
|
await fab.click();
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
expect(fabList).not.toHaveClass(/fab-list-active/);
|
await expect(fabList).not.toHaveClass(/fab-list-active/);
|
||||||
});
|
});
|
||||||
|
|
||||||
test('should not open when disabled', async ({ page }) => {
|
test('should not open when disabled', async ({ page }) => {
|
||||||
const fab = page.locator('#fab2');
|
const fab = page.locator('#fab2');
|
||||||
const fabList = fab.locator('ion-fab-list');
|
const fabList = fab.locator('ion-fab-list');
|
||||||
|
|
||||||
expect(fabList).not.toHaveClass(/fab-list-active/);
|
await expect(fabList).not.toHaveClass(/fab-list-active/);
|
||||||
|
|
||||||
// attempt to open fab
|
// attempt to open fab
|
||||||
await fab.click();
|
await fab.click();
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
expect(fabList).not.toHaveClass(/fab-list-active/);
|
await expect(fabList).not.toHaveClass(/fab-list-active/);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
@ -47,13 +47,13 @@ test.describe('picker-internal', () => {
|
|||||||
|
|
||||||
// Focus first column
|
// Focus first column
|
||||||
await page.keyboard.press('Tab');
|
await page.keyboard.press('Tab');
|
||||||
expect(firstColumn).toBeFocused();
|
await expect(firstColumn).toBeFocused();
|
||||||
|
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
// Focus second column
|
// Focus second column
|
||||||
await page.keyboard.press('Tab');
|
await page.keyboard.press('Tab');
|
||||||
expect(secondColumn).toBeFocused();
|
await expect(secondColumn).toBeFocused();
|
||||||
});
|
});
|
||||||
|
|
||||||
test('tabbing should correctly move focus back', async ({ page }) => {
|
test('tabbing should correctly move focus back', async ({ page }) => {
|
||||||
@ -61,13 +61,13 @@ test.describe('picker-internal', () => {
|
|||||||
const secondColumn = page.locator('ion-picker-column-internal#second');
|
const secondColumn = page.locator('ion-picker-column-internal#second');
|
||||||
|
|
||||||
await secondColumn.focus();
|
await secondColumn.focus();
|
||||||
expect(secondColumn).toBeFocused();
|
await expect(secondColumn).toBeFocused();
|
||||||
|
|
||||||
await page.waitForChanges();
|
await page.waitForChanges();
|
||||||
|
|
||||||
// Focus first column
|
// Focus first column
|
||||||
await page.keyboard.press('Shift+Tab');
|
await page.keyboard.press('Shift+Tab');
|
||||||
expect(firstColumn).toBeFocused();
|
await expect(firstColumn).toBeFocused();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -22,7 +22,7 @@ test.describe('radio-group', () => {
|
|||||||
expect(radio).toBeHidden();
|
expect(radio).toBeHidden();
|
||||||
|
|
||||||
// ensure radio group has the same value
|
// ensure radio group has the same value
|
||||||
expect(radioGroup).toHaveJSProperty('value', 'two');
|
await expect(radioGroup).toHaveJSProperty('value', 'two');
|
||||||
|
|
||||||
// clear the search so the radio appears
|
// clear the search so the radio appears
|
||||||
await page.fill('ion-searchbar input', '');
|
await page.fill('ion-searchbar input', '');
|
||||||
|
Reference in New Issue
Block a user