Tests: Cypress tests refactor to use localstorage (#2890)

* Use local storage to avoid extra test steps
* Fix load safe tests
* Skip create tx tests

cypress/e2e/pages/address_book.page.js

@@ -11,10 +11,10 @@ export const editEntryBtn = 'button[aria-label="Edit entry"]'
 export const deleteEntryBtn = 'button[aria-label="Delete entry"]'
 export const deleteEntryModalBtnSection = '.MuiDialogActions-root'
 export const delteEntryModaldeleteBtn = 'Delete'
-const exportFileModalBtnSection = '.MuiDialogActions-root'
 const exportFileModalExportBtn = 'Export'
 const importBtn = 'Import'
 const exportBtn = 'Export'
+const exportModalBtn = '[data-testid="export-modal-btn"]'
 const whatsNewBtnStr = "What's new"
 const beamrCookiesStr = 'accept the "Beamer" cookies'
 
@@ -39,11 +39,11 @@ export function verifyDataImported(name, address) {
 }
 
 export function clickOnExportFileBtn() {
-  cy.contains(exportBtn).click()
+  cy.contains(exportBtn).should('be.enabled').click()
 }
 
 export function confirmExport() {
-  cy.get(exportFileModalBtnSection).contains(exportFileModalExportBtn).click()
+  cy.get(exportModalBtn).click()
 }
 
 export function clickOnCreateEntryBtn() {

cypress/e2e/pages/create_tx.pages.js

@@ -51,7 +51,7 @@ export function clickOnSendTokensBtn() {
   cy.contains(sendTokensBtnStr).click()
 }
 
-export function clickOnTokenselectorAndSelectSepolia() {
+export function clickOnTokenselectorAndSelectSepoliaEth() {
   cy.get(tokenAddressInput).prev().click()
   cy.get('ul[role="listbox"]').contains(constants.tokenNames.sepoliaEther).click()
 }

cypress/e2e/pages/main.page.js

@@ -111,3 +111,36 @@ export function extractDigitsToArray(selector, digitsArray) {
     }
   })
 }
+
+export function isItemInLocalstorage(key, expectedValue, maxAttempts = 10, delay = 100) {
+  return new Promise((resolve, reject) => {
+    let attempts = 0
+
+    const isItemInLocalstorage = () => {
+      attempts++
+      const storedValue = JSON.parse(window.localStorage.getItem(key))
+      const keyEqualsValue = JSON.stringify(expectedValue) === JSON.stringify(storedValue)
+      if (keyEqualsValue) {
+        cy.log('Item retrieved from local storage successfully')
+        resolve()
+      } else if (attempts < maxAttempts) {
+        setTimeout(isItemInLocalstorage, delay)
+      } else {
+        cy.log('Error: Key does not equal the expected value in local storage')
+        reject(error)
+      }
+    }
+    isItemInLocalstorage()
+  })
+}
+
+export function addToLocalStorage(key, jsonValue) {
+  return new Promise((resolve, reject) => {
+    try {
+      window.localStorage.setItem(key, JSON.stringify(jsonValue))
+      resolve('Item added to local storage successfully')
+    } catch (error) {
+      reject('Error adding item to local storage: ' + error)
+    }
+  })
+}

cypress/e2e/regression/address_book.cy.js

@@ -4,6 +4,7 @@ import { format } from 'date-fns'
 import * as constants from '../../support/constants'
 import * as addressBook from '../../e2e/pages/address_book.page'
 import * as main from '../../e2e/pages/main.page'
+import * as ls from '../../support/localstorage_data.js'
 
 const NAME = 'Owner1'
 const EDITED_NAME = 'Edited Owner1'
@@ -15,14 +16,20 @@ describe('Address book tests', () => {
     main.acceptCookies()
   })
 
-  //TODO: Use localstorage for setting up/deleting entries
   it('Verify entered entry in Name input can be saved', () => {
-    addressBook.clickOnCreateEntryBtn()
-    addressBook.addEntry(NAME, constants.RECIPIENT_ADDRESS)
-    addressBook.clickOnEditEntryBtn()
-    addressBook.typeInNameInput(EDITED_NAME)
-    addressBook.clickOnSaveButton()
-    addressBook.verifyNameWasChanged(NAME, EDITED_NAME)
+    main
+      .addToLocalStorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.sepoliaAddress1)
+      .then(() => {
+        main
+          .isItemInLocalstorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.sepoliaAddress1)
+          .then(() => {
+            cy.reload()
+            addressBook.clickOnEditEntryBtn()
+            addressBook.typeInNameInput(EDITED_NAME)
+            addressBook.clickOnSaveButton()
+            addressBook.verifyNameWasChanged(NAME, EDITED_NAME)
+          })
+      })
   })
 
   //TODO: Rework to use Polygon. Replace Verify csv file can be imported (Goerli) with this test
@@ -44,22 +51,25 @@ describe('Address book tests', () => {
     cy.contains(constants.GNO_CSV_ENTRY.address).should('exist')
   })
 
-  // TODO: Rework with localstorage. Change title in Testrail. New title "...exported"
+  // TODO: Change title in Testrail. New title "...exported"
   it('Verify the address book file can be downloaded', () => {
-    addressBook.clickOnImportFileBtn()
-    addressBook.importFile()
-    // Download the export file
-    const date = format(new Date(), 'yyyy-MM-dd', { timeZone: 'UTC' })
-    const fileName = `safe-address-book-${date}.csv` //name that is given to the file automatically
+    main.addToLocalStorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.dataSet).then(() => {
+      main
+        .isItemInLocalstorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.dataSet)
+        .then(() => {
+          cy.reload()
+          cy.contains(ls.addressBookData.dataSet[11155111]['0xf405BC611F4a4c89CCB3E4d083099f9C36D966f8'])
 
-    addressBook.clickOnExportFileBtn()
-    //This is the submit button for the Export modal. It requires an actuall class or testId to differentiate
-    //from the Export button at the top of the AB table
-    addressBook.confirmExport()
+          const date = format(new Date(), 'yyyy-MM-dd', { timeZone: 'UTC' })
+          const fileName = `safe-address-book-${date}.csv`
 
-    const downloadsFolder = Cypress.config('downloadsFolder')
-    //File reading is failing in the CI. Can be tested locally
-    cy.readFile(path.join(downloadsFolder, fileName)).should('exist')
-    // TODO: Add verifications on address and chain from file, import and export files should be equal including all chains from origin
+          addressBook.clickOnExportFileBtn()
+          addressBook.confirmExport()
+
+          const downloadsFolder = Cypress.config('downloadsFolder')
+          //File reading is failing in the CI. Can be tested locally
+          cy.readFile(path.join(downloadsFolder, fileName)).should('exist')
+        })
+    })
   })
 })

cypress/e2e/regression/load_safe.cy.js

@@ -34,35 +34,6 @@ describe('Load Safe tests', () => {
     safe.selectSepolia()
   })
 
-  // TODO: Devide by positive and negative tests
-  it('Verify only valid Safe name can be accepted', () => {
-    // alias the address input label
-    cy.get('input[name="address"]').parent().prev('label').as('addressLabel')
-
-    createwallet.verifyDefaultWalletName(createwallet.defaltSepoliaPlaceholder)
-    safe.verifyIncorrectAddressErrorMessage()
-    safe.inputNameAndAddress(testSafeName, constants.SEPOLIA_TEST_SAFE_1)
-
-    // Type an invalid address
-    // cy.get('input[name="address"]').clear().type(EOA_ADDRESS)
-    // cy.get('@addressLabel').contains(INVALID_ADDRESS_ERROR_MSG)
-
-    // Type a ENS name
-    // TODO: register a goerli ENS name for the test Safe
-    // cy.get('input[name="address"]').clear().type(SAFE_ENS_NAME)
-    // giving time to the ENS name to be translated
-    // cy.get('input[name="address"]', { timeout: 10000 }).should('have.value', `rin:${SAFE_ENS_NAME_TRANSLATED}`)
-
-    // Uploading a QR code
-    // TODO: fix this
-    // cy.findByTestId('QrCodeIcon').click()
-    // cy.contains('Upload an image').click()
-    // cy.get('[type="file"]').attachFile('../fixtures/goerli_safe_QR.png')
-
-    safe.verifyAddressInputValue()
-    safe.clickOnNextBtn()
-  })
-
   it('Verify custom name in the first owner can be set', () => {
     safe.inputNameAndAddress(testSafeName, constants.SEPOLIA_TEST_SAFE_1)
     safe.clickOnNextBtn()

cypress/e2e/smoke/address_book.cy.js

@@ -2,6 +2,7 @@ import 'cypress-file-upload'
 import * as constants from '../../support/constants'
 import * as addressBook from '../../e2e/pages/address_book.page'
 import * as main from '../../e2e/pages/main.page'
+import * as ls from '../../support/localstorage_data.js'
 
 const NAME = 'Owner1'
 const EDITED_NAME = 'Edited Owner1'
@@ -19,14 +20,19 @@ describe('[SMOKE] Address book tests', () => {
     addressBook.addEntry(NAME, constants.RECIPIENT_ADDRESS)
   })
 
-  //TODO: Use localstorage for setting up/deleting entries
   it('[SMOKE] Verify entry can be deleted', () => {
-    addressBook.clickOnCreateEntryBtn()
-    addressBook.addEntry(NAME, constants.RECIPIENT_ADDRESS)
-    // Click the delete button in the first entry
-    addressBook.clickDeleteEntryButton()
-    addressBook.clickDeleteEntryModalDeleteButton()
-    addressBook.verifyEditedNameNotExists(EDITED_NAME)
+    main
+      .addToLocalStorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.sepoliaAddress1)
+      .then(() => {
+        main
+          .isItemInLocalstorage(constants.localStorageKeys.SAFE_v2__addressBook, ls.addressBookData.sepoliaAddress1)
+          .then(() => {
+            cy.reload()
+            addressBook.clickDeleteEntryButton()
+            addressBook.clickDeleteEntryModalDeleteButton()
+            addressBook.verifyEditedNameNotExists(EDITED_NAME)
+          })
+      })
   })
 
   it('[SMOKE] Verify csv file can be imported', () => {

cypress/e2e/smoke/batch_tx.cy.js

@@ -2,6 +2,7 @@ import * as batch from '../pages/batches.pages'
 import * as constants from '../../support/constants'
 import * as main from '../../e2e/pages/main.page'
 import * as owner from '../../e2e/pages/owners.pages.js'
+import * as ls from '../../support/localstorage_data.js'
 
 const currentNonce = 3
 const funds_first_tx = '0.001'
@@ -23,35 +24,36 @@ describe('[SMOKE] Batch transaction tests', () => {
   it('[SMOKE] Verify a transaction can be added to the batch', () => {
     batch.addNewTransactionToBatch(constants.EOA, currentNonce, funds_first_tx)
     cy.contains(batch.transactionAddedToBatchStr).should('be.visible')
-    //The batch button in the header shows the transaction count
     batch.verifyBatchIconCount(1)
     batch.clickOnBatchCounter()
     batch.verifyAmountTransactionsInBatch(1)
   })
 
   it('[SMOKE] Verify the batch can be confirmed and related transactions exist in the form', () => {
-    batch.addNewTransactionToBatch(constants.EOA, currentNonce, funds_first_tx)
-    cy.wait(1000)
-    batch.addNewTransactionToBatch(constants.EOA, currentNonce, funds_first_tx)
-    batch.clickOnBatchCounter()
-    batch.clickOnConfirmBatchBtn()
-    batch.clickOnBatchCounter()
-    batch.clickOnConfirmBatchBtn()
-    batch.verifyBatchTransactionsCount(2)
-    batch.clickOnBatchCounter()
-    cy.contains(funds_first_tx).parents('ul').as('TransactionList')
-    cy.get('@TransactionList').find('li').eq(0).find('span').eq(0).contains(funds_first_tx)
-    cy.get('@TransactionList').find('li').eq(1).find('span').eq(0).contains(funds_first_tx)
+    main.addToLocalStorage(constants.localStorageKeys.SAFE_v2__batch, ls.batchData.entry0).then(() => {
+      main.isItemInLocalstorage(constants.localStorageKeys.SAFE_v2__batch, ls.batchData.entry0).then(() => {
+        cy.reload()
+        batch.clickOnBatchCounter()
+        batch.clickOnConfirmBatchBtn()
+        batch.verifyBatchTransactionsCount(2)
+        batch.clickOnBatchCounter()
+        cy.contains(funds_first_tx).parents('ul').as('TransactionList')
+        cy.get('@TransactionList').find('li').eq(0).find('span').eq(0).contains(funds_first_tx)
+        cy.get('@TransactionList').find('li').eq(1).find('span').eq(0).contains(funds_first_tx)
+      })
+    })
   })
 
   it('[SMOKE] Verify a transaction can be removed from the batch', () => {
-    batch.addNewTransactionToBatch(constants.EOA, currentNonce, funds_first_tx)
-    cy.wait(1000)
-    batch.addNewTransactionToBatch(constants.EOA, currentNonce, funds_first_tx)
-    batch.clickOnBatchCounter()
-    cy.contains(batch.batchedTransactionsStr).should('be.visible').parents('aside').find('ul > li').as('BatchList')
-    cy.get('@BatchList').find(batch.deleteTransactionbtn).eq(0).click()
-    cy.get('@BatchList').should('have.length', 1)
-    cy.get('@BatchList').contains(funds_second_tx).should('not.exist')
+    main.addToLocalStorage(constants.localStorageKeys.SAFE_v2__batch, ls.batchData.entry0).then(() => {
+      main.isItemInLocalstorage(constants.localStorageKeys.SAFE_v2__batch, ls.batchData.entry0).then(() => {
+        cy.reload()
+        batch.clickOnBatchCounter()
+        cy.contains(batch.batchedTransactionsStr).should('be.visible').parents('aside').find('ul > li').as('BatchList')
+        cy.get('@BatchList').find(batch.deleteTransactionbtn).eq(0).click()
+        cy.get('@BatchList').should('have.length', 1)
+        cy.get('@BatchList').contains(funds_second_tx).should('not.exist')
+      })
+    })
   })
 })

cypress/e2e/smoke/create_tx.cy.js

@@ -12,18 +12,19 @@ describe('[SMOKE] Create transactions tests', () => {
     main.acceptCookies()
   })
 
+  // TODO: Change title to: Verify a new send token transaction can be initiated
   it('[SMOKE] Verify a new send token transaction can be created', () => {
     createtx.clickOnNewtransactionBtn()
     createtx.clickOnSendTokensBtn()
     createtx.typeRecipientAddress(constants.EOA)
-    createtx.clickOnTokenselectorAndSelectSepolia()
+    createtx.clickOnTokenselectorAndSelectSepoliaEth()
     createtx.setMaxAmount()
     createtx.verifyMaxAmount(constants.tokenNames.sepoliaEther, constants.tokenAbbreviation.sep)
     createtx.setSendValue(sendValue)
     createtx.clickOnNextBtn()
   })
 
-  it('[SMOKE] Verify a transaction can be reviewed, edited and submitted', () => {
+  it.skip('[SMOKE] Verify a transaction can be reviewed, edited and submitted', () => {
     createtx.verifySubmitBtnIsEnabled()
     cy.wait(1000)
     createtx.verifyNativeTokenTransfer()
@@ -36,7 +37,7 @@ describe('[SMOKE] Create transactions tests', () => {
     createtx.clickOnSignTransactionBtn()
   })
 
-  it('[SMOKE] Verify that clicking on notification shows the transaction in queue', () => {
+  it.skip('[SMOKE] Verify that clicking on notification shows the transaction in queue', () => {
     createtx.waitForProposeRequest()
     createtx.clickViewTransaction()
     createtx.verifySingleTxPage()

cypress/e2e/smoke/load_safe.cy.js

@@ -52,10 +52,10 @@ describe('[SMOKE] Load Safe tests', () => {
     safe.verifyNameLengthErrorMessage()
   })
 
-  it('Verify ENS name is translated to a valid address', () => {
-    cy.visit(constants.loadNewSafeEthUrl)
-    safe.inputAddress(constants.ENS_TEST_ETH)
-    safe.verifyAddressInputValue(constants.ETH_ENS_SAFE_ADDRESS_1)
+  it.skip('Verify ENS name is translated to a valid address', () => {
+    // cy.visit(constants.loadNewSafeEthUrl)
+    safe.inputAddress(constants.ENS_TEST_SEPOLIA)
+    safe.verifyAddressInputValue(constants.ENS_TEST_SEPOLIA)
     safe.verifyNextButtonStatus('be.enabled')
     safe.clickOnNextBtn()
   })
@@ -72,22 +72,6 @@ describe('[SMOKE] Load Safe tests', () => {
     safe.verifyQRCodeErrorMsg()
   })
 
-  it('Verify custom name in the first owner an be set', () => {
-    safe.inputNameAndAddress(testSafeName, constants.SEPOLIA_TEST_SAFE_1)
-    safe.clickOnNextBtn()
-    createwallet.typeOwnerName(testOwnerName, 0)
-    safe.clickOnNextBtn()
-  })
-
-  it('Verify Safe and owner names are displayed in the Review step', () => {
-    safe.inputNameAndAddress(testSafeName, constants.SEPOLIA_TEST_SAFE_1)
-    safe.clickOnNextBtn()
-    createwallet.typeOwnerName(testOwnerName, 0)
-    safe.clickOnNextBtn()
-    safe.verifyDataInReviewSection(testSafeName, testOwnerName)
-    safe.clickOnAddBtn()
-  })
-
   it('[SMOKE] Verify the custom Safe name is successfully loaded', () => {
     safe.inputNameAndAddress(testSafeName, constants.SEPOLIA_TEST_SAFE_2)
     safe.clickOnNextBtn()