[QA-36] E2E - Add other EVM chains

.github/workflows/cypress.yml

@@ -110,7 +110,7 @@ jobs:
         run: |+
           #!/bin/bash
           yarn preview &
-          yarn test-e2e
+          yarn test-e2e -e grepTags=smoke,NETWORK=Ethereum
         env:
             DISPLAY: :0.0
 

.github/workflows/schedule.yml

@@ -8,6 +8,10 @@ on:
 jobs:
   build:
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        network: ['Ethereum', 'Arbitrum','Optimism', 'Avalanche', 'BNB']
     steps:
       - name: Trigger Code Checkout
         uses: actions/checkout@v3
@@ -42,7 +46,7 @@ jobs:
       - name: Run Cypress Test
         run: |+
           #!/bin/bash
-          yarn test-schedule
+           yarn test-schedule -e grepTags=regression,NETWORK=${{ matrix.network }}
         env:
             DISPLAY: :0.0
 

cypress.config.ts

@@ -2,6 +2,7 @@ import synpressPlugins from '@synthetixio/synpress/plugins'
 import { defineConfig } from 'cypress'
 
 export default defineConfig({
+  projectId: '4x4jf8',
   component: {
     devServer: {
       framework: 'create-react-app',
@@ -12,11 +13,16 @@ export default defineConfig({
   chromeWebSecurity: true,
   viewportWidth: 1920,
   viewportHeight: 1080,
+  env: {
+    grepFilterSpecs:true,
+    grepOmitFiltered:true
+  },
   e2e: {
     setupNodeEvents(on, config) {
+      // eslint-disable-next-line @typescript-eslint/no-var-requires
       require('@cypress/grep/src/plugin')(config)
       synpressPlugins(on, config)
     },
-    specPattern: 'cypress/e2e/**/*-spec.cy.ts',
+    specPattern: 'cypress/e2e/specs/*.e2e.cy.ts'
   },
 })

cypress/e2e/pages/swap-page.po.cy.ts

@@ -1,23 +1,102 @@
-export enum tag {
-  smoke = 'smoke',
-  regression = 'regression',
+import { NetworkLocators, SwapPageLocators, TokenCatalogLocators, WalletLocators } from "../selectors/selectors.cy"
+
+export interface myCallbackType<T> {
+    (myArgument: T): void
 }
 
-export function getText(selector: string, callback: any) {
-  const text = cy.get(selector).invoke('text')
-  text.then($text => {
-    callback($text)
-  })
+export const SwapPage = {
+    open(url: string) {
+        cy.visit('/' + url)
+        cy.url().should('include', url)
+        cy.closeTutorialPopup()
+    },
+
+    selectTokenIn(): TokenCatalog {
+        cy.selectTokenIn()
+        return new TokenCatalog()
+    },
+    selectTokenOut(): TokenCatalog {
+        cy.selectTokenOut()
+        return new TokenCatalog()
+    },
+
+    getCurrentTokenIn(text: myCallbackType<string>) {
+        cy.getContent(SwapPageLocators.dropdownTokenIn, text)
+    },
+
+    getCurrentTokenOut(text: myCallbackType<string>) {
+        cy.getContent(SwapPageLocators.dropdownTokenOut, text)
+    },
+
+    connectWallet() {
+        cy.get(WalletLocators.btnConnectWallet).should('be.visible').click()
+        cy.connectWallet()
+    },
+
+    getStatusConnectedWallet() {
+        cy.get(WalletLocators.statusConnected, { timeout: 10000 }).should('be.visible')
+    }
 }
 
-export function getTokenList(selector: string, callback: any) {
-  let arr: string[] = []
-  const listToken = cy.get(selector)
-  listToken
-    .each(item => {
-      arr.push(item.text())
-    })
-    .then(() => {
-      callback(arr)
-    })
+export class Network {
+    selectNetwork(network: string) {
+        cy.get(NetworkLocators.btnSelectNetwork, { timeout: 30000 }).should('be.visible').click()
+        cy.get(NetworkLocators.btnNetwork).contains(network).click({ force: true })
+    } 
 }
+
+export class TokenCatalog {
+    searchToken(value: string) {
+        cy.searchToken(value)
+    }
+
+    selectImportTab() {
+        cy.selectImportTab()
+    }
+
+    selectFavoriteToken(tokenSymbol: string) {
+        cy.selectFavoriteToken(tokenSymbol)
+    }
+
+    selectTokenBySymbol(tokenSymbol: string) {
+        this.searchToken(tokenSymbol)
+        cy.selectTokenBySymbol(tokenSymbol)
+    }
+
+    addFavoriteToken(tokenSymbol: string) {
+        this.searchToken(tokenSymbol)
+        cy.wait(2000)
+        cy.addFavoriteToken()
+    }
+
+    removeFavoriteToken(tokenSymbol: string) {
+        cy.removeFavoriteToken(tokenSymbol)
+    }
+
+    importNewTokens(address: Array<string>) {
+        address.forEach(element => {
+            SwapPage.selectTokenIn()
+            cy.importNewToken(element)
+        })
+    }
+
+    deleteImportedToken(value: string) {
+        cy.deleteImportedToken(value)
+    }
+
+    clearAllImportedTokens() {
+        cy.clearAllImportedTokens()
+    }
+
+    getFavoriteTokens(list: myCallbackType<string[]>) {
+        cy.getList(TokenCatalogLocators.lblFavoriteToken, list)
+    }
+
+    getWhitelistTokens(list: myCallbackType<string[]>) {
+        cy.getList(TokenCatalogLocators.lblRowInWhiteList, list)
+    }
+
+    getNoResultsFound(text: myCallbackType<string>) {
+        cy.getContent(TokenCatalogLocators.lblNotFound, text)
+    }
+}

cypress/e2e/selectors/constants.cy.ts

@@ -0,0 +1,93 @@
+export const unListedToken = ['KNNC', 'KCCN']
+export const noResultsText = "No results found."
+export const noTokensText = "Select a token"
+
+export enum TAG {
+    smoke = 'smoke',
+    regression = 'regression',
+}
+
+export const TOKEN_SYMBOLS = {
+    'Ethereum': ['BAND', 'DAI', 'USDT', 'USDC'],
+    'Arbitrum': ['ANGLE', 'DAI', 'USDT', 'USDC.e'],
+    'Optimism': ['BOB', 'DAI', 'USDT', 'USDC'],
+    'Avalanche': ['AAVE.e', 'sAVAX', 'USDT.e', 'USDC.e'],
+    'BNB': ['RICE', 'DAI', 'USDT', 'USDC']
+}
+
+export const UNWHITE_LIST_TOKENS = {
+    "Ethereum":
+        [
+            {
+                name: 'SCOOBY',
+                address: '0xAd497eE6a70aCcC3Cbb5eB874e60d87593B86F2F',
+            },
+            {
+                name: 'UNIBOT',
+                address: '0x25127685dc35d4dc96c7feac7370749d004c5040',
+            },
+            {
+                name: 'BGB',
+                address: '0x19de6b897ed14a376dda0fe53a5420d2ac828a28',
+            },
+        ],
+    "Arbitrum": [
+        {
+            name: 'OHM',
+            address: '0xf0cb2dc0db5e6c66b9a70ac27b06b878da017028',
+        },
+        {
+            name: 'GBL',
+            address: '0xe9a264e9d45ff72e1b4a85d77643cdbd4c950207',
+        },
+        {
+            name: 'Y2K',
+            address: '0x65c936f008bc34fe819bce9fa5afd9dc2d49977f',
+        },
+    ],
+    "Optimism":
+        [
+            {
+                name: 'CHI',
+                address: '0xca0e54b636db823847b29f506bffee743f57729d',
+            },
+            {
+                name: 'ACX',
+                address: '0xFf733b2A3557a7ed6697007ab5D11B79FdD1b76B',
+            },
+            {
+                name: 'PSP',
+                address: '0xd3594e879b358f430e20f82bea61e83562d49d48',
+            },
+        ],
+    "Avalanche":
+        [
+            {
+                name: 'RADIO',
+                address: '0x02bfd11499847003de5f0f5aa081c43854d48815',
+            },
+            {
+                name: 'EUROC',
+                address: '0xc891eb4cbdeff6e073e859e987815ed1505c2acd',
+            },
+            {
+                name: 'MELD',
+                address: '0x333000333b26ee30214b4af6419d9ab07a450400',
+            },
+        ],
+    "BNB":
+        [
+            {
+                name: 'TUSD',
+                address: '0x40af3827f39d0eacbf4a168f8d4ee67c121d11c9',
+            },
+            {
+                name: 'ARA',
+                address: '0x5542958fa9bd89c96cb86d1a6cb7a3e644a3d46e',
+            },
+            {
+                name: 'FLASH',
+                address: '0xc3111096b3b46873393055dea14036ea603cfa95',
+            }
+        ],
+}

cypress/e2e/selectors/selectors.cy.ts

@@ -1,45 +1,41 @@
-export const token = {
-  tokenIn: '[data-testid=swap-currency-input] [data-testid=token-symbol-container]',
-  tokenOut: '[data-testid=swap-currency-output] [data-testid=token-symbol-container]',
-  inputToken: '[data-testid=token-search-input]',
-  favoriteToken: '[data-testid=favorite-token]',
-  iconRemoveToken: '[data-testid=close-btn]',
-  rowInWhiteList: '[data-testid=token-item]',
+export const TokenCatalogLocators = {
+  dropdownTokenIn: '[data-testid=swap-currency-input] [data-testid=token-symbol-container]',
+  dropdownTokenOut: '[data-testid=swap-currency-output] [data-testid=token-symbol-container]',
+  txtToken: '[data-testid=token-search-input]',
+  lblFavoriteToken: '[data-testid=favorite-token]',
+  lblRowInWhiteList: '[data-testid=token-item]',
+  lblNotFound: '[data-testid=no-token-result]',
   iconFavorite: '[data-testid=button-favorite-token]',
-  iconDelete: '[data-testid=button-remove-import-token]',
+  iconRemoveImportedToken: '[data-testid=button-remove-import-token]',
+  iconRemoveFavoriteToken: '[data-testid=close-btn]',
   btnImport: '[data-testid=button-import-token]',
   btnUnderstand: '[data-testid=button-confirm-import-token]',
-  clearAll: '[data-testid=button-clear-all-import-token]',
+  btnClearAll: '[data-testid=button-clear-all-import-token]',
+  btnAllTab: '[data-testid=tab-all]',
+  btnImportTab: '[data-testid=tab-import]'
 }
 
-export const homePage = {
-  skipTutorial: '[data-testid=button-skip-tutorial]',
+export const SwapPageLocators = {
+  dropdownTokenIn: '[data-testid=swap-currency-input] [data-testid=token-symbol-container]',
+  dropdownTokenOut: '[data-testid=swap-currency-output] [data-testid=token-symbol-container]',
+  btnSkipTutorial: '[data-testid=button-skip-tutorial]',
 }
 
-export const notification = {
-  notFound: '[data-testid=no-token-result]',
-}
-
-export const tab = {
-  allTab: '[data-testid=tab-all]',
-  import: '[data-testid=tab-import]',
-}
-
-export const wallet = {
+export const WalletLocators = {
   btnConnectWallet: '[data-testid=button-connect-wallet]',
   btnMetaMask: '[data-testid=connect-METAMASK]',
-  checkboxAcceptTerm: '[data-testid=accept-term]',
+  chkAcceptTerm: '[data-testid=accept-term]',
   statusConnected: '[data-testid=web3-status-connected]',
 }
 
-export const network = {
+export const NetworkLocators = {
   btnSelectNetwork: '[data-testid=select-network]',
   btnNetwork: '[data-testid=network-button]',
 }
 
-export const menu = {
-  earnMenu: '[data-testid=earn-menu]',
-  poolMenu: '[data-testid=pools-nav-link]',
-  myPoolMenu: '[data-testid=my-pools-nav-link]',
-  farmMenu: '[data-testid=farms-nav-link]',
+export const HeaderLocators = {
+  dropdownEarn: '[data-testid=earn-menu]',
+  lblPools: '[data-testid=pools-nav-link]',
+  lblMyPools: '[data-testid=my-pools-nav-link]',
+  lblFarms: '[data-testid=farms-nav-link]',
 }