Skip to content

Commit

Permalink
fix Wallets.test.tsx tests
Browse files Browse the repository at this point in the history
  • Loading branch information
Zachary Johnson committed Jan 30, 2024
1 parent 911c0d3 commit 8282148
Show file tree
Hide file tree
Showing 3 changed files with 73 additions and 43 deletions.
2 changes: 0 additions & 2 deletions src/components/CreateWallet.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,11 @@ jest.mock('../libs/JmWalletApi', () => ({
postWalletCreate: jest.fn(),
}))

const mockedUseNavigate = jest.fn()
const mockedUseNavigation = jest.fn()
const mockUseLoaderData = jest.fn()
jest.mock('react-router-dom', () => {
return {
...jest.requireActual('react-router-dom'),
useNavigate: () => mockedUseNavigate,
useNavigation: () => mockedUseNavigation,
useLoaderData: () => mockUseLoaderData,
}
Expand Down
83 changes: 57 additions & 26 deletions src/components/Wallets.test.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import user from '@testing-library/user-event'

import * as apiMock from '../libs/JmWalletApi'
import * as loadersMock from './loaders/DataLoaders'
import * as reactRouterDomMock from 'react-router-dom'

import Wallets from './Wallets'
import { CurrentWallet } from '../context/WalletContext'
Expand All @@ -24,18 +23,19 @@ jest.mock('../libs/JmWalletApi', () => ({
getWalletLock: jest.fn(),
}))

const mockedUseNavigate = jest.fn()
const mockedUseNavigation = jest.fn()
const mockUseLoaderData = {
existingWallets: ['test'],
existingWalletsError: null,
const mockUseNavigate = jest.fn()
let mockUseNavigation = {
state: 'loading',
}
let mockUseLoaderData = {
existingWallets: [''],
existingWalletsError: '',
}

jest.mock('react-router-dom', () => {
return {
...jest.requireActual('react-router-dom'),
useNavigate: () => mockedUseNavigate,
useNavigation: () => mockedUseNavigation,
useNavigate: () => mockUseNavigate,
useNavigation: () => mockUseNavigation,
useLoaderData: () => mockUseLoaderData,
}
})
Expand Down Expand Up @@ -83,13 +83,10 @@ describe('<Wallets />', () => {
ok: false,
}),
)
;(loadersMock.allWalletsLoader as jest.Mock).mockReturnValue(
Promise.resolve({
ok: false,
message: 'error message',
}),
)
apiMock.Helper.throwError(jest.fn as unknown as Response, t('wallets.error_loading_failed'))
mockUseLoaderData = {
existingWallets: [],
existingWalletsError: t('wallets.error_loading_failed'),
}

await act(async () => setup({}))

Expand Down Expand Up @@ -145,9 +142,6 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ version: '0.9.10dev' }),
}),
)
;(reactRouterDomMock.useNavigation as jest.Mock).mockReturnValue({
state: 'idle',
})

await act(async () => setup({}))

Expand Down Expand Up @@ -179,6 +173,13 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ version: '0.9.10dev' }),
}),
)
mockUseLoaderData = {
existingWallets: ['wallet0.jmdat', 'wallet1.jmdat'],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () => setup({}))

Expand Down Expand Up @@ -263,11 +264,13 @@ describe('<Wallets />', () => {
}),
}),
)
;(loadersMock.allWalletsLoader as jest.Mock).mockReturnValue(
Promise.resolve({
existingWallets: [dummyWalletFileName],
}),
)
mockUseLoaderData = {
existingWallets: [dummyWalletFileName],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () => setup({}))

Expand All @@ -285,7 +288,7 @@ describe('<Wallets />', () => {
token: dummyToken,
refresh_token: dummyToken,
})
expect(mockedUseNavigate).toHaveBeenCalledWith('/wallet')
expect(mockUseNavigate).toHaveBeenCalledWith('/wallet')
})

it('should add alert if unlocking of inactive wallet fails', async () => {
Expand Down Expand Up @@ -315,6 +318,13 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ message: apiErrorMessage }),
}),
)
mockUseLoaderData = {
existingWallets: [dummyWalletFileName],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () => setup({}))

Expand All @@ -328,7 +338,7 @@ describe('<Wallets />', () => {
await user.click(unlockWalletButton)

expect(mockStartWallet).not.toHaveBeenCalled()
expect(mockedUseNavigate).not.toHaveBeenCalled()
expect(mockUseNavigate).not.toHaveBeenCalled()

expect(screen.getByText(apiErrorMessage.replace('Wallet', dummyWalletFileName))).toBeInTheDocument()
})
Expand Down Expand Up @@ -358,6 +368,13 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ walletname: dummyWalletFileName, already_locked: false }),
}),
)
mockUseLoaderData = {
existingWallets: [dummyWalletFileName],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () =>
setup({
Expand Down Expand Up @@ -407,6 +424,13 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ message: apiErrorMessage }),
}),
)
mockUseLoaderData = {
existingWallets: [dummyWalletFileName],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () =>
setup({
Expand Down Expand Up @@ -462,6 +486,13 @@ describe('<Wallets />', () => {
json: () => Promise.resolve({ walletname: dummyWalletFileName, already_locked: false }),
}),
)
mockUseLoaderData = {
existingWallets: [dummyWalletFileName],
existingWalletsError: '',
}
mockUseNavigation = {
state: 'idle',
}

await act(async () =>
setup({
Expand Down
31 changes: 16 additions & 15 deletions src/components/Wallets.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall
const navigate = useNavigate()
const navigation = useNavigation()
const serviceInfo = useServiceInfo()
const { existingWallets, existingWalletsError } = useLoaderData() as AllWalletsLoaderResponse
const getWalletAllResponse = useLoaderData() as AllWalletsLoaderResponse
const [unlockingWalletFileName, setUnlockWalletFileName] = useState<Api.WalletFileName>()
const isUnlocking = useMemo(() => unlockingWalletFileName !== undefined, [unlockingWalletFileName])
const [alert, setAlert] = useState<SimpleAlert>()
Expand Down Expand Up @@ -157,26 +157,26 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall
}, [currentWallet, lockWallet])

useEffect(() => {
if (currentWallet && existingWallets?.wallets?.length > 1) {
if (currentWallet && getWalletAllResponse?.existingWallets?.length > 1) {
setAlert({
variant: 'info',
message: t('wallets.alert_wallet_open', { currentWalletName: currentWallet.displayName }),
dismissible: false,
})
}

if (existingWalletsError) {
const message = existingWalletsError || t('wallets.error_loading_failed')
if (getWalletAllResponse.existingWalletsError) {
const message = getWalletAllResponse.existingWalletsError || t('wallets.error_loading_failed')
setAlert({ variant: 'danger', message })
}
}, [currentWallet, existingWallets?.wallets?.length, existingWalletsError, t])
}, [currentWallet, getWalletAllResponse, t])

return (
<>
<div className="wallets">
<PageTitle
title={t('wallets.title')}
subtitle={existingWallets?.wallets?.length === 0 ? t('wallets.subtitle_no_wallets') : undefined}
subtitle={getWalletAllResponse?.existingWallets?.length === 0 ? t('wallets.subtitle_no_wallets') : undefined}
center={true}
/>
{serviceInfo?.rescanning === true && (
Expand All @@ -185,13 +185,13 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall
</rb.Alert>
)}
{alert && <Alert {...alert} />}
{navigation.state !== 'idle' ? (
{navigation.state === 'loading' ? (
<div className="d-flex justify-content-center align-items-center">
<rb.Spinner as="span" animation="border" size="sm" role="status" aria-hidden="true" className="me-2" />
<span>{t('wallets.text_loading')}</span>
</div>
) : (
sortWallets(existingWallets?.wallets ?? [], serviceInfo?.walletFileName).map(
sortWallets(getWalletAllResponse?.existingWallets ?? [], serviceInfo?.walletFileName).map(
(walletFileName: Api.WalletFileName, index: number) => {
const noneActive = !serviceInfo?.walletFileName
const isActive = serviceInfo?.walletFileName === walletFileName
Expand Down Expand Up @@ -222,16 +222,17 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall

<div
className={classNames('d-flex', 'justify-content-center', 'gap-2', 'mt-4', {
'flex-column': existingWallets?.wallets?.length === 0,
'flex-column': getWalletAllResponse?.existingWallets?.length === 0,
})}
>
<Link
to={routes.createWallet}
className={classNames('btn', {
'btn-lg': existingWallets?.wallets?.length === 0,
'btn-dark': existingWallets?.wallets?.length === 0,
'btn-outline-dark': !existingWallets?.wallets || existingWallets?.wallets?.length > 0,
disabled: !existingWallets || isUnlocking,
'btn-lg': getWalletAllResponse?.existingWallets?.length === 0,
'btn-dark': getWalletAllResponse?.existingWallets?.length === 0,
'btn-outline-dark':
!getWalletAllResponse?.existingWallets || getWalletAllResponse?.existingWallets?.length > 0,
disabled: !getWalletAllResponse || isUnlocking,
})}
data-testid="new-wallet-btn"
>
Expand All @@ -244,8 +245,8 @@ export default function Wallets({ currentWallet, startWallet, stopWallet }: Wall
<Link
to={routes.importWallet}
className={classNames('btn', 'btn-outline-dark', {
'btn-lg': existingWallets?.wallets?.length === 0,
disabled: !existingWallets || isUnlocking,
'btn-lg': getWalletAllResponse?.existingWallets?.length === 0,
disabled: !getWalletAllResponse || isUnlocking,
})}
data-testid="import-wallet-btn"
>
Expand Down

0 comments on commit 8282148

Please sign in to comment.