TW-1454-new-setup-e2e

.github/workflows/code-quality-check/action.yml

@@ -25,9 +25,9 @@ runs:
       run: yarn ts
       shell: bash
 
-    # - name: Check E2E TypeScript
-    #   run: yarn ts:e2e
-    #   shell: bash
+    - name: Check E2E TypeScript
+      run: yarn ts:e2e
+      shell: bash
 
     - name: Find deadcode
       run: yarn find-deadcode

.github/workflows/manual-builds.yml

@@ -114,14 +114,14 @@ jobs:
         with:
           optional_modules: ${{ github.event.inputs.core != 'true' }}
 
-      - name: Upload E2E video to Slack
-        if: ${{ failure() && github.event.inputs.chromePlusE2E == 'true' }}
-        uses: adrey/slack-file-upload-action@master
-        with:
-          token: ${{ secrets.SLACK_E2E_VIDEO_UPLOADER_TOKEN }}
-          path: e2e/video-rep/test-runs.mp4
-          channel: temple-test-runs
-          initial_comment: <https://github.com/madfish-solutions/templewallet-extension/pull/${{ github.event.number }}|${{ github.event.pull_request.title }}>  (Run <https://github.com/madfish-solutions/templewallet-extension/actions/runs/${{ github.run_id }}|№${{ github.run_number }}>)
+#      - name: Upload E2E video to Slack
+#        if: ${{ failure() && github.event.inputs.chromePlusE2E == 'true' }}
+#        uses: adrey/slack-file-upload-action@master
+#        with:
+#          token: ${{ secrets.SLACK_E2E_VIDEO_UPLOADER_TOKEN }}
+#          path: e2e/video-rep/test-runs.mp4
+#          channel: temple-test-runs
+#          initial_comment: <https://github.com/madfish-solutions/templewallet-extension/pull/${{ github.event.number }}|${{ github.event.pull_request.title }}>  (Run <https://github.com/madfish-solutions/templewallet-extension/actions/runs/${{ github.run_id }}|№${{ github.run_number }}>)
 
       - name: Create Firefox build
         if: ${{ github.event.inputs.firefox == 'true' && github.event.inputs.core != 'true'}}

TODO.md

@@ -0,0 +1,92 @@
+## TODO:
+
+- Fix bouncing doc behind popup. Do before 'cut'
+- Manage Assets tab
+- Filters tab
+- Store Tezos native currency
+- `settings.customNetworks` => `customNetworks: { tezos: {}[], evm: {}[] }`
+- Unit tests for EVM accounts in the Vault
+- TempleContact. See: `useFilteredContacts()`
+- - Migrate
+- - To Redux ?
+- Warning for incorrect Chain ID value. Require action!
+- Reform `lib/temple`
+- - `lib/temple/back` -> `background`
+- -
+- Get rid of redundant `addLocalOperation` & `lib/temple/activity(-new)` -> `temple/history`
+- Rework analytics (properties) - breaking change
+- - EVM creds (chain ID, address ...)
+- - Category separation
+- Remove Vault legacy code if versions usage stats allows
+- [E2E] Picking accounts by `...setAnotherSelector('hash',` - accomodate to EVM
+- Multilanguage support
+- Gather all storage keys in a single record
+- Move deps-less callbacks out of `lib/temple/client.ts` to a module ?
+- `BG_State.defaultNetworks` to FG
+- `interface ChainAsset { chainId: string | number; slug: string; }`
+- `EMPTY_FROZEN_ARR`
+- - Read-only for Redux state
+- Build to ESNext ?
+- `StoredNetwork.id` not RPC URL
+- Clean unused i18n
+- Yarn Classic -> Yarn Modern
+-
+
+
+## DONE
+
+- Installed `viem`
+- - Had to update TS & some other deps
+- Derivation for EVM: `addressIndex` instead of `accountIndex`
+- `getTezosAccountAddressForAdsImpressions()`
+- '(Internal) Confirm' pages
+- Change of logic in `Vault.createHDAccount()`
+-
+
+
+## NOTES
+
+- Import by mnemonic
+- - Old accounts are Tezos only
+- - New will be Tezos + EVM
+- - - Make sure, they are Tezos + EVM + any other new chain
+- Watch-only accounts' addresses in ads' analytics
+- Selected account will reset to 1st after update
+- Creating account when imported exists is allowed. Reverse is not.
+-
+
+## QUESTIONS
+
+-
+- Is `nanoid()` good enough to id accounts ?
+- `bip39` -> `@scure/bip39` ?
+- `loadContract('', FALSE)` - why?
+- Networks (& contacts) stored in Vault ?
+- Block explorers
+- Adding localhost RPC
+- - What native currency?
+-
+- Robot icon
+- Toast on copy address
+- Segment Control & Toggle animations
+-
+
+## TO QA
+- Dapps connection, switching account in Confirm window & reflection in other TW pages
+- Removing account in 1 window, observing another
+- Import Tezos accounts by revealed Private Key
+- Search field in account dropdown
+-
+- Assets & metadata loading
+- Balances loading
+- - With TZKT available
+- - Without TZKT available
+-
+
+## SUB-TASKS FOR THIS EPIC
+- Import by mnemonic
+- Networks for EVM
+- Assets & Balances
+- Address Book (Contacts)
+- Analytics ?
+-

e2e/.gitignore

@@ -0,0 +1,6 @@
+# dependencies
+node_modules/
+
+.env
+
+test-results/

e2e/package.json

@@ -1,41 +1,19 @@
 {
-  "name": "temple-wallet-extension-e2e",
-  "version": "1.0.0",
+  "name": "temple-wallet-extension-e2e-tests",
+  "version": "2.0.0",
   "private": true,
   "license": "MIT",
   "scripts": {
-    "start": "./node_modules/.bin/cucumber-js --fail-fast",
-    "start:dev": "yarn start --tags @dev",
-    "start:NFT": "yarn start --tags @collectibles",
-    "start:remove_account": "yarn start --tags @remove_account",
-    "start:create_account": "yarn start --tags @create_account",
-    "start:address_book": "yarn start --tags @address_book",
-    "start:custom_node": "yarn start --tags @custom_node",
-    "start:unlock_screen": "yarn start --tags @unlock_screen",
-    "start:manage_assets": "yarn start --tags @manage_assets",
-    "start:home": "yarn start --tags @home",
-    "start:create_new_wallet": "yarn start --tags @create_new_wallet",
-    "start:delegate": "yarn start --tags @delegate",
-    "start:import_account_mnemonic": "yarn start --tags @import_account_mnemonic",
-    "start:import_account_private_key": "yarn start --tags @import_account_private_key",
-    "start:import_account_public_key": "yarn start --tags @import_account_public_key",
-    "start:import_wallet": "yarn start --tags @import_wallet",
-    "start:reveal_private_key": "yarn start --tags @reveal_private_key",
-    "start:reveal_mnemonic": "yarn start --tags @reveal_mnemonic",
-    "start:send": "yarn start --tags @send",
-    "start:swap": "yarn start --tags @swap",
-    "start:notifications": "yarn start --tags @notifications",
-    "test": "yarn start --exit --tags 'not @dev'",
+    "install": "yarn playwright install chromium",
+    "test": "yarn playwright test",
     "ts": "tsc --pretty"
   },
   "dependencies": {
-    "@cucumber/cucumber": "^9.4.0",
-    "@types/chai": "^4.3.4",
+    "@playwright/test": "^1.44.0",
     "async-retry": "^1.3.3",
-    "chai": "^4.3.7",
     "dotenv": "^16.0.3",
-    "puppeteer": "^19.11.1",
-    "puppeteer-screen-recorder": "^2.1.2",
-    "ts-node": "^10.9.1"
+    "playwright": "^1.44.0",
+    "ts-node": "^10.9.1",
+    "@types/node": "^20.12.2"
   }
 }

e2e/playwright.config.ts

@@ -0,0 +1,20 @@
+import { PlaywrightTestConfig } from '@playwright/test';
+
+const config: PlaywrightTestConfig = {
+  fullyParallel: true,
+  testDir: './src',
+  workers: 1,
+  use: {
+    screenshot: 'only-on-failure',
+    video: 'retain-on-failure',
+    trace: 'retain-on-failure'
+  },
+  projects: [
+    {
+      name: 'chromium',
+      use: { browserName: 'chromium' }
+    }
+  ]
+};
+
+export default config;

e2e/src/classes/browser-context.class.ts

@@ -1,17 +1,13 @@
-import { Browser, Page } from 'puppeteer';
-import { PuppeteerScreenRecorder } from 'puppeteer-screen-recorder';
+import { BrowserContext, Page } from '@playwright/test';
+// import { envVars } from '../utils/env.utils';
 
-import { envVars } from '../utils/env.utils';
-
-export class BrowserContext {
-  public static EXTENSION_ID: string;
-  public static browser: Browser;
+// eslint-disable-next-line @typescript-eslint/no-extraneous-class
+export class CustomBrowserContext {
+  public static EXTENSION_URL: string;
+  public static browser: BrowserContext;
   public static page: Page;
-  public static seedPhrase = envVars.DEFAULT_HD_ACCOUNT_SEED_PHRASE;
-  public static password = envVars.DEFAULT_PASSWORD;
-  public static recorder: PuppeteerScreenRecorder;
-  public static resetPrivates = () => {
-    BrowserContext.seedPhrase = envVars.DEFAULT_HD_ACCOUNT_SEED_PHRASE;
-    BrowserContext.password = envVars.DEFAULT_PASSWORD;
-  };
+  // public static resetPrivates = () => {
+  //   BrowserContext.seedPhrase = envVars.DEFAULT_HD_ACCOUNT_SEED_PHRASE;
+  //   BrowserContext.password = envVars.DEFAULT_PASSWORD;
+  // };
 }

e2e/src/classes/page.class.ts

@@ -1,10 +1,10 @@
-import { BrowserContext } from 'e2e/src/classes/browser-context.class';
+import { CustomBrowserContext } from './browser-context.class';
 
 export abstract class Page {
   abstract isVisible(timeout?: number): void;
 
   scrollTo(topPositionPx: number) {
-    return BrowserContext.page.evaluate(top => {
+    return CustomBrowserContext.page.evaluate(top => {
       if (top <= 0 && window.pageYOffset === 0) return Promise.resolve(false);
 
       window.scrollTo({ top, behavior: 'smooth' });