fix: better e2e (#406)

## 📜 Description

Partially fixed e2e tests flakiness.

## 💡 Motivation and Context

To make e2e on CI more reliable and less error prone.

## 📢 Changelog

### CI

- pin XCode version to 15.3;

### E2E

- use "09:41" time for simulator (finally it works and actually
ovewrites time in simulator, though "12:00" is not a valid format
anymore);
- get rid off `waitForExpect` in favour of `async-retry` and own version
of `waitForExpect` (no more infinite tasks - now it fails gracefully and
keeps actual screenshot which cause failure);
- added missing `waitFor.toBeVisible` when we interact with scroll view
(scroll it down until element is visible);
- updated assets (to reflect "09:41" + cellar level);
- log acceptable diff;

## 🤔 How Has This Been Tested?

Tested on CI.

## 📝 Checklist

- [ ] CI successfully passed
- [x] I added new mocks and corresponding unit-tests if library API was
changed

.github/workflows/ios-e2e-test.yml

@@ -37,11 +37,14 @@ jobs:
         with:
           node-version: 18.x
           cache: "yarn"
+      - uses: maxim-lobanov/setup-xcode@v1
+        with:
+          xcode-version: "15.3"
       - name: Get Xcode version
         run: xcodebuild -version
       - name: Install AppleSimulatorUtils
         run: brew tap wix/brew && brew install applesimutils
-      - name: Get yarn cache directory path
+      - name: Save yarn cache directory path
         id: yarn-cache-dir-path
         run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
       - name: Restore node_modules from cache

e2e/kit/001-keyboard-animation.e2e.ts

@@ -1,7 +1,10 @@
-import waitForExpect from "wait-for-expect";
-
 import { expectBitmapsToBeEqual } from "./asserts";
-import { closeKeyboard, waitAndTap, waitForElementById } from "./helpers";
+import {
+  closeKeyboard,
+  waitAndTap,
+  waitForElementById,
+  waitForExpect,
+} from "./helpers";
 import setDemoMode from "./utils/setDemoMode";
 
 describe("Example", () => {

e2e/kit/002-aware-scroll-view.e2e.ts

@@ -1,12 +1,11 @@
-import waitForExpect from "wait-for-expect";
-
 import { expectBitmapsToBeEqual } from "./asserts";
 import {
   tap,
   typeText,
   waitAndReplace,
   waitAndTap,
   waitAndType,
+  waitForExpect,
 } from "./helpers";
 import setDemoMode from "./utils/setDemoMode";
 

e2e/kit/003-enabled-disabled.e2e.ts

@@ -1,11 +1,10 @@
-import waitForExpect from "wait-for-expect";
-
 import { expectBitmapsToBeEqual } from "./asserts";
 import {
   closeKeyboard,
   scrollDownUntilElementIsVisible,
   waitAndTap,
   waitForElementById,
+  waitForExpect,
 } from "./helpers";
 import setDemoMode from "./utils/setDemoMode";
 

e2e/kit/005-keyboard-toolbar.e2e.ts

@@ -9,6 +9,7 @@ import {
   scrollDownUntilElementIsVisible,
   waitAndTap,
   waitForElementById,
+  waitForExpect,
 } from "./helpers";
 import setDemoMode from "./utils/setDemoMode";
 
@@ -95,6 +96,8 @@ describe("`KeyboardToolbar` specification", () => {
 
   it("should close keyboard when press `Done`", async () => {
     await waitAndTap("keyboard.toolbar.done");
-    await expectBitmapsToBeEqual("ToolbarKeyboardClosed");
+    await waitForExpect(async () => {
+      await expectBitmapsToBeEqual("ToolbarKeyboardClosed");
+    });
   });
 });

e2e/kit/asserts/index.ts

@@ -102,7 +102,9 @@ function verifyBitmapsToBeEqual(
   );
 
   console.debug(
-    colors.green(`Screenshot '${screenName}' has ${percentDiff}% pixel diff!`),
+    colors.green(
+      `Screenshot '${screenName}' has ${percentDiff}% pixel diff! Acceptable is ${acceptableDiffPercent}%.`,
+    ),
   );
 
   if (!matched) {

e2e/kit/helpers/actions/index.ts

@@ -101,6 +101,7 @@ export const scrollDownUntilElementIsVisible = async (
   scrollViewId: string,
   elementId: string,
 ): Promise<void> => {
+  await waitForElementById(scrollViewId, TIMEOUT_FOR_LONG_OPERATIONS);
   await waitFor(element(by.id(elementId)))
     .toBeVisible()
     .whileElement(by.id(scrollViewId))

e2e/kit/helpers/awaitable/index.ts

@@ -1,3 +1,4 @@
+import retry from "async-retry";
 import colors from "colors/safe";
 
 const DEFAULT_TIMEOUT = 15000;
@@ -52,3 +53,13 @@ export const doActionNTimes = async (
     await action();
   }
 };
+
+const options = {
+  retries: 3,
+  minTimeout: 2000,
+  maxTimeout: 7000,
+};
+
+export const waitForExpect = async (expectation: () => Promise<void>) => {
+  await retry(expectation, options);
+};

e2e/kit/utils/setDemoMode.ts

@@ -24,7 +24,7 @@ export default async function setDemoMode(): Promise<void> {
     );
   } else {
     await device.setStatusBar({
-      time: "12:00",
+      time: "09:41",
       dataNetwork: "wifi",
       wifiMode: "active",
       wifiBars: "3",

e2e/package.json

@@ -25,14 +25,15 @@
   },
   "homepage": "https://github.com/kirillzyusko/react-native-keyboard-controller#readme",
   "devDependencies": {
+    "@types/async-retry": "^1.4.8",
     "@types/pixelmatch": "^5.2.4",
     "@types/pngjs": "^6.0.1",
+    "async-retry": "^1.3.3",
     "colors": "^1.4.0",
     "detox": "^20.19.0",
     "jest": "^29",
     "pixelmatch": "^5.3.0",
     "pngjs": "^7.0.0",
-    "ts-jest": "^29.1.1",
-    "wait-for-expect": "^3.0.2"
+    "ts-jest": "^29.1.1"
   }
 }

e2e/yarn.lock

@@ -561,6 +561,13 @@
   dependencies:
     "@sinonjs/commons" "^3.0.0"
 
+"@types/async-retry@^1.4.8":
+  version "1.4.8"
+  resolved "https://registry.yarnpkg.com/@types/async-retry/-/async-retry-1.4.8.tgz#eb32df13aceb9ba1a8a80e7fe518ff4e3fe46bb3"
+  integrity sha512-Qup/B5PWLe86yI5I3av6ePGaeQrIHNKCwbsQotD6aHQ6YkHsMUxVZkZsmx/Ry3VZQ6uysHwTjQ7666+k6UjVJA==
+  dependencies:
+    "@types/retry" "*"
+
 "@types/babel__core@^7.1.14":
   version "7.20.5"
   resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.20.5.tgz#3df15f27ba85319caa07ba08d0721889bb39c017"
@@ -641,6 +648,11 @@
   dependencies:
     "@types/node" "*"
 
+"@types/retry@*":
+  version "0.12.5"
+  resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.5.tgz#f090ff4bd8d2e5b940ff270ab39fd5ca1834a07e"
+  integrity sha512-3xSjTp3v03X/lSQLkczaN9UIEwJMoMCA1+Nb5HfbJEQWogdeQIyVtTvxPXDQjZ5zws8rFQfVfRdz03ARihPJgw==
+
 "@types/stack-utils@^2.0.0":
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-2.0.3.tgz#6209321eb2c1712a7e7466422b8cb1fc0d9dd5d8"
@@ -714,6 +726,13 @@ argparse@^1.0.7:
   dependencies:
     sprintf-js "~1.0.2"
 
+async-retry@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/async-retry/-/async-retry-1.3.3.tgz#0e7f36c04d8478e7a58bdbed80cedf977785f280"
+  integrity sha512-wfr/jstw9xNi/0teMHrRW7dsz3Lt5ARhYNZ2ewpadnhaIp5mbALhOAP+EAdsC7t4Z6wqsDVv9+W6gm1Dk9mEyw==
+  dependencies:
+    retry "0.13.1"
+
 babel-jest@^29.7.0:
   version "29.7.0"
   resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-29.7.0.tgz#f4369919225b684c56085998ac63dbd05be020d5"
@@ -2378,6 +2397,11 @@ resolve@^1.20.0:
     path-parse "^1.0.7"
     supports-preserve-symlinks-flag "^1.0.0"
 
+[email protected]:
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/retry/-/retry-0.13.1.tgz#185b1587acf67919d63b357349e03537b2484658"
+  integrity sha512-XQBQ3I8W1Cge0Seh+6gjj03LbmRFWuoszgK9ooCpwYIrhhoO80pfq4cUkU5DkknwfOfFteRwlZ56PYOGYyFWdg==
+
 retry@^0.12.0:
   version "0.12.0"
   resolved "https://registry.yarnpkg.com/retry/-/retry-0.12.0.tgz#1b42a6266a21f07421d1b0b54b7dc167b01c013b"
@@ -2710,11 +2734,6 @@ v8-to-istanbul@^9.0.1:
     "@types/istanbul-lib-coverage" "^2.0.1"
     convert-source-map "^2.0.0"
 
-wait-for-expect@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/wait-for-expect/-/wait-for-expect-3.0.2.tgz#d2f14b2f7b778c9b82144109c8fa89ceaadaa463"
-  integrity sha512-cfS1+DZxuav1aBYbaO/kE06EOS8yRw7qOFoD3XtjTkYvCvh3zUvNST8DXK/nPaeqIzIv3P3kL3lRJn8iwOiSag==
-
 walker@^1.0.8:
   version "1.0.8"
   resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.8.tgz#bd498db477afe573dc04185f011d3ab8a8d7653f"