test: upgrade jest to v27 and setup jest-dom (#23881)

This commit is contained in:
Josh Leonard
2024-06-10 08:14:03 -06:00
committed by GitHub
parent 615b8ebe2c
commit b80efc46f5
11 changed files with 1459 additions and 4803 deletions
@@ -180,6 +180,7 @@ export const ConfirmTransactionPanel = () => {
return (
<StyledWrapper>
<Skeleton
data-testid='confirm-transaction-panel-loading-skeleton'
width={'100%'}
height={'100%'}
enableAnimation
@@ -0,0 +1,44 @@
// Copyright (c) 2024 The Brave Authors. All rights reserved.
// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this file,
// You can obtain one at https://mozilla.org/MPL/2.0/.
import * as React from 'react'
import { render, screen, waitFor } from '@testing-library/react'
// components
import {
WalletPanelTestWrapper //
} from '../../../stories/wrappers/wallet-panel-story-wrapper'
import { PendingTransactionPanel } from './pending_transaction_panel'
// mocks
import {
mockTransactionInfo //
} from '../../../stories/mock-data/mock-transaction-info'
test('should display transaction origin after loading data', async () => {
render(
<WalletPanelTestWrapper>
<PendingTransactionPanel
selectedPendingTransaction={mockTransactionInfo}
/>
</WalletPanelTestWrapper>
)
// loading skeleton should appear first
expect(
screen.getByTestId('confirm-transaction-panel-loading-skeleton')
).toBeVisible()
// wait for loading to finish
await waitFor(() =>
expect(
screen.queryByTestId('confirm-transaction-panel-loading-skeleton')
).not.toBeInTheDocument()
)
// then the transaction origin should appear
expect(screen.getByText('uniswap.org')).toBeVisible()
expect(screen.getByText('uniswap.org')).toHaveTextContent('uniswap.org')
})
@@ -51,7 +51,7 @@ export const mockTransactionInfo: SerializableTransactionInfo = {
},
txHash:
'0xab834bab0000000000000000000000007be8076f4ea4a4ad08075c2508e481d6c946d12b00000000000000000000000073a29a1da971497',
txStatus: 0,
txStatus: BraveWallet.TransactionStatus.Unapproved,
txParams: ['address', 'amount'],
txType: BraveWallet.TransactionType.ERC20Transfer,
createdTime: { microseconds: 0 },
@@ -16,6 +16,11 @@ import { WalletActions } from '../../common/actions'
// types
import { PanelState, UIState, WalletState } from '../../constants/types'
// theme
import LightDarkThemeProvider from '../../../common/BraveCoreThemeProvider'
import walletDarkTheme from '../../theme/wallet-dark'
import walletLightTheme from '../../theme/wallet-light'
// Mocks
import { ApiProxyContext } from '../../common/context/api-proxy.context'
import { createMockStore } from '../../utils/test-utils'
@@ -73,4 +78,16 @@ export const WalletPanelStory: React.FC<
)
}
export const WalletPanelTestWrapper = (
props: React.PropsWithChildren<WalletPanelStoryProps>
) => (
<LightDarkThemeProvider
initialThemeType={'Light'}
dark={walletDarkTheme}
light={walletLightTheme}
>
<WalletPanelStory {...props} />
</LightDarkThemeProvider>
)
export default WalletPanelStory
@@ -11,22 +11,21 @@ Object.assign(navigator, {
})
describe('copyToClipboard', () => {
it('should call navigator.clipboard.writeText', async (done) => {
it('should call navigator.clipboard.writeText', async () => {
const mockData = 'someText'
jest.spyOn(navigator.clipboard, 'writeText')
await copyToClipboard(mockData)
expect(navigator.clipboard.writeText).toHaveBeenCalledWith(mockData)
done()
})
it('should throw error if navigator.clipboard.writeText throws an error', async (done) => {
jest.spyOn(navigator.clipboard, 'writeText').mockImplementation(() => {
throw new Error()
})
await copyToClipboard('data')
expect(navigator.clipboard.writeText).toThrowError()
done()
})
it(
'should throw error if navigator.clipboard.writeText ' + 'throws an error',
async () => {
jest.spyOn(navigator.clipboard, 'writeText').mockImplementation(() => {
throw new Error()
})
await copyToClipboard('data')
expect(navigator.clipboard.writeText).toThrowError()
}
)
})
+11
View File
@@ -38,5 +38,16 @@ module.exports = class CustomEnvironment extends JSDOMEnvironment {
assert(this.global.crypto === undefined)
this.global.crypto = webcrypto
this.global.matchMedia = (query) => ({
matches: false,
media: query,
onchange: null,
addListener: () => {},
removeListener: () => {},
addEventListener: () => {},
removeEventListener: () => {},
dispatchEvent: () => {}
})
}
}
+5 -3
View File
@@ -1,5 +1,7 @@
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at https://mozilla.org/MPL/2.0/. */
// Copyright (c) 2024 The Brave Authors. All rights reserved.
// This Source Code Form is subject to the terms of the Mozilla Public
// License, v. 2.0. If a copy of the MPL was not distributed with this file,
// You can obtain one at https://mozilla.org/MPL/2.0/.
import '@testing-library/jest-dom'
import './testPolyfills'
+1357 -4784
View File
File diff suppressed because it is too large Load Diff
+4 -3
View File
@@ -85,12 +85,13 @@
"@storybook/addons": "7.6.17",
"@storybook/react": "7.6.17",
"@storybook/react-webpack5": "7.6.17",
"@testing-library/jest-dom": "5.17.0",
"@testing-library/react": "15.0.6",
"@types/array-move": "2.0.0",
"@types/async": "3.2.20",
"@types/chrome": "0.0.241",
"@types/dom-navigation": "1.0.3",
"@types/jest": "26.0.24",
"@types/jest": "27.5.2",
"@types/qr-image": "3.2.5",
"@types/react": "18.2.75",
"@types/react-dom": "18.2.24",
@@ -131,7 +132,7 @@
"fs-extra": "8.1.0",
"https-browserify": "1.0.0",
"identity-obj-proxy": "3.0.0",
"jest": "26.6.3",
"jest": "27.5.1",
"jest-junit": "13.0.0",
"less": "3.13.1",
"less-loader": "11.1.3",
@@ -158,7 +159,7 @@
"teamcity-service-messages": "0.1.14",
"terser": "5.16.2",
"timers-browserify": "2.0.12",
"ts-jest": "26.5.6",
"ts-jest": "27.1.4",
"ts-loader": "8.4.0",
"typesafe-actions": "2.2.0",
"typescript": "4.9.4",
@@ -0,0 +1,4 @@
Name: jest-dom
URL: https://github.com/testing-library/jest-dom
License: MIT
License File: /brave/node_modules/@testing-library/dom/LICENSE
@@ -0,0 +1,4 @@
Name: React Testing Library
URL: https://github.com/testing-library/react-testing-library
License: MIT
License File: /brave/node_modules/@testing-library/react/LICENSE