test(many): fix failing tests that CI was not reporting (#29485)

Code checks were passing even though these tests were failing because
the docker script was not exiting with the correct exit code. This PR
fixes the tests so that they pass, then PR
https://github.com/ionic-team/ionic-framework/pull/29425 can be merged
so CI will properly fail again when tests fail.

---------

Co-authored-by: Sean Perkins <sean.perkins@outsystems.com>
This commit is contained in:
Brandy Carney
2024-05-10 16:01:35 -04:00
committed by GitHub
parent 704765e620
commit 2007a44a27
41 changed files with 42 additions and 36 deletions

View File

@ -3,10 +3,11 @@ import { configs, test } from '@utils/test/playwright';
configs().forEach(({ config, title }) => { configs().forEach(({ config, title }) => {
test.describe(title('accordion: a11y'), () => { test.describe(title('accordion: a11y'), () => {
test('accordions should be keyboard navigable', async ({ page, skip, browserName }) => { // TODO(ROU-8157): remove skip once the keyboard navigation is working again
// TODO(FW-1764): remove skip once issue is resolved test.skip('accordions should be keyboard navigable', async ({ page, skip, browserName }) => {
// TODO(ROU-5358): remove skip once issue is resolved
skip.browser('firefox', 'https://github.com/ionic-team/ionic-framework/issues/25070'); skip.browser('firefox', 'https://github.com/ionic-team/ionic-framework/issues/25070');
// TODO (FW-2979) // TODO (ROU-5437)
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.'); skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
await page.goto(`/src/components/accordion/test/a11y`, config); await page.goto(`/src/components/accordion/test/a11y`, config);

View File

@ -2,7 +2,7 @@
<html lang="en" dir="ltr"> <html lang="en" dir="ltr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<title>Accordion - Basic</title> <title>Accordion - Standalone</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet" /> <link href="../../../../../css/ionic.bundle.css" rel="stylesheet" />
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet" /> <link href="../../../../../scripts/testing/styles.css" rel="stylesheet" />
@ -119,6 +119,7 @@
outline: none; outline: none;
text-align: left; text-align: left;
padding: 20px 16px; padding: 20px 16px;
color: black;
} }
.custom-accordion-content { .custom-accordion-content {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

After

Width:  |  Height:  |  Size: 17 KiB

View File

@ -11,7 +11,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ config, screenshot, t
test('should update the active item', async ({ page }) => { test('should update the active item', async ({ page }) => {
const breadcrumbItems = page.locator('ion-breadcrumb'); const breadcrumbItems = page.locator('ion-breadcrumb');
const addItemButton = page.locator('ion-button#add-btn'); const addItemButton = page.locator('#add-btn');
await expect(breadcrumbItems).toHaveCount(4); await expect(breadcrumbItems).toHaveCount(4);

View File

@ -7,7 +7,7 @@ configs().forEach(({ title, screenshot, config }) => {
await page.goto('/src/components/datetime/test/position', config); await page.goto('/src/components/datetime/test/position', config);
const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent'); const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
const openDateTimeBtn = page.locator('ion-button#open-datetime'); const openDateTimeBtn = page.locator('#open-datetime');
await openDateTimeBtn.click(); await openDateTimeBtn.click();
await ionPopoverDidPresent.next(); await ionPopoverDidPresent.next();

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

After

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 46 KiB

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

After

Width:  |  Height:  |  Size: 36 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 25 KiB

View File

@ -74,7 +74,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, screenshot, c
await ionLoadingDidPresent.next(); await ionLoadingDidPresent.next();
const button = page.locator('ion-loading ion-button'); const button = page.locator('ion-loading button');
if (browserName === 'webkit') { if (browserName === 'webkit') {
await page.keyboard.down('Alt'); await page.keyboard.down('Alt');

View File

@ -29,7 +29,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test('should trap focus', async ({ page, skip, browserName }) => { test('should trap focus', async ({ page, skip, browserName }) => {
skip.browser('firefox', 'Firefox incorrectly allows keyboard focus to move to ion-content'); skip.browser('firefox', 'Firefox incorrectly allows keyboard focus to move to ion-content');
// TODO (FW-2979) // TODO (ROU-5437)
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.'); skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
const ionDidOpen = await page.spyOnEvent('ionDidOpen'); const ionDidOpen = await page.spyOnEvent('ionDidOpen');

View File

@ -24,7 +24,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
await modal.evaluate((modal: HTMLIonModalElement) => { await modal.evaluate((modal: HTMLIonModalElement) => {
modal.remove(); modal.remove();
document.querySelector('ion-button')?.insertAdjacentElement('afterend', modal); document.querySelector('button')?.insertAdjacentElement('afterend', modal);
}); });
await page.waitForChanges(); await page.waitForChanges();

View File

@ -18,7 +18,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test.describe('pushing a new page', () => { test.describe('pushing a new page', () => {
test('should render the pushed component', async ({ page }) => { test('should render the pushed component', async ({ page }) => {
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
const pageOne = page.locator('page-one'); const pageOne = page.locator('page-one');
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
@ -32,7 +32,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
}); });
test('should render the back button', async ({ page }) => { test('should render the back button', async ({ page }) => {
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
const pageTwoBackButton = page.locator('page-two ion-back-button'); const pageTwoBackButton = page.locator('page-two ion-back-button');
await pageTwoButton.click(); await pageTwoButton.click();
@ -45,7 +45,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test('back button should pop to the previous page', async ({ page }) => { test('back button should pop to the previous page', async ({ page }) => {
const pageOne = page.locator('page-one'); const pageOne = page.locator('page-one');
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
const pageTwoBackButton = page.locator('page-two ion-back-button'); const pageTwoBackButton = page.locator('page-two ion-back-button');
await pageTwoButton.click(); await pageTwoButton.click();
@ -65,8 +65,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
const pageThree = page.locator('page-three'); const pageThree = page.locator('page-three');
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
const pageThreeButton = page.locator('ion-button:has-text("Go to Page Three")'); const pageThreeButton = page.locator('button:has-text("Go to Page Three")');
await pageTwoButton.click(); await pageTwoButton.click();
await page.waitForChanges(); await page.waitForChanges();

View File

@ -16,8 +16,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
const pageOne = page.locator('page-one'); const pageOne = page.locator('page-one');
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
const pageTwoButton = page.locator('ion-button:has-text("Go to Page 2")'); const pageTwoButton = page.locator('button:has-text("Go to Page 2")');
const pageTwoTwoButton = page.locator('ion-button:has-text("Go to Page 2.2")'); const pageTwoTwoButton = page.locator('button:has-text("Go to Page 2.2")');
await pageTwoButton.click(); await pageTwoButton.click();
await page.waitForChanges(); await page.waitForChanges();
@ -35,7 +35,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
await expect(pageTwoOne).toHaveCount(1); await expect(pageTwoOne).toHaveCount(1);
await expect(pageTwoTwo).toBeVisible(); await expect(pageTwoTwo).toBeVisible();
const pageThreeButton = page.locator('ion-button:has-text("Go to Page 3")'); const pageThreeButton = page.locator('button:has-text("Go to Page 3")');
await pageThreeButton.click(); await pageThreeButton.click();
await page.waitForChanges(); await page.waitForChanges();
@ -49,8 +49,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test.describe('back button', () => { test.describe('back button', () => {
test('should work with nested ion-nav', async ({ page }) => { test('should work with nested ion-nav', async ({ page }) => {
const pageTwoButton = page.locator('ion-button:has-text("Go to Page 2")'); const pageTwoButton = page.locator('button:has-text("Go to Page 2")');
const pageTwoTwoButton = page.locator('ion-button:has-text("Go to Page 2.2")'); const pageTwoTwoButton = page.locator('button:has-text("Go to Page 2.2")');
await pageTwoButton.click(); await pageTwoButton.click();
await page.waitForChanges(); await page.waitForChanges();
@ -61,7 +61,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
await pageTwoTwoButton.click(); await pageTwoTwoButton.click();
await page.waitForChanges(); await page.waitForChanges();
const pageThreeButton = page.locator('ion-button:has-text("Go to Page 3")'); const pageThreeButton = page.locator('button:has-text("Go to Page 3")');
const pageThreeBackButton = page.locator('page-three ion-back-button'); const pageThreeBackButton = page.locator('page-three ion-back-button');
await pageThreeButton.click(); await pageThreeButton.click();

View File

@ -24,8 +24,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
const pageOne = page.locator('page-one'); const pageOne = page.locator('page-one');
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")'); const pageOneButton = page.locator('button:has-text("Go to Page One")');
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
await pageOneButton.click(); await pageOneButton.click();
await page.waitForChanges(); await page.waitForChanges();
@ -45,7 +45,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
}); });
test('should render the back button', async ({ page }) => { test('should render the back button', async ({ page }) => {
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")'); const pageOneButton = page.locator('button:has-text("Go to Page One")');
const pageOneBackButton = page.locator('page-one ion-back-button'); const pageOneBackButton = page.locator('page-one ion-back-button');
await pageOneButton.click(); await pageOneButton.click();
@ -59,7 +59,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
const pageRoot = page.locator('page-root'); const pageRoot = page.locator('page-root');
const pageOne = page.locator('page-one'); const pageOne = page.locator('page-one');
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")'); const pageOneButton = page.locator('button:has-text("Go to Page One")');
const pageOneBackButton = page.locator('page-one ion-back-button'); const pageOneBackButton = page.locator('page-one ion-back-button');
await pageOneButton.click(); await pageOneButton.click();
@ -80,9 +80,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
const pageTwo = page.locator('page-two'); const pageTwo = page.locator('page-two');
const pageThree = page.locator('page-three'); const pageThree = page.locator('page-three');
const pageOneButton = page.locator('ion-button:has-text("Go to Page One")'); const pageOneButton = page.locator('button:has-text("Go to Page One")');
const pageTwoButton = page.locator('ion-button:has-text("Go to Page Two")'); const pageTwoButton = page.locator('button:has-text("Go to Page Two")');
const pageThreeButton = page.locator('ion-button:has-text("Go to Page Three")'); const pageThreeButton = page.locator('button:has-text("Go to Page Three")');
await pageOneButton.click(); await pageOneButton.click();
await page.waitForChanges(); await page.waitForChanges();

View File

@ -105,7 +105,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
); );
}); });
test('tabbing should correctly move focus between columns', async ({ page }) => { // TODO(FW-6232): remove this skip when tabbing is working properly
test.skip('tabbing should correctly move focus between columns', async ({ page }) => {
const firstColumn = page.locator('ion-picker-column#first'); const firstColumn = page.locator('ion-picker-column#first');
const secondColumn = page.locator('ion-picker-column#second'); const secondColumn = page.locator('ion-picker-column#second');
@ -120,7 +121,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
await expect(secondColumn).toBeFocused(); await expect(secondColumn).toBeFocused();
}); });
test('tabbing should correctly move focus back', async ({ page }) => { // TODO(FW-6232): remove this skip when tabbing is working properly
test.skip('tabbing should correctly move focus back', async ({ page }) => {
const firstColumn = page.locator('ion-picker-column#first'); const firstColumn = page.locator('ion-picker-column#first');
const secondColumn = page.locator('ion-picker-column#second'); const secondColumn = page.locator('ion-picker-column#second');

View File

@ -7,7 +7,8 @@ import type { E2ELocator } from '@utils/test/playwright/page/utils/locator';
*/ */
configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => { configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => {
test.describe(title('picker: keyboard entry'), () => { test.describe(title('picker: keyboard entry'), () => {
test('should scroll to and update the value prop for a single column', async ({ page }) => { // TODO(FW-6232): remove this skip when keyboard entry is working properly
test.skip('should scroll to and update the value prop for a single column', async ({ page }) => {
await page.setContent( await page.setContent(
` `
<ion-picker> <ion-picker>
@ -122,7 +123,8 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
await expect(secondColumn).toHaveJSProperty('value', 24); await expect(secondColumn).toHaveJSProperty('value', 24);
}); });
test('should select 00', async ({ page }) => { // TODO(FW-6232): remove this skip when keyboard entry is working properly
test.skip('should select 00', async ({ page }) => {
await page.setContent( await page.setContent(
` `
<ion-picker> <ion-picker>

View File

@ -40,7 +40,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
await popover.evaluate((popover: HTMLIonPopoverElement) => { await popover.evaluate((popover: HTMLIonPopoverElement) => {
popover.remove(); popover.remove();
document.querySelector('ion-button')?.insertAdjacentElement('afterend', popover); document.querySelector('button')?.insertAdjacentElement('afterend', popover);
}); });
await page.waitForChanges(); await page.waitForChanges();

View File

@ -20,7 +20,7 @@ const checkedOptions: SelectPopoverOption[] = [
configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => { configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
test.describe(title('select-popover: basic'), () => { test.describe(title('select-popover: basic'), () => {
test.beforeEach(({ browserName }) => { test.beforeEach(({ browserName }) => {
test.skip(browserName === 'webkit', 'https://ionic-cloud.atlassian.net/browse/FW-2979'); test.skip(browserName === 'webkit', 'ROU-5437');
}); });
test.describe('single selection', () => { test.describe('single selection', () => {
@ -55,7 +55,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
}); });
test('pressing Space on a selected option should dismiss the popover', async ({ browserName }) => { test('pressing Space on a selected option should dismiss the popover', async ({ browserName }) => {
test.skip(browserName === 'firefox', 'Same behavior as https://ionic-cloud.atlassian.net/browse/FW-2979'); test.skip(browserName === 'firefox', 'Same behavior as ROU-5437');
await selectPopoverPage.setup(config, checkedOptions, false); await selectPopoverPage.setup(config, checkedOptions, false);

View File

@ -40,7 +40,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, config }) => {
test.describe('select: popover', () => { test.describe('select: popover', () => {
test('it should open a popover select', async ({ page, skip }) => { test('it should open a popover select', async ({ page, skip }) => {
// TODO (FW-2979) // TODO (ROU-5437)
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.'); skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent'); const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');

View File

@ -4,7 +4,7 @@ import { configs, test } from '@utils/test/playwright';
configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => { configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => {
test.describe(title('select: disabled options'), () => { test.describe(title('select: disabled options'), () => {
test('should not focus a disabled option when no value is set', async ({ page, skip }) => { test('should not focus a disabled option when no value is set', async ({ page, skip }) => {
// TODO (FW-2979) // TODO (ROU-5437)
skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.'); skip.browser('webkit', 'Safari 16 only allows text fields and pop-up menus to be focused.');
test.info().annotations.push({ test.info().annotations.push({