adding a new wait condition, adding back a test, and cleaning up conf…

…ig (#835)

e2e/helpers.ts

@@ -2,22 +2,15 @@
 /* eslint-disable no-promise-executor-return */
 /* eslint-disable @typescript-eslint/no-var-requires */
 import { ethers } from 'ethers';
-import {
-  Builder,
-  By,
-  Locator,
-  WebDriver,
-  WebElementCondition,
-  until,
-} from 'selenium-webdriver';
+import { Builder, By, Condition, WebDriver, until } from 'selenium-webdriver';
 import chrome from 'selenium-webdriver/chrome';
 import firefox from 'selenium-webdriver/firefox';
 import { expect } from 'vitest';
 import { erc20ABI } from 'wagmi';
 
 // consts
 
-const waitUntilTime = 20000;
+const waitUntilTime = 20_000;
 const testPassword = 'test1234';
 const BINARY_PATHS = {
   mac: {
@@ -48,16 +41,19 @@ export const byText = (text: string) =>
 
 export async function goToTestApp(driver) {
   await driver.get('https://bx-test-dapp.vercel.app/');
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   await delayTime('very-long');
 }
 
 export async function goToPopup(driver, rootURL, route = '') {
   await driver.get(rootURL + '/popup.html' + route);
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   await delayTime('very-long');
 }
 
 export async function goToWelcome(driver, rootURL) {
   await driver.get(rootURL + '/popup.html#/welcome');
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   await delayTime('very-long');
 }
 
@@ -151,6 +147,7 @@ export async function getExtensionIdByName(driver, extensionName) {
 // search functions
 
 export async function querySelector(driver, selector) {
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   const el = await driver.wait(
     until.elementLocated(By.css(selector)),
     waitUntilTime,
@@ -159,6 +156,7 @@ export async function querySelector(driver, selector) {
 }
 
 export async function findElementByText(driver, text) {
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   const el = await driver.wait(
     until.elementLocated(By.xpath("//*[contains(text(),'" + text + "')]")),
     waitUntilTime,
@@ -172,6 +170,7 @@ export async function findElementByTextAndClick(driver, text) {
 }
 
 export async function findElementAndClick({ id, driver }) {
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   await delayTime('short');
   const element = await driver.findElement({
     id,
@@ -202,7 +201,7 @@ export async function findElementByTestIdAndClick({ id, driver }) {
 }
 
 export async function findElementByTestIdAndDoubleClick({ id, driver }) {
-  await delayTime('medium');
+  await delayTime('short');
   const actions = driver.actions();
   const element = await findElementByTestId({ id, driver });
   return await actions.doubleClick(element).perform();
@@ -218,19 +217,21 @@ export async function waitUntilElementByTestIdIsPresent({ id, driver }) {
 }
 
 export async function findElementByIdAndClick({ id, driver }) {
+  await driver.wait(untilDocumentLoaded(), waitUntilTime);
   await delayTime('short');
   const element = await findElementById({ id, driver });
   await waitAndClick(element, driver);
 }
 export async function waitAndClick(element, driver) {
   try {
+    await driver.wait(untilDocumentLoaded(), waitUntilTime);
     await delayTime('short');
     await driver.wait(until.elementIsVisible(element), waitUntilTime);
     await driver.wait(until.elementIsEnabled(element), waitUntilTime);
     return element.click();
   } catch (error) {
     throw new Error(
-      `Failed to click element ${await element.getAttribute('testid')}`,
+      `Failed to click element ${await element.getAttribute('data-testid')}`,
     );
   }
 }
@@ -255,15 +256,6 @@ export async function getTextFromDappText({ id, driver }) {
   return await element.getText();
 }
 
-export const untilIsClickable = (locator: Locator) =>
-  new WebElementCondition('until element is clickable', async (driver) => {
-    const element = driver.findElement(locator);
-    const isDisplayed = await element.isDisplayed();
-    const isEnabled = await element.isEnabled();
-    if (isDisplayed && isEnabled) return element;
-    return null;
-  });
-
 // various functions and flows
 
 export async function goBackTwice(driver) {
@@ -464,7 +456,6 @@ export async function passSecretQuiz(driver) {
     id: 'saved-these-words-button',
     driver,
   });
-
   await delayTime('long');
 
   for (const word of requiredWords) {
@@ -474,27 +465,6 @@ export async function passSecretQuiz(driver) {
   await delayTime('long');
 }
 
-// delays
-
-export async function delay(ms) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
-}
-
-export async function delayTime(
-  time: 'short' | 'medium' | 'long' | 'very-long',
-) {
-  switch (time) {
-    case 'short':
-      return await delay(200);
-    case 'medium':
-      return await delay(500);
-    case 'long':
-      return await delay(1000);
-    case 'very-long':
-      return await delay(5000);
-  }
-}
-
 export async function awaitTextChange(
   id: string,
   text: string,
@@ -515,3 +485,42 @@ export async function awaitTextChange(
     throw error;
   }
 }
+
+// custom conditions
+
+export const untilDocumentLoaded = async function () {
+  return new Condition('for document to load', async (driver) => {
+    return await driver.wait(async () => {
+      const documentReadyState = await driver.executeScript(
+        'return document.readyState',
+      );
+
+      if (documentReadyState === 'complete') {
+        return true;
+      }
+
+      return false;
+    }, waitUntilTime);
+  });
+};
+
+// delays
+
+export async function delay(ms) {
+  return new Promise((resolve) => setTimeout(resolve, ms));
+}
+
+export async function delayTime(
+  time: 'short' | 'medium' | 'long' | 'very-long',
+) {
+  switch (time) {
+    case 'short':
+      return await delay(200);
+    case 'medium':
+      return await delay(500);
+    case 'long':
+      return await delay(1000);
+    case 'very-long':
+      return await delay(5000);
+  }
+}