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

chore: sync with main

Browse Source
This commit is contained in:
Liam DeBeasi
2024-02-07 11:48:46 -05:00
parent ed7f30b672 b03dac0870
commit 1091534397
167 changed files with 1120 additions and 841 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
core/src/components/datetime/test/a11y/datetime.e2e.ts
View File

@ -24,7 +24,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
const container = page.locator('#container');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(container).toHaveScreenshot(screenshot(`datetime-scale`));
});
@ -87,7 +87,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const clearButton = page.locator('#clear-button button');
const selectedDay = page.locator('.calendar-day-active');
@ -114,7 +114,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
const calendarBody = page.locator('.calendar-body');
await expect(calendarMonthYear).toHaveText('February 2022');

24
core/src/components/datetime/test/basic/datetime.e2e.ts
View File

@ -110,7 +110,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
const ionChange = await page.spyOnEvent('ionChange');
@ -255,7 +255,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarBody = page.locator('ion-datetime .calendar-body');
const calendarHeader = page.locator('ion-datetime .calendar-month-year');
@ -275,7 +275,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarBody = page.locator('ion-datetime .calendar-body');
const calendarHeader = page.locator('ion-datetime .calendar-month-year');
@ -297,7 +297,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarBody = page.locator('ion-datetime .calendar-body');
const calendarHeader = page.locator('ion-datetime .calendar-month-year');
@ -331,7 +331,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const monthYearButton = page.locator('ion-datetime .calendar-month-year');
const monthYearInterface = page.locator('ion-datetime .datetime-year');
@ -349,7 +349,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
await datetime.evaluate((el: HTMLIonDatetimeElement) => el.style.removeProperty('display'));
await expect(datetime).toBeVisible();
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
// month/year interface should be reset
await expect(monthYearInterface).toBeHidden();
@ -399,7 +399,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const selectedDay = page.locator('ion-datetime .calendar-day-active');
@ -428,7 +428,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const calendarButtons = page.locator('.calendar-day:not([disabled])');
@ -447,7 +447,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const datetime = page.locator('ion-datetime');
@ -487,7 +487,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
const datetime = page.locator('ion-datetime');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(datetime.locator('.calendar-day-today')).toHaveScreenshot(
screenshot(`datetime-today-calendar-button`)
@ -517,7 +517,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, screenshot, co
const datetime = page.locator('ion-datetime');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(datetime).toHaveScreenshot(screenshot(`date-highlight-start-of-month`));
@ -543,7 +543,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');

15
core/src/components/datetime/test/basic/index.html
View File

@ -214,8 +214,7 @@
<ion-popover class="options-popover" trigger="popover-trigger">
<ion-list lines="none">
<ion-item>
<ion-label>Dark Mode</ion-label>
<ion-checkbox slot="end"></ion-checkbox>
<ion-checkbox>Dark Mode</ion-checkbox>
</ion-item>
<ion-item detail="true" href="?ionic:mode=ios">
<ion-label>iOS Mode</ion-label>
@ -225,23 +224,19 @@
</ion-item>
<ion-item>
<ion-label>Show Default Title</ion-label>
<ion-toggle id="titleToggle"></ion-toggle>
<ion-toggle id="titleToggle">Show Default Title</ion-toggle>
</ion-item>
<ion-item>
<ion-label>Show Default Buttons</ion-label>
<ion-toggle id="buttonsToggle"></ion-toggle>
<ion-toggle id="buttonsToggle">Show Default Buttons</ion-toggle>
</ion-item>
<ion-item>
<ion-label>Locale</ion-label>
<ion-input placeholder="default" id="locale"></ion-input>
<ion-input label="Locale" placeholder="default" id="locale"></ion-input>
</ion-item>
<ion-item>
<ion-label>Color</ion-label>
<ion-select id="color" value="primary">
<ion-select label="Color" id="color" value="primary">
<ion-select-option value="primary">Primary</ion-select-option>
<ion-select-option value="secondary">Secondary</ion-select-option>
<ion-select-option value="tertiary">Tertiary</ion-select-option>

2
core/src/components/datetime/test/datetime.e2e.ts
View File

@ -11,7 +11,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
});
test('should switch the calendar header when moving to a month with a different number of days', async ({

2
core/src/components/datetime/test/disable-dates/datetime.e2e.ts
View File

@ -113,7 +113,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
test.describe('check example usages', () => {
test.beforeEach(async ({ page }) => {
await page.goto('/src/components/datetime/test/disable-dates', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').first().waitFor();
});
test('should disable a specific date', async ({ page }) => {

8
core/src/components/datetime/test/disabled/datetime.e2e.ts
View File

@ -27,7 +27,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const febFirstButton = page.locator(`.calendar-day[data-day='1'][data-month='2']`);
@ -42,7 +42,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
await expect(calendarMonthYear.locator('button')).toBeDisabled();
});
@ -71,7 +71,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const clearButton = page.locator('#clear-button button');
@ -86,7 +86,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
const calendarBody = page.locator('.calendar-body');
await expect(calendarMonthYear).toHaveText('February 2022');

18
core/src/components/datetime/test/display/datetime.e2e.ts
View File

@ -15,7 +15,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-date-time`));
});
@ -26,7 +26,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-time-date`));
});
@ -37,7 +37,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-time`));
});
@ -48,7 +48,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-date`));
});
@ -69,7 +69,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-cover-date-time`));
});
@ -80,7 +80,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-cover-time-date`));
});
@ -91,7 +91,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-cover-time`));
});
@ -102,7 +102,7 @@ configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await expect(datetime).toHaveScreenshot(screenshot(`datetime-display-cover-date`));
});
@ -119,7 +119,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test('month selection should work after changing presentation', async ({ page }) => {
await page.goto('/src/components/datetime/test/display', config);
const ionWorkingPartsDidChange = await page.spyOnEvent('ionWorkingPartsDidChange');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const select = page.locator('select#presentation');

6
core/src/components/datetime/test/locale/datetime.e2e.ts
View File

@ -95,7 +95,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetimeButtons = page.locator('ion-datetime .calendar-day:not([disabled])');
@ -111,7 +111,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetimeYear = page.locator('ion-datetime .year-column ion-picker-column-option').nth(0);
await expect(datetimeYear).toHaveText('٢٠٢٢');
@ -146,7 +146,7 @@ class DatetimeLocaleFixture {
this.datetime = this.page.locator('ion-datetime');
await this.page.waitForSelector('.datetime-ready');
await this.page.locator('.datetime-ready').waitFor();
}
async expectLocalizedDatePicker(screenshot: ScreenshotFn) {

22
core/src/components/datetime/test/minmax/datetime.e2e.ts
View File

@ -36,7 +36,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const prevButton = page.locator('ion-datetime .calendar-next-prev ion-button:nth-child(1)');
const nextButton = page.locator('ion-datetime .calendar-next-prev ion-button:nth-child(2)');
@ -61,7 +61,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
await page.goto('/src/components/datetime/test/minmax', config);
const calendarMonths = page.locator('ion-datetime#inside .calendar-month');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').first().waitFor();
await expect(calendarMonths.nth(0)).not.toHaveClass(/calendar-month-disabled/);
await expect(calendarMonths.nth(1)).not.toHaveClass(/calendar-month-disabled/);
@ -70,7 +70,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
test('datetime: minmax navigation disabled', async ({ page }) => {
await page.goto('/src/components/datetime/test/minmax', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').first().waitFor();
const navButtons = page.locator('ion-datetime#outside .calendar-next-prev ion-button');
@ -80,7 +80,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
test('datetime: min including day should not disable month', async ({ page }) => {
await page.goto('/src/components/datetime/test/minmax', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').first().waitFor();
const calendarMonths = page.locator('ion-datetime#min-with-day .calendar-month');
@ -102,7 +102,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionPopoverDidPresent = await page.spyOnEvent('ionPopoverDidPresent');
@ -120,7 +120,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
test.describe('setting value outside bounds should show in-bounds month', () => {
const testDisplayedMonth = async (page: E2EPage, content: string, expectedString = /June 2021/) => {
await page.setContent(content, config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
await expect(calendarMonthYear).toHaveText(expectedString);
@ -170,7 +170,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetimeMonthDidChange = await page.spyOnEvent('datetimeMonthDidChange');
const eventButton = page.locator('button#bind');
@ -252,7 +252,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
const ionChange = await page.spyOnEvent('ionChange');
@ -275,7 +275,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
const ionChange = await page.spyOnEvent('ionChange');
@ -303,7 +303,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
const monthColumnItems = page.locator('ion-datetime .month-column ion-picker-column-option');
const ionChange = await page.spyOnEvent('ionChange');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await monthColumnItems.nth(0).click(); // switch to January
await ionChange.next();
@ -338,7 +338,7 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
// Select Jan 10, 2022
const maxDate = page.locator('ion-datetime .calendar-day[data-day="10"][data-month="1"][data-year="2022"]');

2
core/src/components/datetime/test/month-year-picker/datetime.e2e.ts
View File

@ -8,7 +8,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test.describe(title('datetime: month-year picker'), () => {
test.beforeEach(async ({ page }) => {
await page.goto('/src/components/datetime/test/month-year-picker', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').first().waitFor();
});
test('should hide the footer when picker is open', async ({ page }) => {

4
core/src/components/datetime/test/multiple/datetime.e2e.ts
View File

@ -62,7 +62,7 @@ class DatetimeMultipleFixture {
);
this.datetime = this.page.locator('ion-datetime');
await this.page.waitForSelector('.datetime-ready');
await this.page.locator('.datetime-ready').waitFor();
return this.datetime;
}
@ -304,7 +304,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
`,
config
);
await page.waitForSelector(`.datetime-ready`);
await page.locator(`.datetime-ready`).waitFor();
const datetime = page.locator('ion-datetime');
const header = datetime.locator('.datetime-selected-date');

2
core/src/components/datetime/test/position/datetime.e2e.ts
View File

@ -11,7 +11,7 @@ configs().forEach(({ title, screenshot, config }) => {
await openDateTimeBtn.click();
await ionPopoverDidPresent.next();
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(page).toHaveScreenshot(screenshot(`datetime-position-base`));

64
core/src/components/datetime/test/prefer-wheel/datetime.e2e.ts
View File

@ -23,7 +23,7 @@ configs().forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-date-diff`));
});
@ -34,7 +34,7 @@ configs().forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-date-time-diff`));
});
@ -45,7 +45,7 @@ configs().forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-time-date-diff`));
});
@ -56,7 +56,7 @@ configs().forEach(({ title, screenshot, config }) => {
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
@ -80,7 +80,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .day-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(27);
@ -93,7 +93,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .day-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(1);
@ -116,7 +116,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const disabledMonths = page.locator('.month-column ion-picker-column-option.option-disabled');
const disabledYears = page.locator('.year-column ion-picker-column-option.option-disabled');
@ -141,7 +141,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const monthValues = page.locator('.month-column ion-picker-column-option');
const yearValues = page.locator('.year-column ion-picker-column-option');
@ -175,7 +175,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const monthValues = page.locator('.month-column ion-picker-column-option');
@ -209,7 +209,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const dayValues = page.locator('.day-column ion-picker-column-option');
@ -230,7 +230,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const yearValues = page.locator('.year-column ion-picker-column-option');
@ -253,7 +253,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await datetime.evaluate((el: HTMLIonDatetimeElement) => (el.value = '2021-05-25T12:40:00.000Z'));
@ -285,7 +285,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const monthValues = page.locator('.month-column ion-picker-column-option');
const dayValues = page.locator('.day-column ion-picker-column-option');
@ -305,7 +305,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const columns = page.locator('ion-picker-column');
@ -326,7 +326,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const columns = page.locator('ion-picker-column');
@ -345,7 +345,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .date-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(57);
@ -358,7 +358,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .date-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(41);
@ -381,7 +381,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const disabledDates = page.locator('.date-column ion-picker-column-option.option-disabled');
@ -402,7 +402,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateValues = page.locator('.date-column ion-picker-column-option');
@ -423,7 +423,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateValues = page.locator('.date-column ion-picker-column-option');
await expect(dateValues).toHaveText(['2月1日(火)', '2月2日(水)', '2月3日(木)']);
@ -442,7 +442,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateColumn = page.locator('.date-column');
const dateColumnScrollEl = dateColumn.locator('.picker-opts');
@ -473,7 +473,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('.date-column ion-picker-column-option');
@ -493,7 +493,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('.date-column ion-picker-column-option');
@ -510,7 +510,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const ionChange = await page.spyOnEvent('ionChange');
const dayValues = page.locator('.date-column ion-picker-column-option');
@ -530,7 +530,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .date-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(57);
@ -543,7 +543,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('ion-datetime .date-column ion-picker-column-option');
expect(await dayValues.count()).toEqual(41);
@ -566,7 +566,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const disabledDates = page.locator('.date-column ion-picker-column-option.option-disabled');
@ -587,7 +587,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateValues = page.locator('.date-column ion-picker-column-option');
@ -608,7 +608,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateValues = page.locator('.date-column ion-picker-column-option');
@ -628,7 +628,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dateColumn = page.locator('.date-column');
const dateColumnScrollEl = dateColumn.locator('.picker-opts');
@ -659,7 +659,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('.date-column ion-picker-column-option');
@ -679,7 +679,7 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const dayValues = page.locator('.date-column ion-picker-column-option');

6
core/src/components/datetime/test/presentation/datetime.e2e.ts
View File

@ -117,7 +117,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
const monthYearButton = page.locator('ion-datetime .calendar-month-year');
@ -189,7 +189,7 @@ class DatetimePresentationFixture {
`,
config
);
await this.page.waitForSelector('.datetime-ready');
await this.page.locator('.datetime-ready').waitFor();
this.datetime = this.page.locator('ion-datetime');
}
@ -214,7 +214,7 @@ class TimePickerFixture {
`,
config
);
await this.page.waitForSelector('.datetime-ready');
await this.page.locator('.datetime-ready').waitFor();
this.timePicker = this.page.locator('ion-datetime');
}

8
core/src/components/datetime/test/readonly/datetime.e2e.ts
View File

@ -27,7 +27,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const febFirstButton = page.locator(`.calendar-day[data-day='1'][data-month='2']`);
@ -43,7 +43,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
);
const ionChange = await page.spyOnEvent('ionChange');
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
await expect(calendarMonthYear).toHaveText('February 2022');
@ -66,7 +66,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab';
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const calendarMonthYear = page.locator('ion-datetime .calendar-month-year');
const monthYearButton = page.locator('.calendar-month-year-toggle');
await expect(calendarMonthYear).toHaveText('February 2022');
@ -157,7 +157,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config, scree
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const clearButton = page.locator('#clear-button button');

8
core/src/components/datetime/test/set-value/datetime.e2e.ts
View File

@ -5,7 +5,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test.describe(title('datetime: set-value'), () => {
test('should update the active date when value is initially set', async ({ page }) => {
await page.goto('/src/components/datetime/test/set-value', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await datetime.evaluate((el: HTMLIonDatetimeElement) => (el.value = '2021-11-25T12:40:00.000Z'));
@ -18,7 +18,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test('should update the active time when value is initially set', async ({ page }) => {
await page.goto('/src/components/datetime/test/set-value', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await datetime.evaluate((el: HTMLIonDatetimeElement) => (el.value = '2021-11-25T12:40:00.000Z'));
@ -37,7 +37,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
const activeDayButton = page.locator('.calendar-day-active');
@ -53,7 +53,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
test('should scroll to new month when value is initially set and then updated', async ({ page }) => {
await page.goto('/src/components/datetime/test/set-value', config);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const datetime = page.locator('ion-datetime');
await datetime.evaluate((el: HTMLIonDatetimeElement) => (el.value = '2021-05-25T12:40:00.000Z'));

4
core/src/components/datetime/test/time-label/datetime.e2e.ts
View File

@ -10,7 +10,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const timeLabel = page.locator('ion-datetime .time-header');
await expect(timeLabel).toHaveText('Time');
@ -22,7 +22,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const timeLabel = page.locator('ion-datetime .time-header');
await expect(timeLabel).toHaveText('');

8
core/src/components/datetime/test/values/datetime.e2e.ts
View File

@ -10,7 +10,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
`,
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const items = page.locator('.calendar-day:not([disabled])');
@ -91,7 +91,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const minuteColumn = page.locator('ion-picker-column').nth(1);
const minuteItems = minuteColumn.locator('ion-picker-column-option');
@ -139,7 +139,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const monthItems = page.locator('.month-column ion-picker-column-option');
await expect(monthItems).toHaveText(['January']);
@ -171,7 +171,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
config
);
await page.waitForSelector('.datetime-ready');
await page.locator('.datetime-ready').waitFor();
const todayButton = page.locator('.calendar-day[data-day="10"][data-month="10"][data-year="2022"]');