forked from Uniswap/interface
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: show injected options in wallet browsers (Uniswap#3995)
* feat: show injected options in wallet browsers * initial testing * more mocking * mock more * mobile tests * updates * add data test * finally got the mock to work * WORKING * uncomment * rm console.log * fix * check length * fix tests to use useWeb3React * rm * rename tests
- Loading branch information
Showing
7 changed files
with
143 additions
and
23 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,87 @@ | ||
| import { ApplicationModal } from 'state/application/reducer' | ||
|
|
||
| import { render, screen } from '../../test-utils' | ||
| import WalletModal from './index' | ||
|
|
||
| beforeEach(() => { | ||
| delete global.window.ethereum | ||
| }) | ||
|
|
||
| afterAll(() => { | ||
| delete global.window.ethereum | ||
| }) | ||
|
|
||
| const UserAgentMock = jest.requireMock('utils/userAgent') | ||
| jest.mock('utils/userAgent', () => ({ | ||
| isMobile: false, | ||
| })) | ||
|
|
||
| jest.mock('.../../state/application/hooks', () => { | ||
| return { | ||
| useModalOpen: (_modal: ApplicationModal) => true, | ||
| useWalletModalToggle: () => { | ||
| return | ||
| }, | ||
| } | ||
| }) | ||
|
|
||
| jest.mock('@web3-react/core', () => { | ||
| const web3React = jest.requireActual('@web3-react/core') | ||
| return { | ||
| useWeb3React: () => ({ | ||
| account: undefined, | ||
| isActive: false, | ||
| isActivating: false, | ||
| connector: undefined, | ||
| }), | ||
| ...web3React, | ||
| } | ||
| }) | ||
|
|
||
| it('loads Wallet Modal on desktop', async () => { | ||
| render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />) | ||
| expect(screen.getByText('Install MetaMask')).toBeInTheDocument() | ||
| expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument() | ||
| expect(screen.getByText('WalletConnect')).toBeInTheDocument() | ||
| expect(screen.getByText('Fortmatic')).toBeInTheDocument() | ||
| expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(4) | ||
| }) | ||
|
|
||
| it('loads Wallet Modal on desktop with MetaMask installed', async () => { | ||
| global.window.ethereum = { isMetaMask: true } | ||
|
|
||
| render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />) | ||
| expect(screen.getByText('MetaMask')).toBeInTheDocument() | ||
| expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument() | ||
| expect(screen.getByText('WalletConnect')).toBeInTheDocument() | ||
| expect(screen.getByText('Fortmatic')).toBeInTheDocument() | ||
| expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(4) | ||
| }) | ||
|
|
||
| it('loads Wallet Modal on mobile', async () => { | ||
| UserAgentMock.isMobile = true | ||
|
|
||
| render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />) | ||
| expect(screen.getByText('Open in Coinbase Wallet')).toBeInTheDocument() | ||
| expect(screen.getByText('WalletConnect')).toBeInTheDocument() | ||
| expect(screen.getByText('Fortmatic')).toBeInTheDocument() | ||
| expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(3) | ||
| }) | ||
|
|
||
| it('loads Wallet Modal on MetaMask browser', async () => { | ||
| UserAgentMock.isMobile = true | ||
| global.window.ethereum = { isMetaMask: true } | ||
|
|
||
| render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />) | ||
| expect(screen.getByText('MetaMask')).toBeInTheDocument() | ||
| expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(1) | ||
| }) | ||
|
|
||
| it('loads Wallet Modal on Coinbase Wallet browser', async () => { | ||
| UserAgentMock.isMobile = true | ||
| global.window.ethereum = { isCoinbaseWallet: true } | ||
|
|
||
| render(<WalletModal pendingTransactions={[]} confirmedTransactions={[]} />) | ||
| expect(screen.getByText('Coinbase Wallet')).toBeInTheDocument() | ||
| expect(screen.getAllByTestId('wallet-modal-option')).toHaveLength(1) | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,19 +1,40 @@ | ||
| import { render, RenderOptions } from '@testing-library/react' | ||
| import React, { FC, ReactElement, ReactNode } from 'react' | ||
| import { i18n } from '@lingui/core' | ||
| import { I18nProvider } from '@lingui/react' | ||
| import { render } from '@testing-library/react' | ||
| import { Web3ReactProvider } from '@web3-react/core' | ||
| import { injected, injectedHooks } from 'connectors' | ||
| import { DEFAULT_LOCALE } from 'constants/locales' | ||
| import { en } from 'make-plural/plurals' | ||
| import { ReactElement, ReactNode } from 'react' | ||
| import { Provider } from 'react-redux' | ||
| import store from 'state' | ||
| import ThemeProvider from 'theme' | ||
|
|
||
| const WithProviders: FC = ({ children }: { children?: ReactNode }) => { | ||
| import catalog from './locales/en-US' | ||
|
|
||
| i18n.load({ | ||
| [DEFAULT_LOCALE]: catalog.messages, | ||
| }) | ||
| i18n.loadLocaleData({ | ||
| [DEFAULT_LOCALE]: { plurals: en }, | ||
| }) | ||
| i18n.activate(DEFAULT_LOCALE) | ||
|
|
||
| const MockedI18nProvider = ({ children }: any) => <I18nProvider i18n={i18n}>{children}</I18nProvider> | ||
|
|
||
| const WithProviders = ({ children }: { children?: ReactNode }) => { | ||
| return ( | ||
| <Provider store={store}> | ||
| <ThemeProvider>{children}</ThemeProvider> | ||
| </Provider> | ||
| <MockedI18nProvider> | ||
| <Provider store={store}> | ||
| <Web3ReactProvider connectors={[[injected, injectedHooks]]}> | ||
| <ThemeProvider>{children}</ThemeProvider> | ||
| </Web3ReactProvider> | ||
| </Provider> | ||
| </MockedI18nProvider> | ||
| ) | ||
| } | ||
|
|
||
| const customRender = (ui: ReactElement, options?: Omit<RenderOptions, 'wrapper'>) => | ||
| render(ui, { wrapper: WithProviders, ...options }) | ||
| const customRender = (ui: ReactElement) => render(ui, { wrapper: WithProviders }) | ||
|
|
||
| export * from '@testing-library/react' | ||
| export { customRender as render } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters