Fixes #3425: Better support for batch transactions (#5437)

2 files changed, 142 insertions, 5 deletions

diff --git a/test/e2e/beta/from-import-beta-ui.spec.js b/test/e2e/beta/from-import-beta-ui.spec.js
index d2c3f8958..77a61a73e 100644
--- a/test/e2e/beta/from-import-beta-ui.spec.js
+++ b/test/e2e/beta/from-import-beta-ui.spec.js
@@ -159,6 +159,7 @@ describe('Using MetaMask with an existing account', function () {
 
     it('clicks through the ToS', async () => {
       // terms of use
+      await delay(largeDelayMs)
       const canClickThrough = await driver.findElement(By.css('.tou button')).isEnabled()
       assert.equal(canClickThrough, false, 'disabled continue button')
       const bottomOfTos = await findElement(driver, By.linkText('Attributions'))
diff --git a/test/e2e/beta/metamask-beta-ui.spec.js b/test/e2e/beta/metamask-beta-ui.spec.js
index 3bfa1eaf2..2b5c8ee18 100644
--- a/test/e2e/beta/metamask-beta-ui.spec.js
+++ b/test/e2e/beta/metamask-beta-ui.spec.js
@@ -484,6 +484,142 @@ describe('MetaMask', function () {
     })
   })
 
+  describe('Navigate transactions', () => {
+    it('adds multiple transactions', async () => {
+      await delay(regularDelayMs)
+
+      await waitUntilXWindowHandles(driver, 2)
+      const windowHandles = await driver.getAllWindowHandles()
+      const extension = windowHandles[0]
+      const dapp = windowHandles[1]
+
+      await driver.switchTo().window(dapp)
+      await delay(regularDelayMs)
+
+      const send3eth = await findElement(driver, By.xpath(`//button[contains(text(), 'Send')]`), 10000)
+      await send3eth.click()
+      await delay(regularDelayMs)
+
+      const contractDeployment = await findElement(driver, By.xpath(`//button[contains(text(), 'Deploy Contract')]`), 10000)
+      await contractDeployment.click()
+      await delay(regularDelayMs)
+
+      await send3eth.click()
+      await contractDeployment.click()
+      await delay(regularDelayMs)
+
+      await driver.switchTo().window(extension)
+      await delay(regularDelayMs)
+
+      const transactions = await findElements(driver, By.css('.transaction-list-item'))
+      await transactions[3].click()
+      await delay(regularDelayMs)
+    })
+
+    it('navigates the transactions', async () => {
+      let navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      assert.equal(navigateTxButtons.length, 4, 'navigation button present')
+
+      await navigateTxButtons[2].click()
+      let navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      let navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('2'), true, 'changed transaction right')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[2].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('3'), true, 'changed transaction right')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[2].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('4'), true, 'changed transaction right')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[0].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('1'), true, 'navigate to first transaction')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[3].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.split('4').length, 3, 'navigate to last transaction')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[1].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('3'), true, 'changed transaction left')
+
+      navigateTxButtons = await findElements(driver, By.css('.confirm-page-container-navigation__arrow'))
+      await navigateTxButtons[1].click()
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('2'), true, 'changed transaction left')
+    })
+
+    it('adds a transaction while confirm screen is in focus', async () => {
+      let navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      let navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('2'), true, 'second transaction in focus')
+
+      const windowHandles = await driver.getAllWindowHandles()
+      const extension = windowHandles[0]
+      const dapp = windowHandles[1]
+
+      await driver.switchTo().window(dapp)
+      await delay(regularDelayMs)
+
+      const send3eth = await findElement(driver, By.xpath(`//button[contains(text(), 'Send')]`), 10000)
+      await send3eth.click()
+      await delay(regularDelayMs)
+
+      await driver.switchTo().window(extension)
+      await delay(regularDelayMs)
+
+      navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('3'), true, 'correct transaction in focus')
+    })
+
+    it('confirms a transaction', async () => {
+      const confirmButton = await findElement(driver, By.xpath(`//button[contains(text(), 'Confirm')]`), 10000)
+      await confirmButton.click()
+      await delay(regularDelayMs)
+
+      const navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      const navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('4'), true, 'transaction confirmed')
+    })
+
+    it('rejects a transaction', async () => {
+      const rejectButton = await findElement(driver, By.xpath(`//button[contains(text(), 'Reject')]`), 10000)
+      await rejectButton.click()
+      await delay(regularDelayMs)
+
+      const navigationElement = await findElement(driver, By.css('.confirm-page-container-navigation'))
+      const navigationText = await navigationElement.getText()
+      assert.equal(navigationText.includes('3'), true, 'transaction rejected')
+    })
+
+    it('rejects the rest of the transactions', async () => {
+      const rejectAllButton = await findElement(driver, By.xpath(`//a[contains(text(), 'Reject 3')]`), 10000)
+      await rejectAllButton.click()
+      await delay(regularDelayMs)
+
+      const rejectButton = await findElement(driver, By.xpath(`//button[contains(text(), 'Reject All')]`), 10000)
+      await rejectButton.click()
+      await delay(largeDelayMs * 2)
+
+      const confirmedTxes = await findElements(driver, By.css('.transaction-list__completed-transactions .transaction-list-item'))
+      assert.equal(confirmedTxes.length, 3, '3 transactions present')
+    })
+  })
+
   describe('Deploy contract and call contract methods', () => {
     let extension
     let dapp
@@ -531,7 +667,7 @@ describe('MetaMask', function () {
 
       driver.wait(async () => {
         const confirmedTxes = await findElements(driver, By.css('.transaction-list__completed-transactions .transaction-list-item'))
-        return confirmedTxes.length === 3
+        return confirmedTxes.length === 4
       }, 10000)
 
       const txAction = await findElements(driver, By.css('.transaction-list-item__action'))
@@ -588,7 +724,7 @@ describe('MetaMask', function () {
 
       driver.wait(async () => {
         const confirmedTxes = await findElements(driver, By.css('.transaction-list__completed-transactions .transaction-list-item'))
-        return confirmedTxes.length === 4
+        return confirmedTxes.length === 5
       }, 10000)
 
       const txValues = await findElements(driver, By.css('.transaction-list-item__amount--primary'))
@@ -620,7 +756,7 @@ describe('MetaMask', function () {
 
       driver.wait(async () => {
         const confirmedTxes = await findElements(driver, By.css('.transaction-list__completed-transactions .transaction-list-item'))
-        return confirmedTxes.length === 5
+        return confirmedTxes.length === 6
       }, 10000)
 
       const txValues = await findElement(driver, By.css('.transaction-list-item__amount--primary'))
@@ -634,9 +770,9 @@ describe('MetaMask', function () {
       const balance = await findElement(driver, By.css('.transaction-view-balance__primary-balance'))
       await delay(regularDelayMs)
       if (process.env.SELENIUM_BROWSER !== 'firefox') {
-        await driver.wait(until.elementTextMatches(balance, /^92.*\s*ETH.*$/), 10000)
+        await driver.wait(until.elementTextMatches(balance, /^89.*\s*ETH.*$/), 10000)
         const tokenAmount = await balance.getText()
-        assert.ok(/^92.*\s*ETH.*$/.test(tokenAmount))
+        assert.ok(/^89.*\s*ETH.*$/.test(tokenAmount))
         await delay(regularDelayMs)
       }
     })