From 38d05b0fc5e5c006a428d9313b49456ca3427714 Mon Sep 17 00:00:00 2001
From: Shawn Taylor <shawn@ionic.io>
Date: Tue, 30 May 2023 15:19:08 -0400
Subject: [PATCH] test(datetime): reduce flakiness (#27549)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Sometimes the datetime picker hasn't scrolled to the correct date yet
before the screenshot is taken. (See JIRA ticket for a failing build.)

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- The test waits until the picker has scrolled before taking the
screenshot.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Hopefully this is all that's needed. I did a few runs and it hasn't
failed, but it's hard to know with flaky tests 🙃
---
 .../datetime/test/prefer-wheel/datetime.e2e.ts       | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/core/src/components/datetime/test/prefer-wheel/datetime.e2e.ts b/core/src/components/datetime/test/prefer-wheel/datetime.e2e.ts
index 6da78ca6db..9d9f2cf24b 100644
--- a/core/src/components/datetime/test/prefer-wheel/datetime.e2e.ts
+++ b/core/src/components/datetime/test/prefer-wheel/datetime.e2e.ts
@@ -16,36 +16,36 @@ configs().forEach(({ title, screenshot, config }) => {
       });
     });
 
-    // TODO FW-4110
-    test.skip('should not have visual regressions for date wheel', async ({ page }) => {
+    test('should not have visual regressions for date wheel', async ({ page }) => {
       await page.setContent(
         `
         <ion-datetime size="cover" presentation="date" prefer-wheel="true" value="2019-05-30" max="2022"></ion-datetime>
       `,
         config
       );
+      await page.waitForSelector('.datetime-ready');
 
       await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-date-diff`));
     });
-    // TODO FW-4110
-    test.skip('should not have visual regressions for date-time wheel', async ({ page }) => {
+    test('should not have visual regressions for date-time wheel', async ({ page }) => {
       await page.setContent(
         `
         <ion-datetime size="cover" presentation="date-time" prefer-wheel="true" value="2019-05-30T16:30:00" max="2022"></ion-datetime>
       `,
         config
       );
+      await page.waitForSelector('.datetime-ready');
 
       await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-date-time-diff`));
     });
-    // TODO FW-4110
-    test.skip('should not have visual regressions for time-date wheel', async ({ page }) => {
+    test('should not have visual regressions for time-date wheel', async ({ page }) => {
       await page.setContent(
         `
         <ion-datetime size="cover" presentation="time-date" prefer-wheel="true" value="2019-05-30T16:30:00" max="2022"></ion-datetime>
       `,
         config
       );
+      await page.waitForSelector('.datetime-ready');
 
       await expect(page).toHaveScreenshot(screenshot(`datetime-wheel-time-date-diff`));
     });