()
const hideTooltip = () => setTooltip(undefined)
const showTooltip = (
diff --git a/src/containers/shared/components/Transaction/DepositPreauth/test/DepositPreauthDescription.test.tsx b/src/containers/shared/components/Transaction/DepositPreauth/test/DepositPreauthDescription.test.tsx
index d9e592fa1..9faa72a13 100644
--- a/src/containers/shared/components/Transaction/DepositPreauth/test/DepositPreauthDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/DepositPreauth/test/DepositPreauthDescription.test.tsx
@@ -14,7 +14,7 @@ describe('DepositPreauth: Description', () => {
it('renders description for authorize', () => {
const { container, unmount } = renderComponent(mockDepositPreaut)
expect(container.innerHTML).toBe(
- ``,
+ ``,
)
unmount()
})
@@ -24,7 +24,7 @@ describe('DepositPreauth: Description', () => {
mockDepositPreauthUnauthorize,
)
expect(container.innerHTML).toBe(
- ``,
+ ``,
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/EscrowCancel/test/EscrowCancelDescription.test.tsx b/src/containers/shared/components/Transaction/EscrowCancel/test/EscrowCancelDescription.test.tsx
index 0c81c5600..a6a5714bb 100644
--- a/src/containers/shared/components/Transaction/EscrowCancel/test/EscrowCancelDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/EscrowCancel/test/EscrowCancelDescription.test.tsx
@@ -21,7 +21,7 @@ describe('EscrowCancelDescription', () => {
getTestByName('EscrowCancel having XRP escrowed'),
)
expect(container.innerHTML).toBe(
- 'The escrow was created by rpmqbo5FWoydTL2Ufh5YdtzmRjbeLyxt56 with transaction A979AD...',
+ 'The escrow was created by rpmqbo5FWoydTL2Ufh5YdtzmRjbeLyxt56 with transaction A979AD...',
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/EscrowCreate/test/EscrowCreateDescription.test.tsx b/src/containers/shared/components/Transaction/EscrowCreate/test/EscrowCreateDescription.test.tsx
index db079ddda..d61a7e63e 100644
--- a/src/containers/shared/components/Transaction/EscrowCreate/test/EscrowCreateDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/EscrowCreate/test/EscrowCreateDescription.test.tsx
@@ -21,7 +21,7 @@ describe('EscrowCreateDescription', () => {
getTestByName('renders EscrowCreate'),
)
expect(container.innerHTML).toBe(
- 'The escrow is from rLbgNAngLq3HABBXK4uPGCHrqeZwgaYi8q to rLbgNAngLq3HABBXK4uPGCHrqeZwgaYi7qThe escrow has a fulfillment condition of A0258020886F982742772F414243855DC13B348FC78FB3D5119412C8A6480114E36A4451810120
It escrowed 997.50 XRP
It can be cancelled after March 1, 2020 at 8:54:20 AM UTC
It can be finished after March 1, 2020 at 9:01:00 AM UTC
',
+ 'The escrow is from rLbgNAngLq3HABBXK4uPGCHrqeZwgaYi8q to rLbgNAngLq3HABBXK4uPGCHrqeZwgaYi7qThe escrow has a fulfillment condition of A0258020886F982742772F414243855DC13B348FC78FB3D5119412C8A6480114E36A4451810120
It escrowed 997.50 XRP
It can be cancelled after March 1, 2020 at 8:54:20 AM UTC
It can be finished after March 1, 2020 at 9:01:00 AM UTC
',
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/EscrowFinish/test/EscrowFinishDescription.test.tsx b/src/containers/shared/components/Transaction/EscrowFinish/test/EscrowFinishDescription.test.tsx
index 66b101a65..3be5151d0 100644
--- a/src/containers/shared/components/Transaction/EscrowFinish/test/EscrowFinishDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/EscrowFinish/test/EscrowFinishDescription.test.tsx
@@ -21,7 +21,7 @@ describe('EscrowFinishDescription', () => {
getTestByName('EscrowFinish having XRP escrowed'),
)
expect(container.innerHTML).toBe(
- 'The escrow was created by r4UDXF4nL7Tgss8uQxn39cCocd8GnGyXS8 with transaction 3E2E75...The escrow condition is fulfilled by Fulfillment
',
+ 'The escrow was created by r4UDXF4nL7Tgss8uQxn39cCocd8GnGyXS8 with transaction 3E2E75...The escrow condition is fulfilled by Fulfillment
',
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/NFTokenCancelOffer/test/NFTokenCancelOfferSimple.test.tsx b/src/containers/shared/components/Transaction/NFTokenCancelOffer/test/NFTokenCancelOfferSimple.test.tsx
index 1c9b9b025..62f851076 100644
--- a/src/containers/shared/components/Transaction/NFTokenCancelOffer/test/NFTokenCancelOfferSimple.test.tsx
+++ b/src/containers/shared/components/Transaction/NFTokenCancelOffer/test/NFTokenCancelOfferSimple.test.tsx
@@ -1,4 +1,4 @@
-import { BrowserRouter as Router } from 'react-router-dom'
+import { BrowserRouter as Router } from 'react-router'
import { render } from '@testing-library/react'
import { I18nextProvider } from 'react-i18next'
import { QueryClientProvider } from 'react-query'
diff --git a/src/containers/shared/components/Transaction/NFTokenMint/test/NFTokenMintSimple.test.tsx b/src/containers/shared/components/Transaction/NFTokenMint/test/NFTokenMintSimple.test.tsx
index ab72509d6..d75f678ad 100644
--- a/src/containers/shared/components/Transaction/NFTokenMint/test/NFTokenMintSimple.test.tsx
+++ b/src/containers/shared/components/Transaction/NFTokenMint/test/NFTokenMintSimple.test.tsx
@@ -1,4 +1,4 @@
-import { BrowserRouter as Router } from 'react-router-dom'
+import { BrowserRouter as Router } from 'react-router'
import { render } from '@testing-library/react'
import { I18nextProvider } from 'react-i18next'
import { Simple as NFTokenMint } from '../Simple'
@@ -13,13 +13,12 @@ import summarizeTransaction from '../../../../../../rippled/lib/txSummary'
import i18n from '../../../../../../i18n/testConfig'
import { convertHexToString } from '../../../../../../rippled/lib/utils'
import { expectSimpleRowText, expectSimpleRowNotToExist } from '../../test'
-import { V7_FUTURE_ROUTER_FLAGS } from '../../../../../test/utils'
describe('NFTokenMint', () => {
it('handles NFTokenMint that modified 2 nodes', () => {
const { container } = render(
-
+
@@ -41,7 +40,7 @@ describe('NFTokenMint', () => {
it('handles NFTokenMint that modified 1 node and created 1 node', () => {
const { container } = render(
-
+
{
it('handles NFTokenMint that modified 2 nodes and created 1 node', () => {
const { container } = render(
-
+
{
it('handles NFTokenMint with issuer', () => {
const { container } = render(
-
+
@@ -122,7 +121,7 @@ describe('NFTokenMint', () => {
it('handles NFTokenMint that modified 3 nodes', () => {
const { container } = render(
-
+
{
it('handles NFTokenMint that has null URI', () => {
const { container } = render(
-
+
@@ -164,7 +163,7 @@ describe('NFTokenMint', () => {
it('handles NFTokenMint that failed', () => {
const { container } = render(
-
+
diff --git a/src/containers/shared/components/Transaction/OfferCreate/test/OfferCreateDescription.test.tsx b/src/containers/shared/components/Transaction/OfferCreate/test/OfferCreateDescription.test.tsx
index 0b9921e84..e93c8d24a 100644
--- a/src/containers/shared/components/Transaction/OfferCreate/test/OfferCreateDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/OfferCreate/test/OfferCreateDescription.test.tsx
@@ -11,7 +11,7 @@ describe('OfferCreate: Description', () => {
const { container, unmount } = renderComponent(OfferCreate)
expect(container.innerHTML).toBe(
- 'offer_create_desc_line_3 44866443
The offer expiresMay 18, 2022 at 5:28:16 PM UTCunless cancelled before',
+ 'offer_create_desc_line_3 44866443
The offer expiresMay 18, 2022 at 5:28:16 PM UTCunless cancelled before',
)
unmount()
})
@@ -22,7 +22,7 @@ describe('OfferCreate: Description', () => {
)
expect(container.innerHTML).toBe(
- 'offer_create_desc_line_3 80543309
',
+ 'offer_create_desc_line_3 80543309
',
)
unmount()
})
@@ -33,7 +33,7 @@ describe('OfferCreate: Description', () => {
)
expect(container.innerHTML).toBe(
- 'offer_create_desc_line_5: 4A4879496CFF23CA32242D50DA04DDB41F4561167276A62AF21899F83DF28812
',
+ 'offer_create_desc_line_5: 4A4879496CFF23CA32242D50DA04DDB41F4561167276A62AF21899F83DF28812
',
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/TrustSet/Description.tsx b/src/containers/shared/components/Transaction/TrustSet/Description.tsx
index 96a52f471..e3799d56c 100644
--- a/src/containers/shared/components/Transaction/TrustSet/Description.tsx
+++ b/src/containers/shared/components/Transaction/TrustSet/Description.tsx
@@ -16,8 +16,8 @@ export const Description = ({
return (
- It establishes {{ amount }}
- as the maximum amount of {{ currency }}
+ It establishes {{ amount } as any}
+ as the maximum amount of {{ currency } as any}
from
that
is willing to hold
diff --git a/src/containers/shared/components/Transaction/TrustSet/test/TrustSetDescription.test.tsx b/src/containers/shared/components/Transaction/TrustSet/test/TrustSetDescription.test.tsx
index c916c4308..8e65a04d4 100644
--- a/src/containers/shared/components/Transaction/TrustSet/test/TrustSetDescription.test.tsx
+++ b/src/containers/shared/components/Transaction/TrustSet/test/TrustSetDescription.test.tsx
@@ -11,7 +11,7 @@ describe('TrustSet: Description', () => {
it('renders description for authorize', () => {
const { container, unmount } = renderComponent(mockTrustSet)
expect(container.innerHTML).toBe(
- ``,
+ ``,
)
unmount()
})
diff --git a/src/containers/shared/components/Transaction/test/createWrapperFactory.tsx b/src/containers/shared/components/Transaction/test/createWrapperFactory.tsx
index 60737efea..651053e43 100644
--- a/src/containers/shared/components/Transaction/test/createWrapperFactory.tsx
+++ b/src/containers/shared/components/Transaction/test/createWrapperFactory.tsx
@@ -1,7 +1,7 @@
import { render, RenderResult } from '@testing-library/react'
import { ReactElement } from 'react'
import { I18nextProvider } from 'react-i18next'
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { i18n } from 'i18next'
import { QueryClientProvider } from 'react-query'
import defaultI18nConfig from '../../../../../i18n/testConfig'
@@ -12,7 +12,6 @@ import {
TransactionTableDetailComponent,
} from '../types'
import { testQueryClient } from '../../../../test/QueryClient'
-import { V7_FUTURE_ROUTER_FLAGS } from '../../../../test/utils'
import SocketContext from '../../../SocketContext'
import MockWsClient from '../../../../test/mockWsClient'
@@ -31,7 +30,7 @@ export function renderWithProviders(
return render(
-
+
{TestComponent}
diff --git a/src/containers/shared/components/TransactionTable/test/TransactionTable.test.js b/src/containers/shared/components/TransactionTable/test/TransactionTable.test.js
index 8e8b2b68a..7e5e7cb51 100644
--- a/src/containers/shared/components/TransactionTable/test/TransactionTable.test.js
+++ b/src/containers/shared/components/TransactionTable/test/TransactionTable.test.js
@@ -1,6 +1,6 @@
import { render } from '@testing-library/react'
import { I18nextProvider } from 'react-i18next'
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { QueryClientProvider } from 'react-query'
import { TransactionTable } from '../TransactionTable'
import i18n from '../../../../../i18n/testConfig'
diff --git a/src/containers/shared/components/VHSValidators/VHSValidatorsProvider.tsx b/src/containers/shared/components/VHSValidators/VHSValidatorsProvider.tsx
index 85b629eff..3d8e9083c 100644
--- a/src/containers/shared/components/VHSValidators/VHSValidatorsProvider.tsx
+++ b/src/containers/shared/components/VHSValidators/VHSValidatorsProvider.tsx
@@ -1,4 +1,4 @@
-import { FC, useContext } from 'react'
+import { FC, PropsWithChildren, useContext } from 'react'
import { useQuery } from 'react-query'
import axios from 'axios'
import { VHSValidatorsContext } from './VHSValidatorsContext'
@@ -8,7 +8,7 @@ import NetworkContext from '../../NetworkContext'
import { VHSValidatorsHookResult } from './types'
import { FETCH_INTERVAL_ERROR_MILLIS, FETCH_INTERVAL_MILLIS } from '../../utils'
-export const VHSValidatorsProvider: FC = ({ children }) => {
+export const VHSValidatorsProvider: FC = ({ children }) => {
const network = useContext(NetworkContext)
const { data: value } = useQuery(
diff --git a/src/containers/shared/components/test/Account.test.tsx b/src/containers/shared/components/test/Account.test.tsx
index 2b7dc1d35..9a14b93c3 100644
--- a/src/containers/shared/components/test/Account.test.tsx
+++ b/src/containers/shared/components/test/Account.test.tsx
@@ -1,5 +1,5 @@
import { I18nextProvider } from 'react-i18next'
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { cleanup, render, screen } from '@testing-library/react'
import i18n from '../../../../i18n/testConfig'
import { Account } from '../Account'
diff --git a/src/containers/shared/components/test/Amount.test.tsx b/src/containers/shared/components/test/Amount.test.tsx
index a1c226587..5d8f57d3a 100644
--- a/src/containers/shared/components/test/Amount.test.tsx
+++ b/src/containers/shared/components/test/Amount.test.tsx
@@ -1,5 +1,5 @@
import { I18nextProvider } from 'react-i18next'
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { cleanup, render, screen } from '@testing-library/react'
import { useQuery } from 'react-query'
import { Amount } from '../Amount'
diff --git a/src/containers/shared/components/test/Currency.test.tsx b/src/containers/shared/components/test/Currency.test.tsx
index 918346491..b7c772bb4 100644
--- a/src/containers/shared/components/test/Currency.test.tsx
+++ b/src/containers/shared/components/test/Currency.test.tsx
@@ -1,4 +1,4 @@
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { cleanup, render, screen } from '@testing-library/react'
import Currency from '../Currency'
diff --git a/src/containers/shared/components/test/NFTokenLink.test.tsx b/src/containers/shared/components/test/NFTokenLink.test.tsx
index aa9985318..40439ef37 100644
--- a/src/containers/shared/components/test/NFTokenLink.test.tsx
+++ b/src/containers/shared/components/test/NFTokenLink.test.tsx
@@ -1,5 +1,5 @@
import { render, screen } from '@testing-library/react'
-import { BrowserRouter } from 'react-router-dom'
+import { BrowserRouter } from 'react-router'
import { NFTokenLink } from '../NFTokenLink'
const renderComponent = (component: JSX.Element) =>
diff --git a/src/containers/shared/css/simpleTab.scss b/src/containers/shared/css/simpleTab.scss
index fc005d002..bda6231af 100644
--- a/src/containers/shared/css/simpleTab.scss
+++ b/src/containers/shared/css/simpleTab.scss
@@ -99,8 +99,8 @@ $index-width: 324px;
@include medium;
color: $white;
+ overflow-wrap: break-word;
vertical-align: middle;
- word-break: break-word;
&.text-truncate {
@extend %truncate;
diff --git a/src/containers/shared/hooks/test/useCursorPaginatedQuery.test.tsx b/src/containers/shared/hooks/test/useCursorPaginatedQuery.test.tsx
index 4e399ddad..732e256c7 100644
--- a/src/containers/shared/hooks/test/useCursorPaginatedQuery.test.tsx
+++ b/src/containers/shared/hooks/test/useCursorPaginatedQuery.test.tsx
@@ -1,5 +1,4 @@
-import { renderHook, act } from '@testing-library/react-hooks'
-import { waitFor } from '@testing-library/react'
+import { renderHook, act, waitFor } from '@testing-library/react'
import { CursorPaginationService } from '../../services/CursorPaginationService'
import { useCursorPaginatedQuery } from '../useCursorPaginatedQuery'
diff --git a/src/containers/shared/hooks/test/useTokenToUSDRate.test.tsx b/src/containers/shared/hooks/test/useTokenToUSDRate.test.tsx
index 084cf924c..3e61596ec 100644
--- a/src/containers/shared/hooks/test/useTokenToUSDRate.test.tsx
+++ b/src/containers/shared/hooks/test/useTokenToUSDRate.test.tsx
@@ -1,5 +1,4 @@
-import { renderHook } from '@testing-library/react-hooks'
-import { waitFor } from '@testing-library/react'
+import { renderHook, waitFor } from '@testing-library/react'
import { QueryClient, QueryClientProvider } from 'react-query'
import { useTokenToUSDRate } from '../useTokenToUSDRate'
import * as useXRPToUSDRateModule from '../useXRPToUSDRate'
diff --git a/src/containers/shared/hooks/test/useXRPToUSDRate.test.tsx b/src/containers/shared/hooks/test/useXRPToUSDRate.test.tsx
index dd7f4719d..700145db0 100644
--- a/src/containers/shared/hooks/test/useXRPToUSDRate.test.tsx
+++ b/src/containers/shared/hooks/test/useXRPToUSDRate.test.tsx
@@ -1,5 +1,4 @@
-import { renderHook } from '@testing-library/react-hooks'
-import { waitFor } from '@testing-library/react'
+import { renderHook, waitFor } from '@testing-library/react'
import { QueryClient, QueryClientProvider } from 'react-query'
import { useXRPToUSDRate } from '../useXRPToUSDRate'
import SocketContext from '../../SocketContext'
@@ -67,7 +66,9 @@ describe('useXRPToUSDRate', () => {
// Force useQuery to refetch
queryClient.invalidateQueries('XRPToUSDRate')
- await waitFor(() => expect(result.current).toBe(2.1))
- expect(Log.error).toHaveBeenCalledTimes(1)
+ await waitFor(() => {
+ expect(result.current).toBe(2.1)
+ expect(Log.error).toHaveBeenCalledTimes(1)
+ })
})
})
diff --git a/src/containers/shared/navigate.ts b/src/containers/shared/navigate.ts
new file mode 100644
index 000000000..7f59d9aa5
--- /dev/null
+++ b/src/containers/shared/navigate.ts
@@ -0,0 +1,7 @@
+/**
+ * Thin wrapper around window.location.assign so that it can be
+ * mocked in tests (jsdom 26+ freezes Location properties).
+ */
+export function locationAssign(url: string): void {
+ window.location.assign(url)
+}
diff --git a/src/containers/shared/routing.tsx b/src/containers/shared/routing.tsx
index 75e7759b3..de0f5b91c 100644
--- a/src/containers/shared/routing.tsx
+++ b/src/containers/shared/routing.tsx
@@ -1,9 +1,9 @@
import { ReactNode, Ref } from 'react'
-import { generatePath } from 'react-router'
import {
+ generatePath,
NavLink as RouterLink,
useParams as useRouterParams,
-} from 'react-router-dom'
+} from 'react-router'
/**
* A definition for a react-router route that allows for typed routes
diff --git a/src/containers/shared/test/txDetails.test.js b/src/containers/shared/test/txDetails.test.js
index 34a011af3..6ffdbf067 100644
--- a/src/containers/shared/test/txDetails.test.js
+++ b/src/containers/shared/test/txDetails.test.js
@@ -1,6 +1,6 @@
import { render } from '@testing-library/react'
import { I18nextProvider } from 'react-i18next'
-import { BrowserRouter as Router } from 'react-router-dom'
+import { BrowserRouter as Router } from 'react-router'
import i18n from '../../../i18n/testConfig'
import EnableAmendment from '../../Transactions/test/mock_data/EnableAmendment.json'
import { TxDetails } from '../components/TxDetails'
diff --git a/src/containers/test/utils.tsx b/src/containers/test/utils.tsx
index 454206f3e..f7c0cd932 100644
--- a/src/containers/test/utils.tsx
+++ b/src/containers/test/utils.tsx
@@ -2,8 +2,7 @@ import { isValidElement, FC, PropsWithChildren } from 'react'
import { Helmet, HelmetProvider } from 'react-helmet-async'
import { I18nextProvider } from 'react-i18next'
import { QueryClientProvider } from 'react-query'
-import { MemoryRouter, Routes } from 'react-router'
-import { Route } from 'react-router-dom'
+import { MemoryRouter, Routes, Route } from 'react-router'
import type i18n from '../../i18n/testConfig'
import { testQueryClient } from './QueryClient'
import { AnalyticsSetPath } from '../shared/analytics'
@@ -13,11 +12,6 @@ export function flushPromises() {
return new Promise((resolve) => setTimeout(resolve))
}
-export const V7_FUTURE_ROUTER_FLAGS = {
- v7_startTransition: true,
- v7_relativeSplatPath: true,
-}
-
// @ts-ignore
Helmet.defaultProps.defer = false
@@ -31,10 +25,7 @@ export const QuickHarness: FC<
-
+
{isValidElement(children) && children?.type === Route ? (
{children}
diff --git a/src/index.tsx b/src/index.tsx
index 1c667e7e6..c1fc71e6a 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,6 +1,6 @@
import { Suspense } from 'react'
-import ReactDOM from 'react-dom'
-import { BrowserRouter as Router } from 'react-router-dom'
+import { createRoot } from 'react-dom/client'
+import { BrowserRouter as Router } from 'react-router'
import { I18nextProvider } from 'react-i18next'
import { Buffer } from 'buffer'
import { unregister } from './registerServiceWorker'
@@ -10,8 +10,10 @@ import i18n from './i18n'
window.Buffer = Buffer
+const root = createRoot(document.getElementById('xrpl-explorer')!)
+
const renderApp = () => {
- ReactDOM.render(
+ root.render(
@@ -19,7 +21,6 @@ const renderApp = () => {
,
- document.getElementById('xrpl-explorer'),
)
}
diff --git a/src/setupTests.ts b/src/setupTests.ts
index f6fa396da..4498af11b 100644
--- a/src/setupTests.ts
+++ b/src/setupTests.ts
@@ -3,6 +3,17 @@ import '@testing-library/jest-dom'
import { TextEncoder, TextDecoder } from 'util'
+// ResizeObserver is not available in jsdom, needed by recharts and other libs
+/* eslint-disable class-methods-use-this */
+global.ResizeObserver = class ResizeObserver {
+ observe() {}
+
+ unobserve() {}
+
+ disconnect() {}
+}
+/* eslint-enable class-methods-use-this */
+
const mockStorage = {}
window.dataLayer = window.dataLayer || []