test(e2e): deadline passed swap error state (#6444)

* chore: ignore hardhat cache files

* test: add forking hardhat config

* test: install cypress-hardhat

* build: add cypress-hardhat

* fix: lint

* build: add hardhat

* build: add @sentry/types

* fix: better origin

* test: update cypress VisitOptions to include hardhat

* fix: default to connected wallet user state

* test: add a hardhat provider

* build: update imports

* chore: comments

* fix: massage eth_sendTransaction

* feat: example swap test (#6415)

* initial commit

* add intercept for amplitude

* fix: destructure result

* click swap submission

* fix: eth_sendTransaction via bridge

* test works

* finish chain interaction test

---------
Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>

* swap should render an error when a transaction fails due to a passed deadline

* use mining utils to manage transaction confirmation

* update to use new hardhat syntax and make comments more clear

* test a very long timeout in CI

* Revert "test a very long timeout in CI"

This reverts commit 141c28e15c511f2338c2b5b2b60521a7cb4c1bda.

* fiddle with automine settings

* pr feedback

* cleanup

* bump cypress-hardhat

* use setAutomine

* use setAutomine

* remove .reset

---------
Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>

cypress/e2e/swap.test.ts

@@ -78,16 +78,58 @@ describe('Swap', () => {
       cy.get('#swap-currency-output .token-amount-input').clear().type('0.0').should('have.value', '0.0')
     })
 
-    it('should have the correct default input/output and token selection should work', () => {
-      cy.visit('/swap')
-      verifyToken('input', 'ETH')
-      verifyToken('output', null)
-
-      selectToken('WETH', 'output')
-      cy.get(getTestSelector('swap-currency-button')).first().click()
-
-      verifyToken('input', 'WETH')
-      verifyToken('output', 'ETH')
+    it('should render an error when a transaction fails due to a passed deadline', () => {
+      const DEADLINE_MINUTES = 1
+      const TEN_MINUTES_MS = 1000 * 60 * DEADLINE_MINUTES * 10
+      cy.visit('/swap', { ethereum: 'hardhat' })
+        .hardhat()
+        .then((hardhat) => {
+          cy.then(() => hardhat.setAutomine(false))
+            .then(() => hardhat.getBalance(hardhat.wallet.address, USDC_MAINNET))
+            .then((balance) => Number(balance.toFixed(1)))
+            .then((initialBalance) => {
+              // Input swap info.
+              cy.get('#swap-currency-output .open-currency-select-button').click()
+              cy.contains('USDC').click()
+              cy.get('#swap-currency-output .token-amount-input').clear().type('1')
+              cy.get('#swap-currency-input .token-amount-input').should('not.equal', '')
+
+              // Set deadline to minimum. (1 minute)
+              cy.get(getTestSelector('open-settings-dialog-button')).click()
+              cy.get(getTestSelector('deadline-input')).clear().type(DEADLINE_MINUTES.toString())
+              cy.get('body').click('topRight')
+              cy.get(getTestSelector('deadline-input')).should('not.exist')
+
+              cy.get('#swap-button').click()
+              cy.get('#confirm-swap-or-send').click()
+
+              // Dismiss the modal that appears when a transaction is broadcast to the network.
+              cy.get(getTestSelector('dismiss-tx-confirmation')).click()
+
+              // The UI should show the transaction as pending.
+              cy.contains('1 Pending').should('exist')
+
+              // Mine a block past the deadline.
+              cy.then(() => hardhat.mine(1, TEN_MINUTES_MS)).then(() => {
+                // The UI should no longer show the transaction as pending.
+                cy.contains('1 Pending').should('not.exist')
+
+                // Check that the user is informed of the failure
+                cy.contains('Swap failed').should('exist')
+
+                // Check that the balance is unchanged in the UI
+                cy.get('#swap-currency-output [data-testid="balance-text"]').should(
+                  'have.text',
+                  `Balance: ${initialBalance}`
+                )
+
+                // Check that the balance is unchanged on chain
+                cy.then(() => hardhat.getBalance(hardhat.wallet.address, USDC_MAINNET))
+                  .then((balance) => Number(balance.toFixed(1)))
+                  .should('eq', initialBalance)
+              })
+            })
+        })
     })
 
     it('should have the correct default input from URL params ', () => {

package.json

@@ -102,7 +102,7 @@
     "@vanilla-extract/webpack-plugin": "^2.1.11",
     "babel-plugin-istanbul": "^6.1.1",
     "cypress": "10.3.1",
-    "cypress-hardhat": "^2.0.0",
+    "cypress-hardhat": "^2.2.0",
     "env-cmd": "^10.1.0",
     "eslint": "^7.11.0",
     "eslint-plugin-import": "^2.27",

src/components/Settings/index.tsx

@@ -184,16 +184,17 @@ export default function SettingsTab({ placeholderSlippage }: { placeholderSlippa
         disabled={!isSupportedChainId(chainId)}
         onClick={toggle}
         id="open-settings-dialog-button"
+        data-testid="open-settings-dialog-button"
         aria-label={t`Transaction Settings`}
       >
         <StyledMenuIcon data-testid="swap-settings-button" />
-        {expertMode ? (
+        {expertMode && (
           <EmojiWrapper>
             <span role="img" aria-label="wizard-icon">
               🧙
             </span>
           </EmojiWrapper>
-        ) : null}
+        )}
       </StyledMenuButton>
       {open && (
         <MenuFlyout>

src/components/TransactionSettings/index.tsx

@@ -250,6 +250,7 @@ export default function TransactionSettings({ placeholderSlippage }: Transaction
           <RowFixed>
             <OptionCustom style={{ width: '80px' }} warning={!!deadlineError} tabIndex={-1}>
               <Input
+                data-testid="deadline-input"
                 placeholder={(DEFAULT_DEADLINE_FROM_NOW / 60).toString()}
                 value={
                   deadlineInput.length > 0

yarn.lock

@@ -9046,10 +9046,14 @@ cyclist@^1.0.1:
   resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
   integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=
 
-cypress-hardhat@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/cypress-hardhat/-/cypress-hardhat-2.0.0.tgz#98f07370270ec7c754d35f77c73b216d9f924abb"
-  integrity sha512-YLLVZa/15CBo7mmu5JuIGAPg4jLbSYTw/LR690tx90WEiIaPH9diHzWAE41wB+cvmgM7fGwhKnKEEeE1s1DWKg==
+cypress-hardhat@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/cypress-hardhat/-/cypress-hardhat-2.2.0.tgz#4e1c0f16f0c915dda54ddeccbf5dea19f80eed2f"
+  integrity sha512-Jtzd49vvyWSshR43w18WJ4b/40EhSItTTl82QYBNqiSPPrC/yj0derJHZyqMqq2LZvrsfmiY92fIBDgvxUCxZQ==
+  dependencies:
+    "@uniswap/permit2-sdk" "^1.2.0"
+    "@uniswap/sdk-core" "^3.0.1"
+    "@uniswap/universal-router-sdk" "^1.3.8"
 
 cypress@*, cypress@10.3.1:
   version "10.3.1"