make integration tests pass more reliably, some reducer refactoring

cypress/integration/lists.test.ts

@@ -1,6 +1,5 @@
 describe('Swap', () => {
   beforeEach(() => {
-    cy.clearLocalStorage()
     cy.visit('/swap')
   })
 
@@ -13,8 +12,7 @@ describe('Swap', () => {
     cy.get('#list-introduction-choose-a-list').should('not.exist')
   })
 
-  // for some reason local storage is not being properly cleared
-  it.skip('change list', () => {
+  it('change list', () => {
     cy.get('#swap-currency-output .open-currency-select-button').click()
     cy.get('#list-introduction-choose-a-list').click()
     cy.get('#list-row-tokens-uniswap-eth .select-button').click()

cypress/integration/swap.test.ts

@@ -1,6 +1,5 @@
 describe('Swap', () => {
   beforeEach(() => {
-    cy.clearLocalStorage()
     cy.visit('/swap')
   })
   it('can enter an amount into input', () => {
@@ -59,6 +58,7 @@ describe('Swap', () => {
       cy.get('#toggle-expert-mode-button').click()
       cy.get('#confirm-expert-mode').click()
     })
+
     it('add a recipient is visible', () => {
       cy.get('#add-recipient-button').should('be.visible')
     })

cypress/integration/token-warning.ts

@@ -1,11 +1,12 @@
 describe('Warning', () => {
   beforeEach(() => {
-    cy.clearLocalStorage()
     cy.visit('/swap?outputCurrency=0x0a40f26d74274b7f22b28556a27b35d97ce08e0a')
   })
+
   it('Check that warning is displayed', () => {
     cy.get('.token-warning-container').should('be.visible')
   })
+
   it('Check that warning hides after button dismissal', () => {
     cy.get('.token-dismiss-button').should('be.disabled')
     cy.get('.understand-checkbox').click()

cypress/support/commands.js

@@ -73,6 +73,7 @@ Cypress.Commands.overwrite('visit', (original, url, options) => {
     ...options,
     onBeforeLoad(win) {
       options && options.onBeforeLoad && options.onBeforeLoad(win)
+      win.localStorage.clear()
       const provider = new JsonRpcProvider('https://rinkeby.infura.io/v3/4bf032f2d38a4ed6bb975b80d6340847', 4)
       const signer = new Wallet(PRIVATE_KEY_TEST_NEVER_USE, provider)
       win.ethereum = new CustomizedBridge(signer, provider)

package.json

@@ -73,7 +73,7 @@
     "react-virtualized-auto-sizer": "^1.0.2",
     "react-window": "^1.8.5",
     "rebass": "^4.0.7",
-    "redux-localstorage-simple": "^2.2.0",
+    "redux-localstorage-simple": "^2.3.1",
     "serve": "^11.3.0",
     "start-server-and-test": "^1.11.0",
     "styled-components": "^4.2.0",

src/state/application/actions.ts

@@ -18,8 +18,10 @@ export type PopupContent =
       }
     }
 
-export const updateBlockNumber = createAction<{ chainId: number; blockNumber: number }>('updateBlockNumber')
-export const toggleWalletModal = createAction<void>('toggleWalletModal')
-export const toggleSettingsMenu = createAction<void>('toggleSettingsMenu')
-export const addPopup = createAction<{ key?: string; removeAfterMs?: number | null; content: PopupContent }>('addPopup')
-export const removePopup = createAction<{ key: string }>('removePopup')
+export const updateBlockNumber = createAction<{ chainId: number; blockNumber: number }>('app/updateBlockNumber')
+export const toggleWalletModal = createAction<void>('app/toggleWalletModal')
+export const toggleSettingsMenu = createAction<void>('app/toggleSettingsMenu')
+export const addPopup = createAction<{ key?: string; removeAfterMs?: number | null; content: PopupContent }>(
+  'app/addPopup'
+)
+export const removePopup = createAction<{ key: string }>('app/removePopup')

src/state/burn/actions.ts

@@ -7,4 +7,4 @@ export enum Field {
   CURRENCY_B = 'CURRENCY_B'
 }
 
-export const typeInput = createAction<{ field: Field; typedValue: string }>('typeInputBurn')
+export const typeInput = createAction<{ field: Field; typedValue: string }>('burn/typeInputBurn')

src/state/global/actions.ts

@@ -0,0 +1,5 @@
+import { createAction } from '@reduxjs/toolkit'
+
+// fired once when the app reloads but before the app renders
+// allows any updates to be applied to store data loaded from localStorage
+export const updateVersion = createAction<void>('global/updateVersion')

src/state/index.ts

@@ -2,6 +2,7 @@ import { configureStore, getDefaultMiddleware } from '@reduxjs/toolkit'
 import { save, load } from 'redux-localstorage-simple'
 
 import application from './application/reducer'
+import { updateVersion } from './global/actions'
 import user from './user/reducer'
 import transactions from './transactions/reducer'
 import swap from './swap/reducer'
@@ -10,8 +11,6 @@ import lists from './lists/reducer'
 import burn from './burn/reducer'
 import multicall from './multicall/reducer'
 
-import { updateVersion } from './user/actions'
-
 const PERSISTED_KEYS: string[] = ['user', 'transactions', 'lists']
 
 const store = configureStore({

src/state/lists/reducer.test.ts

@@ -1,6 +1,6 @@
 import { createStore, Store } from 'redux'
 import { DEFAULT_LIST_OF_LISTS, DEFAULT_TOKEN_LIST_URL } from '../../constants/lists'
-import { updateVersion } from '../user/actions'
+import { updateVersion } from '../global/actions'
 import { fetchTokenList, acceptListUpdate, addList, removeList, selectList } from './actions'
 import reducer, { ListsState } from './reducer'
 import UNISWAP_DEFAULT_TOKEN_LIST from '@uniswap/default-token-list'

src/state/lists/reducer.ts

@@ -2,7 +2,7 @@ import { createReducer } from '@reduxjs/toolkit'
 import { getVersionUpgrade, VersionUpgrade } from '@uniswap/token-lists'
 import { TokenList } from '@uniswap/token-lists/dist/types'
 import { DEFAULT_LIST_OF_LISTS, DEFAULT_TOKEN_LIST_URL } from '../../constants/lists'
-import { updateVersion } from '../user/actions'
+import { updateVersion } from '../global/actions'
 import { acceptListUpdate, addList, fetchTokenList, removeList, selectList } from './actions'
 import UNISWAP_DEFAULT_LIST from '@uniswap/default-token-list'
 

src/state/mint/actions.ts

@@ -5,5 +5,5 @@ export enum Field {
   CURRENCY_B = 'CURRENCY_B'
 }
 
-export const typeInput = createAction<{ field: Field; typedValue: string; noLiquidity: boolean }>('typeInputMint')
-export const resetMintState = createAction<void>('resetMintState')
+export const typeInput = createAction<{ field: Field; typedValue: string; noLiquidity: boolean }>('mint/typeInputMint')
+export const resetMintState = createAction<void>('mint/resetMintState')

src/state/multicall/actions.ts

@@ -34,23 +34,23 @@ export interface ListenerOptions {
 }
 
 export const addMulticallListeners = createAction<{ chainId: number; calls: Call[]; options?: ListenerOptions }>(
-  'addMulticallListeners'
+  'multicall/addMulticallListeners'
 )
 export const removeMulticallListeners = createAction<{ chainId: number; calls: Call[]; options?: ListenerOptions }>(
-  'removeMulticallListeners'
+  'multicall/removeMulticallListeners'
 )
 export const fetchingMulticallResults = createAction<{ chainId: number; calls: Call[]; fetchingBlockNumber: number }>(
-  'fetchingMulticallResults'
+  'multicall/fetchingMulticallResults'
 )
 export const errorFetchingMulticallResults = createAction<{
   chainId: number
   calls: Call[]
   fetchingBlockNumber: number
-}>('errorFetchingMulticallResults')
+}>('multicall/errorFetchingMulticallResults')
 export const updateMulticallResults = createAction<{
   chainId: number
   blockNumber: number
   results: {
     [callKey: string]: string | null
   }
-}>('updateMulticallResults')
+}>('multicall/updateMulticallResults')

src/state/swap/actions.ts

@@ -5,14 +5,14 @@ export enum Field {
   OUTPUT = 'OUTPUT'
 }
 
-export const selectCurrency = createAction<{ field: Field; currencyId: string }>('selectCurrency')
-export const switchCurrencies = createAction<void>('switchCurrencies')
-export const typeInput = createAction<{ field: Field; typedValue: string }>('typeInput')
+export const selectCurrency = createAction<{ field: Field; currencyId: string }>('swap/selectCurrency')
+export const switchCurrencies = createAction<void>('swap/switchCurrencies')
+export const typeInput = createAction<{ field: Field; typedValue: string }>('swap/typeInput')
 export const replaceSwapState = createAction<{
   field: Field
   typedValue: string
   inputCurrencyId?: string
   outputCurrencyId?: string
   recipient: string | null
-}>('replaceSwapState')
-export const setRecipient = createAction<{ recipient: string | null }>('setRecipient')
+}>('swap/replaceSwapState')
+export const setRecipient = createAction<{ recipient: string | null }>('swap/setRecipient')

src/state/user/actions.ts

@@ -13,17 +13,16 @@ export interface SerializedPair {
   token1: SerializedToken
 }
 
-export const updateVersion = createAction<void>('updateVersion')
-export const updateMatchesDarkMode = createAction<{ matchesDarkMode: boolean }>('updateMatchesDarkMode')
-export const updateUserDarkMode = createAction<{ userDarkMode: boolean }>('updateUserDarkMode')
-export const updateUserExpertMode = createAction<{ userExpertMode: boolean }>('updateUserExpertMode')
+export const updateMatchesDarkMode = createAction<{ matchesDarkMode: boolean }>('user/updateMatchesDarkMode')
+export const updateUserDarkMode = createAction<{ userDarkMode: boolean }>('user/updateUserDarkMode')
+export const updateUserExpertMode = createAction<{ userExpertMode: boolean }>('user/updateUserExpertMode')
 export const updateUserSlippageTolerance = createAction<{ userSlippageTolerance: number }>(
-  'updateUserSlippageTolerance'
+  'user/updateUserSlippageTolerance'
 )
-export const updateUserDeadline = createAction<{ userDeadline: number }>('updateUserDeadline')
-export const addSerializedToken = createAction<{ serializedToken: SerializedToken }>('addSerializedToken')
-export const removeSerializedToken = createAction<{ chainId: number; address: string }>('removeSerializedToken')
-export const addSerializedPair = createAction<{ serializedPair: SerializedPair }>('addSerializedPair')
+export const updateUserDeadline = createAction<{ userDeadline: number }>('user/updateUserDeadline')
+export const addSerializedToken = createAction<{ serializedToken: SerializedToken }>('user/addSerializedToken')
+export const removeSerializedToken = createAction<{ chainId: number; address: string }>('user/removeSerializedToken')
+export const addSerializedPair = createAction<{ serializedPair: SerializedPair }>('user/addSerializedPair')
 export const removeSerializedPair = createAction<{ chainId: number; tokenAAddress: string; tokenBAddress: string }>(
-  'removeSerializedPair'
+  'user/removeSerializedPair'
 )

src/state/user/reducer.test.ts

@@ -1,6 +1,6 @@
 import { createStore, Store } from 'redux'
 import { DEFAULT_DEADLINE_FROM_NOW, INITIAL_ALLOWED_SLIPPAGE } from '../../constants'
-import { updateVersion } from './actions'
+import { updateVersion } from '../global/actions'
 import reducer, { initialState, UserState } from './reducer'
 
 describe('swap reducer', () => {

src/state/user/reducer.ts

@@ -1,5 +1,6 @@
 import { INITIAL_ALLOWED_SLIPPAGE, DEFAULT_DEADLINE_FROM_NOW } from '../../constants'
 import { createReducer } from '@reduxjs/toolkit'
+import { updateVersion } from '../global/actions'
 import {
   addSerializedPair,
   addSerializedToken,
@@ -9,7 +10,6 @@ import {
   SerializedToken,
   updateMatchesDarkMode,
   updateUserDarkMode,
-  updateVersion,
   updateUserExpertMode,
   updateUserSlippageTolerance,
   updateUserDeadline

yarn.lock

@@ -12618,10 +12618,10 @@ [email protected]:
   dependencies:
     minimatch "3.0.4"
 
-redux-localstorage-simple@^2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/redux-localstorage-simple/-/redux-localstorage-simple-2.2.0.tgz#f60a70b0d858626d5db861b3db353ff848427f01"
-  integrity sha512-BmgnJ3NkxTDvNsnHAZrRVDgODafg2Vtb17q2F2LEhuJ+EderZBJA6aqRsyqZC32BJWpu8PPtferv4Io9dpUf3w==
+redux-localstorage-simple@^2.3.1:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/redux-localstorage-simple/-/redux-localstorage-simple-2.3.1.tgz#108a75939eacb2d910103b84a8a4a9f6aef28433"
+  integrity sha512-lxzFtkjJMn5Oyi46OpcjtVjwsBJL6/5TWE9YJwSpt+bhJSQ6dlGedydFk2us84h3W9sWrhQ0RO9G3yJlJ2waaw==
   dependencies:
     object-merge "2.5.1"