+
+
+
diff --git a/site/docs/pages/wallet/wallet.mdx b/site/docs/pages/wallet/wallet.mdx
index ab9637cf31..323bac592d 100644
--- a/site/docs/pages/wallet/wallet.mdx
+++ b/site/docs/pages/wallet/wallet.mdx
@@ -321,9 +321,13 @@ import { color } from '@coinbase/onchainkit/theme';
## Using Wallet Modal
-
+ height="364"
+ width="364"
+ className="mx-auto"
+/>
Wallet modal offers users multiple wallet connection options. The modal automatically appears when users click the `ConnectWallet` component and provides three distinct connection paths:
diff --git a/site/docs/styles.css b/site/docs/styles.css
index f15a3817df..28d4160bb1 100644
--- a/site/docs/styles.css
+++ b/site/docs/styles.css
@@ -67,6 +67,12 @@
padding: 8px 8px 0;
}
+.dark .vocs_NavigationMenu_content{
+ background-color: #0F0F0F;
+ border-color: #18181b !important;
+ border-radius: 8px;
+}
+
.vocs_DesktopTopNav_item.vocs_NavigationMenu_link.vocs_Link.vocs_Link_styleless {
color: #030712;
}
diff --git a/site/package.json b/site/package.json
index 8f54f1c132..48d0c60c29 100644
--- a/site/package.json
+++ b/site/package.json
@@ -9,10 +9,11 @@
"sitemap": "node createSitemap.js"
},
"dependencies": {
- "@coinbase/onchainkit": "0.35.8",
+ "@coinbase/onchainkit": "0.36.0",
"@types/react": "latest",
"@vercel/edge": "^1.1.1",
"express": "^4.21.1",
+ "motion": "^11.12.0",
"permissionless": "^0.1.29",
"react": "18",
"react-dom": "18",
diff --git a/site/yarn.lock b/site/yarn.lock
index 6adaba56ca..1689ebfa7a 100644
--- a/site/yarn.lock
+++ b/site/yarn.lock
@@ -479,9 +479,9 @@ __metadata:
languageName: node
linkType: hard
-"@coinbase/onchainkit@npm:0.35.8":
- version: 0.35.8
- resolution: "@coinbase/onchainkit@npm:0.35.8"
+"@coinbase/onchainkit@npm:0.36.0":
+ version: 0.36.0
+ resolution: "@coinbase/onchainkit@npm:0.36.0"
dependencies:
"@tanstack/react-query": "npm:^5"
clsx: "npm:^2.1.1"
@@ -492,10 +492,9 @@ __metadata:
wagmi: "npm:^2.12.24"
peerDependencies:
"@types/react": ^18
- "@xmtp/frames-validator": ^0.6.0
react: ^18
react-dom: ^18
- checksum: c8bd111b327f5be4fc757d75e2eae00bedfae1e6b0e7bfe532e2a1c564ceadd0f7645b089b245f3ccf75974834cb06053302b113bdac9f943b218263be2ccaaa
+ checksum: 4c6cdb3fa9548dd52823e1206fb3e58fd28e537cdc2d1e3b3d3ebca745409e93b34a2a1dfca87cb984136146302a3b10f8c8e7abc6c9d74bcb12b140450f08ed
languageName: node
linkType: hard
@@ -5693,6 +5692,28 @@ __metadata:
languageName: node
linkType: hard
+"framer-motion@npm:^11.13.1":
+ version: 11.13.1
+ resolution: "framer-motion@npm:11.13.1"
+ dependencies:
+ motion-dom: "npm:^11.13.0"
+ motion-utils: "npm:^11.13.0"
+ tslib: "npm:^2.4.0"
+ peerDependencies:
+ "@emotion/is-prop-valid": "*"
+ react: ^18.0.0
+ react-dom: ^18.0.0
+ peerDependenciesMeta:
+ "@emotion/is-prop-valid":
+ optional: true
+ react:
+ optional: true
+ react-dom:
+ optional: true
+ checksum: ab55da590b9c60141bfaaca3da4dbc0cd6b7021cb9bb697c19c511ca487306c78d6af4fa94cd72016a4ad47a9737206977eba33fe63eec40504d66535e081190
+ languageName: node
+ linkType: hard
+
"fresh@npm:0.5.2":
version: 0.5.2
resolution: "fresh@npm:0.5.2"
@@ -8015,6 +8036,20 @@ __metadata:
languageName: node
linkType: hard
+"motion-dom@npm:^11.13.0":
+ version: 11.13.0
+ resolution: "motion-dom@npm:11.13.0"
+ checksum: 5ba904289ca027a8070e001ca4f84a877539d6b08eaae04acaf117b5fc4bc37a9f4ca812208b41f4dc61a2db7af841140b30517d442c32d5243827b81bb11db7
+ languageName: node
+ linkType: hard
+
+"motion-utils@npm:^11.13.0":
+ version: 11.13.0
+ resolution: "motion-utils@npm:11.13.0"
+ checksum: db65509cf7abc7819ec40aae4c50a29f5c07619ee0ff4df04ea3950e85ba5ec68d00cf0f2ef3072bd41787306335eab364de9d199c145631fafd9de39df1eef9
+ languageName: node
+ linkType: hard
+
"motion@npm:10.16.2":
version: 10.16.2
resolution: "motion@npm:10.16.2"
@@ -8029,6 +8064,27 @@ __metadata:
languageName: node
linkType: hard
+"motion@npm:^11.12.0":
+ version: 11.13.1
+ resolution: "motion@npm:11.13.1"
+ dependencies:
+ framer-motion: "npm:^11.13.1"
+ tslib: "npm:^2.4.0"
+ peerDependencies:
+ "@emotion/is-prop-valid": "*"
+ react: ^18.0.0
+ react-dom: ^18.0.0
+ peerDependenciesMeta:
+ "@emotion/is-prop-valid":
+ optional: true
+ react:
+ optional: true
+ react-dom:
+ optional: true
+ checksum: 2b3b8f247a1a135d9460c94b80d85d5cf257d5a045c065abbbe4633997127243a16d3ac19c54fa014d1fc14ae8002c3a0ca73841df09a56a7814ce0465386aae
+ languageName: node
+ linkType: hard
+
"mri@npm:^1.2.0":
version: 1.2.0
resolution: "mri@npm:1.2.0"
@@ -8350,12 +8406,13 @@ __metadata:
version: 0.0.0-use.local
resolution: "onchainkit@workspace:."
dependencies:
- "@coinbase/onchainkit": "npm:0.35.8"
+ "@coinbase/onchainkit": "npm:0.36.0"
"@types/express": "npm:^4"
"@types/react": "npm:latest"
"@types/sitemap-generator": "npm:^8"
"@vercel/edge": "npm:^1.1.1"
express: "npm:^4.21.1"
+ motion: "npm:^11.12.0"
permissionless: "npm:^0.1.29"
react: "npm:18"
react-dom: "npm:18"
@@ -10418,6 +10475,13 @@ __metadata:
languageName: node
linkType: hard
+"tslib@npm:^2.4.0":
+ version: 2.8.1
+ resolution: "tslib@npm:2.8.1"
+ checksum: 9c4759110a19c53f992d9aae23aac5ced636e99887b51b9e61def52611732872ff7668757d4e4c61f19691e36f4da981cd9485e869b4a7408d689f6bf1f14e62
+ languageName: node
+ linkType: hard
+
"twoslash-protocol@npm:0.2.12":
version: 0.2.12
resolution: "twoslash-protocol@npm:0.2.12"
diff --git a/src/checkout/utils/getCommerceContracts.test.ts b/src/checkout/utils/getCommerceContracts.test.ts
index 1a2f8dc1d5..6e8f6b5e79 100644
--- a/src/checkout/utils/getCommerceContracts.test.ts
+++ b/src/checkout/utils/getCommerceContracts.test.ts
@@ -1,6 +1,6 @@
+import type { PayTransaction } from '@/core/api/types';
import { erc20Abi } from 'viem';
import { describe, expect, it } from 'vitest';
-import type { PayTransaction } from '../../api/types';
import { COMMERCE_ABI, CONTRACT_METHODS } from '../constants';
import { getCommerceContracts } from './getCommerceContracts';
diff --git a/src/core-react/OnchainKitProvider.test.tsx b/src/core-react/OnchainKitProvider.test.tsx
index d6a13e1e39..b5bc07fbe9 100644
--- a/src/core-react/OnchainKitProvider.test.tsx
+++ b/src/core-react/OnchainKitProvider.test.tsx
@@ -1,4 +1,7 @@
import '@testing-library/jest-dom';
+import { setOnchainKitConfig } from '@/core/OnchainKitConfig';
+import type { AppConfig } from '@/core/types';
+import type { EASSchemaUid } from '@/identity/types';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { render, screen, waitFor } from '@testing-library/react';
import { base } from 'viem/chains';
@@ -6,14 +9,12 @@ import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import { http, WagmiProvider, createConfig } from 'wagmi';
import { useConfig } from 'wagmi';
import { mock } from 'wagmi/connectors';
-import { setOnchainKitConfig } from '../core/OnchainKitConfig';
-import type { EASSchemaUid } from '../identity/types';
import { OnchainKitProvider } from './OnchainKitProvider';
import { useProviderDependencies } from './internal/hooks/useProviderDependencies';
import { useOnchainKit } from './useOnchainKit';
vi.mock('wagmi', async (importOriginal) => {
- const actual = await importOriginal();
+ const actual = (await importOriginal()) as typeof import('wagmi');
return {
...actual,
useConfig: vi.fn(),
@@ -50,12 +51,12 @@ const TestComponent = () => {
);
};
-vi.mock('../core/OnchainKitConfig', () => ({
+vi.mock('@/core/OnchainKitConfig', () => ({
setOnchainKitConfig: vi.fn(),
ONCHAIN_KIT_CONFIG: {
address: null,
apiKey: null,
- chain: base,
+ chain: { name: 'base', id: 8453 },
rpcUrl: null,
schemaId: null,
projectId: null,
@@ -275,7 +276,7 @@ describe('OnchainKitProvider', () => {
});
it('should use custom wallet config when provided', async () => {
- const customConfig = {
+ const customConfig: AppConfig = {
wallet: {
display: 'modal',
termsUrl: 'https://example.com/terms',
diff --git a/src/core-react/OnchainKitProvider.tsx b/src/core-react/OnchainKitProvider.tsx
index 0830ae55b8..4236212395 100644
--- a/src/core-react/OnchainKitProvider.tsx
+++ b/src/core-react/OnchainKitProvider.tsx
@@ -1,10 +1,11 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createContext, useMemo } from 'react';
import { WagmiProvider } from 'wagmi';
+
import {
ONCHAIN_KIT_CONFIG,
setOnchainKitConfig,
-} from '../core/OnchainKitConfig';
+} from '@/core/OnchainKitConfig';
import { DEFAULT_PRIVACY_URL, DEFAULT_TERMS_URL } from '../core/constants';
import { createWagmiConfig } from '../core/createWagmiConfig';
import type { OnchainKitContextType } from '../core/types';
diff --git a/src/core-react/internal/hooks/usePreferredColorScheme.test.ts b/src/core-react/internal/hooks/usePreferredColorScheme.test.ts
index fd0e54c7ad..f11e129911 100644
--- a/src/core-react/internal/hooks/usePreferredColorScheme.test.ts
+++ b/src/core-react/internal/hooks/usePreferredColorScheme.test.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck - more complex changes requried to fix this
import { act, renderHook } from '@testing-library/react';
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { usePreferredColorScheme } from './usePreferredColorScheme';
diff --git a/src/core/utils/checkHashLength.test.ts b/src/core/utils/checkHashLength.test.ts
index 03045f7eba..216b2bdcc6 100644
--- a/src/core/utils/checkHashLength.test.ts
+++ b/src/core/utils/checkHashLength.test.ts
@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
import { checkHashLength } from './checkHashLength';
describe('checkHashLength', () => {
diff --git a/src/core/utils/formatTokenAmount.test.ts b/src/core/utils/formatTokenAmount.test.ts
index 968fd09d1e..1c378a7b62 100644
--- a/src/core/utils/formatTokenAmount.test.ts
+++ b/src/core/utils/formatTokenAmount.test.ts
@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
import { formatTokenAmount } from './formatTokenAmount';
describe('formatTokenAmount', () => {
diff --git a/src/core/utils/getRoundedAmount.test.ts b/src/core/utils/getRoundedAmount.test.ts
index 67f51c80b5..6b02a37bf4 100644
--- a/src/core/utils/getRoundedAmount.test.ts
+++ b/src/core/utils/getRoundedAmount.test.ts
@@ -1,5 +1,5 @@
+import { describe, expect, it } from 'vitest';
import { getRoundedAmount } from './getRoundedAmount';
-
describe('getRoundedAmount', () => {
it('returns a rounded number with specified decimal places', () => {
const balance = '0.0002851826238227';
diff --git a/src/core/utils/isBase.test.ts b/src/core/utils/isBase.test.ts
index 9a071cd3f6..d441bf2bd3 100644
--- a/src/core/utils/isBase.test.ts
+++ b/src/core/utils/isBase.test.ts
@@ -1,5 +1,5 @@
+import { describe, expect, it } from 'vitest';
import { isBase } from './isBase';
-
const baseSepolia = { id: 84532 };
const base = { id: 8453 };
diff --git a/src/core/utils/isEthereum.test.ts b/src/core/utils/isEthereum.test.ts
index 9561350fa7..ddf4dc6434 100644
--- a/src/core/utils/isEthereum.test.ts
+++ b/src/core/utils/isEthereum.test.ts
@@ -1,6 +1,6 @@
import { mainnet, optimism, sepolia } from 'viem/chains';
+import { describe, expect, it } from 'vitest';
import { isEthereum } from './isEthereum';
-
describe('isEthereum', () => {
it('should return true for mainnet', () => {
expect(isEthereum({ chainId: mainnet.id })).toBeTruthy();
diff --git a/src/core/utils/isValidAmount.test.ts b/src/core/utils/isValidAmount.test.ts
index 84991e7d51..4c091457ce 100644
--- a/src/core/utils/isValidAmount.test.ts
+++ b/src/core/utils/isValidAmount.test.ts
@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
import { isValidAmount } from './isValidAmount';
describe('isValidAmount', () => {
diff --git a/src/identity/components/Avatar.test.tsx b/src/identity/components/Avatar.test.tsx
index adef4e38cc..885adb5b0b 100644
--- a/src/identity/components/Avatar.test.tsx
+++ b/src/identity/components/Avatar.test.tsx
@@ -50,6 +50,7 @@ describe('Avatar Component', () => {
it('should console.error and return null when no address is provided', () => {
vi.mocked(useIdentityContext).mockReturnValue({
+ // @ts-expect-error
address: undefined,
chain: undefined,
});
diff --git a/src/identity/components/EthBalance.test.tsx b/src/identity/components/EthBalance.test.tsx
index 9155a126c6..d86b135dc8 100644
--- a/src/identity/components/EthBalance.test.tsx
+++ b/src/identity/components/EthBalance.test.tsx
@@ -30,6 +30,7 @@ describe('EthBalance', () => {
const testEthBalanceComponentAddress = '0xEthBalanceComponentAddress';
it('should console.error and return null when no address is provided', () => {
vi.mocked(useIdentityContext).mockReturnValue({
+ // @ts-expect-error
address: undefined,
});
const consoleErrorSpy = vi
diff --git a/src/identity/components/IdentityCard.test.tsx b/src/identity/components/IdentityCard.test.tsx
index 275f214abc..7899a62f22 100644
--- a/src/identity/components/IdentityCard.test.tsx
+++ b/src/identity/components/IdentityCard.test.tsx
@@ -1,7 +1,7 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { render, screen, waitFor } from '@testing-library/react';
import type React from 'react';
-import { baseSepolia as sepolia } from 'viem/chains';
+import { goerli, baseSepolia as sepolia } from 'viem/chains';
import { beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
import type { Mock } from 'vitest';
import { OnchainKitProvider } from '../../core-react/OnchainKitProvider';
@@ -92,13 +92,7 @@ describe('IdentityCard', () => {
const renderWithProvider = (component: React.ReactNode) => {
return render(
-
- {component}
-
+ {component}
,
);
};
@@ -142,9 +136,7 @@ describe('IdentityCard', () => {
error: null,
} as ReturnType
);
- renderWithProvider(
- ,
- );
+ renderWithProvider();
await waitFor(() => {
expect(screen.getByTestId('ockAvatar_Image')).toBeInTheDocument();
});
@@ -160,7 +152,7 @@ describe('IdentityCard', () => {
});
it('truncates address when truncate prop is true', () => {
- renderWithProvider();
+ renderWithProvider();
expect(screen.getByText('0x1234...7890')).toBeInTheDocument();
});
@@ -171,13 +163,11 @@ describe('IdentityCard', () => {
error: null,
} as ReturnType);
- renderWithProvider(
- ,
- );
+ renderWithProvider();
expect(useNameMock).toHaveBeenCalledWith({
address: mockAddress,
- chain: { id: 5, name: 'Goerli' },
+ chain: goerli,
});
});
});
diff --git a/src/identity/components/IdentityProvider.test.tsx b/src/identity/components/IdentityProvider.test.tsx
index 586b1f6f8e..8c6a3b5984 100644
--- a/src/identity/components/IdentityProvider.test.tsx
+++ b/src/identity/components/IdentityProvider.test.tsx
@@ -39,7 +39,7 @@ describe('IdentityProvider', () => {
});
expect(result.current.address).toEqual(address);
expect(result.current.schemaId).toEqual(schemaId);
- expect(result.current.chain.id).toEqual(chain.id);
+ expect(result.current.chain?.id).toEqual(chain.id);
});
it('should return default context when no props are passed', () => {
@@ -48,7 +48,7 @@ describe('IdentityProvider', () => {
});
expect(result.current.address).toEqual('');
expect(result.current.schemaId).toEqual(undefined);
- expect(result.current.chain.id).toEqual(84532); // defaults to base
+ expect(result.current.chain?.id).toEqual(84532); // defaults to base
});
it('use onchainkit context chain if provided', () => {
@@ -65,7 +65,7 @@ describe('IdentityProvider', () => {
});
expect(result.current.address).toEqual('');
expect(result.current.schemaId).toEqual(undefined);
- expect(result.current.chain.id).toEqual(optimism.id);
+ expect(result.current.chain?.id).toEqual(optimism.id);
});
it('use identity context chain over onchainkit context if both are provided', () => {
@@ -82,6 +82,6 @@ describe('IdentityProvider', () => {
});
expect(result.current.address).toEqual('');
expect(result.current.schemaId).toEqual(undefined);
- expect(result.current.chain.id).toEqual(sepolia.id);
+ expect(result.current.chain?.id).toEqual(sepolia.id);
});
});
diff --git a/src/identity/components/Name.test.tsx b/src/identity/components/Name.test.tsx
index 49ab17e6b7..d53502b3ae 100644
--- a/src/identity/components/Name.test.tsx
+++ b/src/identity/components/Name.test.tsx
@@ -39,6 +39,7 @@ describe('Name', () => {
it('should console.error and return null when no address is provided', () => {
vi.mocked(useIdentityContext).mockReturnValue({
+ // @ts-expect-error
address: undefined,
chain: undefined,
});
diff --git a/src/identity/utils/getSocials.test.ts b/src/identity/utils/getSocials.test.ts
index 7d2268c89f..8083cd879d 100644
--- a/src/identity/utils/getSocials.test.ts
+++ b/src/identity/utils/getSocials.test.ts
@@ -1,4 +1,6 @@
-import { base, mainnet } from 'viem/chains';
+import { http } from 'viem';
+import { createPublicClient } from 'viem';
+import { base, mainnet, sepolia } from 'viem/chains';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { getChainPublicClient } from '../../core/network/getChainPublicClient';
import { isBase } from '../../core/utils/isBase';
@@ -10,7 +12,12 @@ vi.mock('../../core/utils/isEthereum');
vi.mock('../../core/network/getChainPublicClient');
describe('getSocials', () => {
+ const actualClient = createPublicClient({
+ chain: mainnet,
+ transport: http(),
+ });
const mockClient = {
+ ...actualClient,
getEnsText: vi.fn(),
};
@@ -84,7 +91,7 @@ describe('getSocials', () => {
vi.mocked(isBase).mockReturnValue(false);
vi.mocked(isEthereum).mockReturnValue(false);
- const unsupportedChain = { id: 123, name: 'Unsupported Chain' } as const;
+ const unsupportedChain = sepolia;
await expect(
getSocials({ ensName, chain: unsupportedChain }),
diff --git a/src/nft/components/NFTLifecycleProvider.test.tsx b/src/nft/components/NFTLifecycleProvider.test.tsx
index b88cbca545..cf386e9ada 100644
--- a/src/nft/components/NFTLifecycleProvider.test.tsx
+++ b/src/nft/components/NFTLifecycleProvider.test.tsx
@@ -2,7 +2,12 @@ import '@testing-library/jest-dom';
import { fireEvent, render } from '@testing-library/react';
import type { TransactionReceipt } from 'viem';
import { describe, expect, it, vi } from 'vitest';
-import { LifecycleType } from '../types';
+import {
+ type LifecycleStatus,
+ LifecycleType,
+ MediaType,
+ type NFTError,
+} from '../types';
import {
NFTLifecycleProvider,
useNFTLifecycleContext,
@@ -39,7 +44,7 @@ const TestComponent = () => {
context.updateLifecycleStatus({
statusName: 'mediaLoading',
statusData: {
- mimeType: 'image/png',
+ mediaType: MediaType.Image,
mediaUrl: 'https://example.com/image.png',
},
});
@@ -75,6 +80,11 @@ const renderWithProviders = ({
onError = vi.fn(),
onStatus = vi.fn(),
onSuccess = vi.fn(),
+}: {
+ Component: () => React.ReactNode;
+ onError?: (error: NFTError) => void;
+ onStatus?: (lifecycleStatus: LifecycleStatus) => void;
+ onSuccess?: (transactionReceipt?: TransactionReceipt) => void;
}) => {
return render(
({
vi.mock('../../../identity', async () => ({
...(await vi.importActual('../../../identity')),
- Identity: ({ className }) => Identity
,
+ Identity: ({ className }: { className: string }) => (
+ Identity
+ ),
}));
describe('NFTCreator', () => {
diff --git a/src/nft/components/mint/NFTMintButton.test.tsx b/src/nft/components/mint/NFTMintButton.test.tsx
index 759187dedc..548f02793e 100644
--- a/src/nft/components/mint/NFTMintButton.test.tsx
+++ b/src/nft/components/mint/NFTMintButton.test.tsx
@@ -33,12 +33,23 @@ vi.mock('../../../transaction', async (importOriginal) => {
return {
...(await importOriginal()),
TransactionLifecycleStatus: vi.fn(),
- TransactionButton: ({ text, disabled }) => (
+ TransactionButton: ({
+ text,
+ disabled,
+ }: { text: string; disabled: boolean }) => (
),
- Transaction: ({ onStatus, children, capabilities }) => (
+ Transaction: ({
+ onStatus,
+ children,
+ capabilities,
+ }: {
+ onStatus: (status: { statusName: string }) => void;
+ children: React.ReactNode;
+ capabilities: { paymasterService: { url: string } };
+ }) => (
<>
,
);
@@ -116,7 +120,7 @@ describe('SwapSettings', () => {
it('should handle non-valid React elements as children', async () => {
render(
-
+ Title
Plain text child
,
diff --git a/src/swap/components/SwapSettingsSlippageDescription.test.tsx b/src/swap/components/SwapSettingsSlippageDescription.test.tsx
index e5fa5dfe05..b54a377cf0 100644
--- a/src/swap/components/SwapSettingsSlippageDescription.test.tsx
+++ b/src/swap/components/SwapSettingsSlippageDescription.test.tsx
@@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest';
import { SwapSettingsSlippageDescription } from './SwapSettingsSlippageDescription';
vi.mock('../../styles/theme', async (importOriginal) => {
- const actual = await importOriginal();
+ const actual = await importOriginal();
return {
...actual,
cn: (...args: string[]) => args.join(' '),
@@ -45,10 +45,14 @@ describe('SwapSettingsSlippageDescription', () => {
});
it('renders without children', () => {
- const { container } = render();
+ const { container } = render(
+
+ Description
+ ,
+ );
const paragraph = container.querySelector('p');
expect(paragraph).toBeInTheDocument();
- expect(paragraph?.textContent).toBe('');
+ expect(paragraph?.textContent).toBe('Description');
});
it('renders with complex children', () => {
diff --git a/src/swap/components/SwapSettingsSlippageLayout.test.tsx b/src/swap/components/SwapSettingsSlippageLayout.test.tsx
index 3723f45b8b..341bf8aa09 100644
--- a/src/swap/components/SwapSettingsSlippageLayout.test.tsx
+++ b/src/swap/components/SwapSettingsSlippageLayout.test.tsx
@@ -25,7 +25,7 @@ vi.mock('./SwapSettingsSlippageInput', () => ({
}));
vi.mock('../styles/theme', () => ({
- cn: (...args) => args.join(' '),
+ cn: (...args: string[]) => args.join(' '),
background: { default: 'bg-default' },
border: { default: 'border-default' },
pressable: { shadow: 'pressable-shadow' },
diff --git a/src/swap/components/SwapSettingsSlippageLayoutBottomSheet.test.tsx b/src/swap/components/SwapSettingsSlippageLayoutBottomSheet.test.tsx
index f0e359d288..4fa73e04fa 100644
--- a/src/swap/components/SwapSettingsSlippageLayoutBottomSheet.test.tsx
+++ b/src/swap/components/SwapSettingsSlippageLayoutBottomSheet.test.tsx
@@ -25,7 +25,7 @@ vi.mock('./SwapSettingsSlippageInput', () => ({
}));
vi.mock('../styles/theme', () => ({
- cn: (...args) => args.join(' '),
+ cn: (...args: string[]) => args.join(' '),
background: { default: 'bg-default' },
border: { default: 'border-default' },
pressable: { shadow: 'pressable-shadow' },
@@ -60,8 +60,12 @@ describe('SwapSettingsSlippageLayoutBottomSheet', () => {
expect(container.className).toContain('custom-class');
});
- it('renders without any child components', () => {
- render();
+ it('renders without any valid child components', () => {
+ render(
+
+ test
+ ,
+ );
expect(
screen.getByTestId('ockSwapSettingsLayout_container'),
).toBeInTheDocument();
diff --git a/src/swap/components/SwapSettingsSlippageTitle.test.tsx b/src/swap/components/SwapSettingsSlippageTitle.test.tsx
index a124fd035d..4193369519 100644
--- a/src/swap/components/SwapSettingsSlippageTitle.test.tsx
+++ b/src/swap/components/SwapSettingsSlippageTitle.test.tsx
@@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest';
import { SwapSettingsSlippageTitle } from './SwapSettingsSlippageTitle';
vi.mock('../styles/theme', () => ({
- cn: (...args) => args.join(' '),
+ cn: (...args: string[]) => args.join(' '),
color: { foreground: 'text-foreground' },
}));
@@ -36,11 +36,13 @@ describe('SwapSettingsSlippageTitle', () => {
);
});
- it('renders without children', () => {
- const { container } = render();
+ it('renders without valid children', () => {
+ const { container } = render(
+ test,
+ );
const heading = container.querySelector('h3');
expect(heading).toBeInTheDocument();
- expect(heading?.textContent).toBe('');
+ expect(heading?.textContent).toBe('test');
});
it('renders with complex children', () => {
diff --git a/src/swap/components/SwapToast.test.tsx b/src/swap/components/SwapToast.test.tsx
index 7282f7dccd..49153dc2b8 100644
--- a/src/swap/components/SwapToast.test.tsx
+++ b/src/swap/components/SwapToast.test.tsx
@@ -1,6 +1,6 @@
import { fireEvent, render, screen } from '@testing-library/react';
import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
-import { useAccount } from 'wagmi';
+import { type Config, type UseAccountReturnType, useAccount } from 'wagmi';
import { useSwapContext } from './SwapProvider';
import { SwapToast } from './SwapToast';
@@ -15,9 +15,11 @@ vi.mock('wagmi', () => ({
describe('SwapToast', () => {
beforeEach(() => {
vi.clearAllMocks();
+ // TODO: set up proper mock data
+ // @ts-ignore
vi.mocked(useAccount).mockReturnValue({
chainId: 8453,
- });
+ } as unknown as UseAccountReturnType);
});
it('does not render when not visible', () => {
@@ -83,9 +85,7 @@ describe('SwapToast', () => {
transactionId: 'test-id',
});
- const { container } = render(
- Test,
- );
+ const { container } = render();
const toastElement = container.firstChild as HTMLElement;
expect(toastElement).toHaveClass('top-[100px] left-3/4');
@@ -101,9 +101,7 @@ describe('SwapToast', () => {
transactionId: 'test-id',
});
- const { container } = render(
- Test,
- );
+ const { container } = render();
const toastElement = container.firstChild as HTMLElement;
expect(toastElement).toHaveClass('top-[100px] left-2/4');
@@ -119,7 +117,7 @@ describe('SwapToast', () => {
transactionId: 'test-id',
});
- const { container } = render(Test);
+ const { container } = render();
const toastElement = container.firstChild as HTMLElement;
expect(toastElement).toHaveClass('bottom-5 left-2/4');
diff --git a/src/swap/components/SwapToggleButton.test.tsx b/src/swap/components/SwapToggleButton.test.tsx
index 83129dc122..6ab4624b81 100644
--- a/src/swap/components/SwapToggleButton.test.tsx
+++ b/src/swap/components/SwapToggleButton.test.tsx
@@ -1,5 +1,5 @@
import { fireEvent, render, screen } from '@testing-library/react';
-import { describe, it, vi } from 'vitest';
+import { type Mock, describe, expect, it, vi } from 'vitest';
import { useSwapContext } from './SwapProvider';
import { SwapToggleButton } from './SwapToggleButton';
@@ -10,7 +10,7 @@ vi.mock('./SwapProvider', () => ({
describe('SwapToggleButton', () => {
it('should call handleToggle when clicked', () => {
const handleToggleMock = vi.fn();
- (useSwapContext as jest.Mock).mockReturnValue({
+ (useSwapContext as Mock).mockReturnValue({
handleToggle: handleToggleMock,
});
render();
diff --git a/src/swap/hooks/useAwaitCalls.test.ts b/src/swap/hooks/useAwaitCalls.test.ts
index c5ae5b8296..b56eaf0169 100644
--- a/src/swap/hooks/useAwaitCalls.test.ts
+++ b/src/swap/hooks/useAwaitCalls.test.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck - more complex changes required
import { act, renderHook } from '@testing-library/react';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { waitForTransactionReceipt } from 'wagmi/actions';
diff --git a/src/swap/hooks/useResetInputs.test.ts b/src/swap/hooks/useResetInputs.test.ts
index b7e296e557..c743e825dc 100644
--- a/src/swap/hooks/useResetInputs.test.ts
+++ b/src/swap/hooks/useResetInputs.test.ts
@@ -1,6 +1,6 @@
import { act, renderHook } from '@testing-library/react';
import { beforeEach, describe, expect, it, vi } from 'vitest';
-import type { SwapUnit } from '../types';
+import type { FromTo, SwapUnit } from '../types';
import { useResetInputs } from './useResetInputs';
describe('useResetInputs', () => {
@@ -19,7 +19,7 @@ describe('useResetInputs', () => {
loading: false,
setLoading: vi.fn(),
error: undefined,
- };
+ } as unknown as SwapUnit;
const mockTo: SwapUnit = {
balance: '200',
balanceResponse: mockToTokenResponse,
@@ -31,7 +31,7 @@ describe('useResetInputs', () => {
loading: false,
setLoading: vi.fn(),
error: undefined,
- };
+ } as unknown as SwapUnit;
beforeEach(() => {
vi.clearAllMocks();
@@ -78,7 +78,7 @@ describe('useResetInputs', () => {
...mockFrom,
balanceResponse: { refetch: vi.fn().mockResolvedValue(undefined) },
};
- rerender({ from: newMockFrom, to: mockTo });
+ rerender({ from: newMockFrom, to: mockTo } as unknown as FromTo);
expect(result.current).not.toBe(firstRender);
});
@@ -89,7 +89,7 @@ describe('useResetInputs', () => {
useResetInputs({
from: mockFromWithNullResponse,
to: mockToWithNullResponse,
- }),
+ } as unknown as FromTo),
);
await act(async () => {
await result.current();
diff --git a/src/swap/utils/getSwapMessage.test.ts b/src/swap/utils/getSwapMessage.test.ts
index 14ad62222a..2763908942 100644
--- a/src/swap/utils/getSwapMessage.test.ts
+++ b/src/swap/utils/getSwapMessage.test.ts
@@ -6,6 +6,7 @@ import {
USER_REJECTED_ERROR_CODE,
} from '../constants';
import { ETH_TOKEN, USDC_TOKEN } from '../mocks';
+import type { GetSwapMessageParams } from '../types';
/**
* @vitest-environment node
*/
@@ -46,7 +47,7 @@ describe('getSwapMessage', () => {
...baseParams.from,
error: { code: 'some_code', error: 'some error' },
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.BALANCE_ERROR);
const params2 = {
@@ -55,7 +56,7 @@ describe('getSwapMessage', () => {
...baseParams.to,
error: { code: 'some_code', error: 'some error' },
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params2)).toBe(SwapMessage.BALANCE_ERROR);
});
@@ -63,7 +64,7 @@ describe('getSwapMessage', () => {
const params = {
...baseParams,
from: { ...baseParams.from, balance: '10', amount: '20' },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.INSUFFICIENT_BALANCE);
});
@@ -71,7 +72,7 @@ describe('getSwapMessage', () => {
const params = {
...baseParams,
lifecycleStatus: { statusName: 'transactionPending', statusData: null },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.CONFIRM_IN_WALLET);
});
@@ -79,7 +80,7 @@ describe('getSwapMessage', () => {
const params = {
...baseParams,
lifecycleStatus: { statusName: 'transactionApproved', statusData: null },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.SWAP_IN_PROGRESS);
});
@@ -87,13 +88,13 @@ describe('getSwapMessage', () => {
const params = {
...baseParams,
from: { ...baseParams.from, loading: true },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.FETCHING_QUOTE);
const params2 = {
...baseParams,
to: { ...baseParams.to, loading: true },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params2)).toBe(SwapMessage.FETCHING_QUOTE);
});
@@ -104,7 +105,7 @@ describe('getSwapMessage', () => {
statusName: 'init',
statusData: { isMissingRequiredField: true },
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.INCOMPLETE_FIELD);
});
@@ -126,7 +127,7 @@ describe('getSwapMessage', () => {
message: '',
},
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.TOO_MANY_REQUESTS);
});
@@ -148,7 +149,7 @@ describe('getSwapMessage', () => {
message: '',
},
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.LOW_LIQUIDITY);
});
@@ -170,7 +171,7 @@ describe('getSwapMessage', () => {
message: '',
},
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe(SwapMessage.USER_REJECTED);
});
@@ -192,7 +193,7 @@ describe('getSwapMessage', () => {
message: '',
},
},
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe('');
});
@@ -206,7 +207,7 @@ describe('getSwapMessage', () => {
token: ETH_TOKEN,
},
to: { ...baseParams.to, amount: '5', token: USDC_TOKEN },
- };
+ } as unknown as GetSwapMessageParams;
expect(getSwapMessage(params)).toBe('');
});
});
diff --git a/src/swap/utils/processSwapTransaction.test.ts b/src/swap/utils/processSwapTransaction.test.ts
index cbbedba8e8..173ff7730f 100644
--- a/src/swap/utils/processSwapTransaction.test.ts
+++ b/src/swap/utils/processSwapTransaction.test.ts
@@ -62,7 +62,7 @@ describe('processSwapTransaction', () => {
hasHighPriceImpact: false,
slippage: '3',
},
- };
+ } as unknown as BuildSwapTransaction;
await processSwapTransaction({
chainId: 1, // Different from base.id (8453)
config,
@@ -103,7 +103,7 @@ describe('processSwapTransaction', () => {
hasHighPriceImpact: false,
slippage: '3',
},
- };
+ } as unknown as BuildSwapTransaction;
await processSwapTransaction({
chainId: base.id, // Same as base.id (8453)
config,
@@ -150,7 +150,7 @@ describe('processSwapTransaction', () => {
hasHighPriceImpact: false,
slippage: '3',
},
- };
+ } as unknown as BuildSwapTransaction;
await processSwapTransaction({
chainId: base.id,
config,
@@ -209,7 +209,7 @@ describe('processSwapTransaction', () => {
hasHighPriceImpact: false,
slippage: '3',
},
- };
+ } as unknown as BuildSwapTransaction;
await processSwapTransaction({
chainId: base.id,
config,
diff --git a/src/transaction/components/Transaction.test.tsx b/src/transaction/components/Transaction.test.tsx
index 1ed74a7f3d..db4d6529fd 100644
--- a/src/transaction/components/Transaction.test.tsx
+++ b/src/transaction/components/Transaction.test.tsx
@@ -1,13 +1,21 @@
import { render, screen } from '@testing-library/react';
import { base, baseSepolia } from 'viem/chains';
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import {
+ type Mock,
+ afterEach,
+ beforeEach,
+ describe,
+ expect,
+ it,
+ vi,
+} from 'vitest';
import { useOnchainKit } from '../../core-react/useOnchainKit';
import { Transaction } from './Transaction';
import { TransactionProvider } from './TransactionProvider';
function mock(func: T) {
- return func as vi.Mock;
+ return func as Mock;
}
vi.mock('./TransactionProvider', () => ({
diff --git a/src/transaction/components/TransactionDefault.test.tsx b/src/transaction/components/TransactionDefault.test.tsx
index 7880517df0..56392047d4 100644
--- a/src/transaction/components/TransactionDefault.test.tsx
+++ b/src/transaction/components/TransactionDefault.test.tsx
@@ -1,8 +1,11 @@
import { render, screen } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
+import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import { useAccount, useSwitchChain } from 'wagmi';
import { useShowCallsStatus } from 'wagmi/experimental';
-import type { TransactionDefaultReact } from '../types';
+import type {
+ TransactionDefaultReact,
+ TransactionProviderReact,
+} from '../types';
import { TransactionDefault } from './TransactionDefault';
import { useTransactionContext } from './TransactionProvider';
@@ -35,7 +38,7 @@ vi.mock('wagmi', async (importOriginal) => {
});
vi.mock('./TransactionProvider', () => ({
- TransactionProvider: ({ children }) => (
+ TransactionProvider: ({ children }: TransactionProviderReact) => (
{children}
),
useTransactionContext: vi.fn(),
@@ -60,6 +63,8 @@ describe('TransactionDefault Component', () => {
};
beforeEach(() => {
+ // TODO: fix this by using actual account and spreading it
+ // @ts-ignore
vi.mocked(useAccount).mockReturnValue({
address: '0x123',
});
diff --git a/src/transaction/components/TransactionProvider.test.tsx b/src/transaction/components/TransactionProvider.test.tsx
index fe7226e98f..906e602fa7 100644
--- a/src/transaction/components/TransactionProvider.test.tsx
+++ b/src/transaction/components/TransactionProvider.test.tsx
@@ -1,5 +1,7 @@
+// @ts-nocheck -- made simple fixes for now, will fix rest later
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { base } from 'viem/chains';
+import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import {
useAccount,
useSwitchChain,
@@ -65,14 +67,18 @@ const TestComponent = () => {
const handleStatusError = async () => {
context.setLifecycleStatus({
statusName: 'error',
- statusData: { code: 'code', error: 'error_long_messages' },
+ statusData: {
+ code: 'code',
+ error: 'error_long_messages',
+ message: 'error_long_messages',
+ },
});
};
const handleStatusTransactionLegacyExecuted = async () => {
context.setLifecycleStatus({
statusName: 'transactionLegacyExecuted',
statusData: {
- transactionHashList: ['hash12345678'],
+ transactionHashList: ['0xhash12345678'],
},
});
};
@@ -81,7 +87,7 @@ const TestComponent = () => {
await context.setLifecycleStatus({
statusName: 'transactionLegacyExecuted',
statusData: {
- transactionHashList: ['hash12345678', 'hash12345678'],
+ transactionHashList: ['0xhash12345678', '0xhash12345678'],
},
});
};
@@ -151,7 +157,7 @@ describe('TransactionProvider', () => {
it('should emit onError when setLifecycleStatus is called with error', async () => {
const onErrorMock = vi.fn();
render(
-
+
,
);
@@ -163,7 +169,7 @@ describe('TransactionProvider', () => {
it('should emit onStatus when setLifecycleStatus is called with transactionLegacyExecuted', async () => {
const onStatusMock = vi.fn();
render(
-
+
,
);
@@ -174,7 +180,7 @@ describe('TransactionProvider', () => {
expect(onStatusMock).toHaveBeenCalledWith({
statusName: 'transactionLegacyExecuted',
statusData: {
- transactionHashList: ['hash12345678'],
+ transactionHashList: ['0xhash12345678'],
},
});
});
@@ -182,7 +188,7 @@ describe('TransactionProvider', () => {
it('should emit onStatus when setLifecycleStatus is called', async () => {
const onStatusMock = vi.fn();
render(
-
+
,
);
@@ -201,6 +207,7 @@ describe('TransactionProvider', () => {
});
render(
@@ -253,7 +260,11 @@ describe('TransactionProvider', () => {
const onErrorMock = vi.fn();
const contracts = () => Promise.reject(new Error('error'));
render(
-
+
,
);
@@ -316,7 +327,7 @@ describe('TransactionProvider', () => {
auxiliaryFunds: { supported: true },
});
render(
-
+
,
);
@@ -337,7 +348,7 @@ describe('TransactionProvider', () => {
writeContractsAsync: writeContractsAsyncMock,
});
render(
-
+
,
);
@@ -362,7 +373,7 @@ describe('TransactionProvider', () => {
sendWalletTransactionsMock,
);
render(
-
+
,
);
@@ -387,7 +398,7 @@ describe('TransactionProvider', () => {
auxiliaryFunds: { supported: true },
});
render(
-
+
,
);
@@ -426,7 +437,7 @@ describe('TransactionProvider', () => {
writeContractsAsync: vi.fn().mockRejectedValue(new Error('Test error')),
});
render(
-
+
,
);
@@ -458,7 +469,7 @@ describe('TransactionProvider', () => {
auxiliaryFunds: { supported: true },
});
render(
-
+
,
);
@@ -491,7 +502,7 @@ describe('TransactionProvider', () => {
it('should set transactions based on contracts', async () => {
const contracts = [{ address: '0x123', method: 'method' }];
render(
-
+
,
);
@@ -504,7 +515,7 @@ describe('TransactionProvider', () => {
it('should set transactions based on calls', async () => {
const calls = [{ to: '0x456', data: '0xabcdef' }];
render(
-
+
,
);
@@ -518,7 +529,7 @@ describe('TransactionProvider', () => {
const restore = silenceError();
expect(() => {
render(
-
+
Test
,
);
@@ -532,7 +543,7 @@ describe('TransactionProvider', () => {
const restore = silenceError();
expect(() => {
render(
-
+
Test
,
);
@@ -561,7 +572,11 @@ describe('TransactionProvider', () => {
writeContractsAsync: mockWriteContractsAsync,
});
render(
-
+
,
);
diff --git a/src/transaction/hooks/useCallsStatus.test.ts b/src/transaction/hooks/useCallsStatus.test.ts
index 3cf3df6bc0..9639e53c63 100644
--- a/src/transaction/hooks/useCallsStatus.test.ts
+++ b/src/transaction/hooks/useCallsStatus.test.ts
@@ -18,7 +18,12 @@ describe('useCallsStatus', () => {
(useCallsStatusWagmi as ReturnType).mockReturnValue({
data: mockData,
});
- const { result } = renderHook(() => useCallsStatus({ transactionId }));
+ const { result } = renderHook(() =>
+ useCallsStatus({
+ setLifecycleStatus: vi.fn(),
+ transactionId,
+ }),
+ );
expect(result.current.status).toBe('CONFIRMED');
expect(result.current.transactionHash).toBe('0x123');
});
@@ -63,7 +68,12 @@ describe('useCallsStatus', () => {
},
);
- renderHook(() => useCallsStatus({ transactionId }));
+ renderHook(() =>
+ useCallsStatus({
+ setLifecycleStatus: vi.fn(),
+ transactionId,
+ }),
+ );
});
it('should set refetchInterval to false when status is CONFIRMED', () => {
@@ -82,7 +92,12 @@ describe('useCallsStatus', () => {
},
);
- renderHook(() => useCallsStatus({ transactionId }));
+ renderHook(() =>
+ useCallsStatus({
+ setLifecycleStatus: vi.fn(),
+ transactionId,
+ }),
+ );
});
it('should not fetch data when transactionId is not provided', () => {
@@ -96,7 +111,7 @@ describe('useCallsStatus', () => {
const { result } = renderHook(() =>
useCallsStatus({
setLifecycleStatus: mockSetLifecycleStatus,
- transactionId: undefined,
+ transactionId: '',
}),
);
diff --git a/src/transaction/hooks/useSendWalletTransactions.test.tsx b/src/transaction/hooks/useSendWalletTransactions.test.tsx
index d471188270..0fc084dd28 100644
--- a/src/transaction/hooks/useSendWalletTransactions.test.tsx
+++ b/src/transaction/hooks/useSendWalletTransactions.test.tsx
@@ -1,3 +1,4 @@
+import type { Call } from '@/transaction/types';
import { renderHook } from '@testing-library/react';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { sendBatchedTransactions } from '../utils/sendBatchedTransactions';
@@ -14,7 +15,7 @@ describe('useSendWalletTransactions', () => {
});
it('should handle batched transactions', async () => {
- const transactions = [{ to: '0x123', data: '0x456' }];
+ const transactions: Call[] = [{ to: '0x123', data: '0x456' }];
const capabilities = {};
const { result } = renderHook(() =>
useSendWalletTransactions({
@@ -37,7 +38,7 @@ describe('useSendWalletTransactions', () => {
});
it('should handle non-batched transactions', async () => {
- const transactions = [
+ const transactions: Call[] = [
{ to: '0x123', data: '0x456' },
{ to: '0x789', data: '0xabc' },
];
@@ -61,7 +62,7 @@ describe('useSendWalletTransactions', () => {
});
it('should handle a transactions promise', async () => {
- const transactions = [{ to: '0x123', data: '0x456' }];
+ const transactions: Call[] = [{ to: '0x123', data: '0x456' }];
const capabilities = {};
const { result } = renderHook(() =>
useSendWalletTransactions({
@@ -98,7 +99,7 @@ describe('useSendWalletTransactions', () => {
});
it('should handle empty walletCapabilities', async () => {
- const transactions = [
+ const transactions: Call[] = [
{ to: '0x123', data: '0x456' },
{ to: '0x789', data: '0xabc' },
];
diff --git a/src/transaction/hooks/useWriteContracts.test.ts b/src/transaction/hooks/useWriteContracts.test.ts
index 53272a3753..841fe818bf 100644
--- a/src/transaction/hooks/useWriteContracts.test.ts
+++ b/src/transaction/hooks/useWriteContracts.test.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck - investigate wagmi types
import { renderHook } from '@testing-library/react';
import type { TransactionExecutionError } from 'viem';
import { beforeEach, describe, expect, it, vi } from 'vitest';
diff --git a/src/transaction/utils/getPaymasterUrl.test.ts b/src/transaction/utils/getPaymasterUrl.test.ts
index 908c167da3..f048eefef6 100644
--- a/src/transaction/utils/getPaymasterUrl.test.ts
+++ b/src/transaction/utils/getPaymasterUrl.test.ts
@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
import { getPaymasterUrl } from './getPaymasterUrl';
describe('getPaymasterUrl', () => {
@@ -7,6 +8,7 @@ describe('getPaymasterUrl', () => {
});
it('should return null if capabilities is null', () => {
+ // @ts-expect-error - testing null
const result = getPaymasterUrl(null);
expect(result).toEqual(null);
});
diff --git a/src/transaction/utils/sendBatchedTransactions.test.ts b/src/transaction/utils/sendBatchedTransactions.test.ts
index 4fe5f96bb9..e84d5e0bd3 100644
--- a/src/transaction/utils/sendBatchedTransactions.test.ts
+++ b/src/transaction/utils/sendBatchedTransactions.test.ts
@@ -1,10 +1,15 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { sendBatchedTransactions } from './sendBatchedTransactions';
+import type { SendBatchedTransactionsParams } from '@/transaction/types';
+import { erc20Abi } from 'viem';
+
describe('sendBatchedTransactions', () => {
const mockSendCallsAsync = vi.fn();
- const mockTransactions = [];
- const mockCapabilities = { paymasterService: '' };
+ const mockTransactions: SendBatchedTransactionsParams['transactions'] = [];
+ const mockCapabilities: SendBatchedTransactionsParams['capabilities'] = {
+ paymasterService: { url: '' },
+ };
beforeEach(() => {
vi.clearAllMocks();
@@ -44,23 +49,25 @@ describe('sendBatchedTransactions', () => {
await sendBatchedTransactions({
capabilities: mockCapabilities,
sendCallsAsync: mockSendCallsAsync,
- transactions: [{ address: '0x123', abi: '123' }],
+ transactions: [
+ { address: '0x123', abi: erc20Abi, functionName: 'transfer' },
+ ],
});
- expect(mockSendCallsAsync).toHaveBeenCalled({
- Capabilities: mockCapabilities,
- calls: [{ to: '0x123', abi: '123' }],
+ expect(mockSendCallsAsync).toHaveBeenCalledWith({
+ capabilities: mockCapabilities,
+ calls: [{ to: '0x123', abi: erc20Abi, functionName: 'transfer' }],
});
});
- it('should transform not transform call', async () => {
+ it('should not transform calls', async () => {
await sendBatchedTransactions({
capabilities: mockCapabilities,
sendCallsAsync: mockSendCallsAsync,
- transactions: [{ to: '0x123', data: '123' }],
+ transactions: [{ to: '0x123', data: '0x123' }],
});
- expect(mockSendCallsAsync).toHaveBeenCalled({
- Capabilities: mockCapabilities,
- calls: [{ to: '0x123', data: '123' }],
+ expect(mockSendCallsAsync).toHaveBeenCalledWith({
+ capabilities: mockCapabilities,
+ calls: [{ to: '0x123', data: '0x123' }],
});
});
});
diff --git a/src/transaction/utils/sendSingleTransactions.test.ts b/src/transaction/utils/sendSingleTransactions.test.ts
index 41970c9539..4d44f9a35a 100644
--- a/src/transaction/utils/sendSingleTransactions.test.ts
+++ b/src/transaction/utils/sendSingleTransactions.test.ts
@@ -1,11 +1,15 @@
-import { encodeFunctionData } from 'viem';
+import { encodeFunctionData, erc20Abi } from 'viem';
import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import type { Call } from '../types';
import { sendSingleTransactions } from './sendSingleTransactions';
-vi.mock('viem', () => ({
- encodeFunctionData: vi.fn(),
-}));
+vi.mock('viem', async (importOriginal) => {
+ const actual = await importOriginal();
+ return {
+ ...actual,
+ encodeFunctionData: vi.fn(),
+ };
+});
describe('sendSingleTransactions', () => {
const mockSendCallAsync = vi.fn();
@@ -60,7 +64,9 @@ describe('sendSingleTransactions', () => {
it('should transform contracts to calls', async () => {
await sendSingleTransactions({
sendCallAsync: mockSendCallAsync,
- transactions: [{ abi: '123', address: '0x123' }],
+ transactions: [
+ { abi: erc20Abi, address: '0x123', functionName: 'transfer' },
+ ],
});
expect(mockSendCallAsync).toHaveBeenCalledWith({
data: '123',
diff --git a/src/ui/react/internal/hooks/useBreakpoints.test.ts b/src/ui/react/internal/hooks/useBreakpoints.test.ts
index b8a3731b6e..8634acf7ef 100644
--- a/src/ui/react/internal/hooks/useBreakpoints.test.ts
+++ b/src/ui/react/internal/hooks/useBreakpoints.test.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck - more involved changes required
import { act, renderHook } from '@testing-library/react';
import { describe, expect, it, vi } from 'vitest';
import { useBreakpoints } from './useBreakpoints';
diff --git a/src/version.ts b/src/version.ts
index a6da3e232c..70daa2e6ee 100644
--- a/src/version.ts
+++ b/src/version.ts
@@ -1 +1 @@
-export const version = '0.35.8';
+export const version = '0.36.0';
diff --git a/src/wallet/components/ConnectButton.test.tsx b/src/wallet/components/ConnectButton.test.tsx
index 83914319e1..536f437d02 100644
--- a/src/wallet/components/ConnectButton.test.tsx
+++ b/src/wallet/components/ConnectButton.test.tsx
@@ -1,11 +1,17 @@
import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { describe, expect, it, vi } from 'vitest';
import { ConnectButton } from './ConnectButton';
import { ConnectWalletText } from './ConnectWalletText';
describe('ConnectButton', () => {
it('should render connect button', () => {
- render();
+ render(
+ ,
+ );
const button = screen.getByTestId('ockConnectButton');
expect(button).toBeInTheDocument();
expect(button).toHaveTextContent('Connect Wallet');
@@ -17,6 +23,8 @@ describe('ConnectButton', () => {
connectWalletText={
Connect Dope Wallet
}
+ onClick={vi.fn()}
+ text="text"
/>,
);
const button = screen.getByTestId('ockConnectButton');
@@ -29,6 +37,8 @@ describe('ConnectButton', () => {
,
);
const button = screen.getByTestId('ockConnectButton');
diff --git a/src/wallet/components/ConnectWallet.test.tsx b/src/wallet/components/ConnectWallet.test.tsx
index 168bfc8948..f66d437493 100644
--- a/src/wallet/components/ConnectWallet.test.tsx
+++ b/src/wallet/components/ConnectWallet.test.tsx
@@ -1,3 +1,4 @@
+// @ts-nocheck -- will fix later as it'll require a lot of changes
import { fireEvent, render, screen } from '@testing-library/react';
import type { ReactNode } from 'react';
import { beforeEach, describe, expect, it, vi } from 'vitest';
diff --git a/src/wallet/components/Wallet.test.tsx b/src/wallet/components/Wallet.test.tsx
index 6cab7a1bf6..1e928c76e9 100644
--- a/src/wallet/components/Wallet.test.tsx
+++ b/src/wallet/components/Wallet.test.tsx
@@ -4,11 +4,11 @@ import { useOutsideClick } from '../../ui/react/internal/hooks/useOutsideClick';
import { ConnectWallet } from './ConnectWallet';
import { Wallet } from './Wallet';
import { WalletDropdown } from './WalletDropdown';
-import { useWalletContext } from './WalletProvider';
+import { type WalletProviderReact, useWalletContext } from './WalletProvider';
vi.mock('./WalletProvider', () => ({
useWalletContext: vi.fn(),
- WalletProvider: ({ children }) => <>{children},
+ WalletProvider: ({ children }: WalletProviderReact) => <>{children},
}));
vi.mock('./ConnectWallet', () => ({
@@ -67,7 +67,9 @@ describe('Wallet Component', () => {
render(
-
+
+ Wallet Dropdown
+
,
);
@@ -79,13 +81,15 @@ describe('Wallet Component', () => {
render(
-
+
+ Wallet Dropdown
+
,
);
expect(screen.getByTestId('wallet-dropdown')).toBeDefined();
- mockOutsideClickCallback();
+ mockOutsideClickCallback({} as MouseEvent);
expect(mockSetIsOpen).toHaveBeenCalledWith(false);
});
@@ -99,13 +103,15 @@ describe('Wallet Component', () => {
render(
-
+
+ Wallet Dropdown
+
,
);
expect(screen.queryByTestId('wallet-dropdown')).toBeNull();
- mockOutsideClickCallback();
+ mockOutsideClickCallback({} as MouseEvent);
expect(mockSetIsOpen).not.toHaveBeenCalled();
});
diff --git a/src/wallet/components/WalletDefault.test.tsx b/src/wallet/components/WalletDefault.test.tsx
index 091a4fe82d..d95f45302e 100644
--- a/src/wallet/components/WalletDefault.test.tsx
+++ b/src/wallet/components/WalletDefault.test.tsx
@@ -1,10 +1,10 @@
import { render, screen } from '@testing-library/react';
-import { type Mock, describe, expect, it, vi } from 'vitest';
+import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import { useAccount, useConnect } from 'wagmi';
import { useAvatar } from '../../identity/hooks/useAvatar';
import { useName } from '../../identity/hooks/useName';
import { WalletDefault } from './WalletDefault';
-import { useWalletContext } from './WalletProvider';
+import { type WalletProviderReact, useWalletContext } from './WalletProvider';
vi.mock('../../core-react/internal/hooks/useTheme', () => ({
useTheme: vi.fn(),
@@ -21,7 +21,7 @@ vi.mock('wagmi', () => ({
}));
vi.mock('./WalletProvider', () => ({
- WalletProvider: ({ children }) => (
+ WalletProvider: ({ children }: WalletProviderReact) => (
{children}
),
useWalletContext: vi.fn(),
diff --git a/src/wallet/components/WalletDropdownDisconnect.test.tsx b/src/wallet/components/WalletDropdownDisconnect.test.tsx
index d325c4e4d2..2a64f54ca2 100644
--- a/src/wallet/components/WalletDropdownDisconnect.test.tsx
+++ b/src/wallet/components/WalletDropdownDisconnect.test.tsx
@@ -1,5 +1,5 @@
import { fireEvent, render, screen } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
+import { type Mock, beforeEach, describe, expect, it, vi } from 'vitest';
import { useDisconnect } from 'wagmi';
import type { Connector } from 'wagmi';
import { WalletDropdownDisconnect } from './WalletDropdownDisconnect';
@@ -9,6 +9,7 @@ vi.mock('wagmi', () => ({
}));
describe('WalletDropdownDisconnect', () => {
+ // @ts-expect-error - will mock rest of connector later
const fakeConnectors: Connector[] = [{ id: 'mockConnector' }];
const mockUseDisconnect = useDisconnect as Mock;
const mockDisconnect = vi.fn();
diff --git a/src/wallet/components/WalletDropdownLink.test.tsx b/src/wallet/components/WalletDropdownLink.test.tsx
index cf6ce4eb06..e024b5ef8a 100644
--- a/src/wallet/components/WalletDropdownLink.test.tsx
+++ b/src/wallet/components/WalletDropdownLink.test.tsx
@@ -33,6 +33,8 @@ describe('WalletDropdownLink', () => {
it('renders correctly with custom icon element', () => {
const customIcon = ;
render(
+ // TODO: remove this once we fix WalletDropdownLinkReact type
+ // @ts-expect-error -- will fix later, don't want to update types in this PR
Link Text
,
diff --git a/src/wallet/components/WalletModal.test.tsx b/src/wallet/components/WalletModal.test.tsx
index c5c0b3cd24..ea3e2a78e3 100644
--- a/src/wallet/components/WalletModal.test.tsx
+++ b/src/wallet/components/WalletModal.test.tsx
@@ -2,6 +2,7 @@ import { fireEvent, render, screen } from '@testing-library/react';
import {
type Mock,
afterAll,
+ afterEach,
beforeAll,
beforeEach,
describe,
@@ -10,6 +11,7 @@ import {
vi,
} from 'vitest';
import { useConnect, useConnectors } from 'wagmi';
+import type { MetaMaskParameters } from 'wagmi/connectors';
import { useOnchainKit } from '../../core-react/useOnchainKit';
import { WalletModal } from './WalletModal';
@@ -24,7 +26,7 @@ vi.mock('../../core-react/useOnchainKit', () => ({
vi.mock('wagmi/connectors', () => ({
coinbaseWallet: () => ({ preference: 'all' }),
- metaMask: ({ dappMetadata }) => ({ dappMetadata }),
+ metaMask: ({ dappMetadata }: MetaMaskParameters) => ({ dappMetadata }),
}));
describe('WalletModal', () => {
diff --git a/src/wallet/components/WalletModal.tsx b/src/wallet/components/WalletModal.tsx
index d98e7509cb..2127bb586e 100644
--- a/src/wallet/components/WalletModal.tsx
+++ b/src/wallet/components/WalletModal.tsx
@@ -158,9 +158,8 @@ export function WalletModal({
border.lineDefault,
border.radius,
background.default,
- 'w-[323px] p-6 pb-4',
- 'flex flex-col items-center gap-4',
- 'relative',
+ 'w-[22rem] p-6 pb-4',
+ 'relative flex flex-col items-center gap-4',
'-translate-x-1/2 -translate-y-1/2 fixed top-1/2 left-1/2',
'transition-opacity duration-200',
isOpen ? 'opacity-100' : 'opacity-0',
@@ -189,7 +188,7 @@ export function WalletModal({
{(appLogo || appName) && (
-
+
{appLogo && (
![]()
)}
-
+