Skip to content

Commit

Permalink
test:Increase ConnectButton test coverage (#477)
Browse files Browse the repository at this point in the history
* test(connect-button): test coverage to 100%

* docs: update changest

* chore: Web3ConfigProvider
  • Loading branch information
thinkasany authored Jan 9, 2024
1 parent e8258aa commit f93aedf
Show file tree
Hide file tree
Showing 2 changed files with 98 additions and 0 deletions.
5 changes: 5 additions & 0 deletions .changeset/empty-goats-ring.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@ant-design/web3': patch
---

test:Increase ConnectButton test coverage
93 changes: 93 additions & 0 deletions packages/web3/src/connect-button/__tests__/connect.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
import React from 'react';
import { useProvider } from '@ant-design/web3';
import { fireEvent, render } from '@testing-library/react';
import { describe, expect, it, vi } from 'vitest';

import { ConnectButton, Web3ConfigProvider, type Account } from '../../../../web3/src';

describe('ConnectButton connect', async () => {
it('connect', async () => {
const CustomConnector = () => {
const { connect, account, disconnect } = useProvider();

return (
<ConnectButton
className="custom-btn"
account={account}
onConnectClick={() => {
if (account) {
disconnect?.();
return;
}
connect?.();
}}
onDisconnectClick={() => {
disconnect?.();
}}
/>
);
};

const App = () => {
const [account, setAccount] = React.useState<Account | undefined>();
return (
<Web3ConfigProvider
availableWallets={[
{
name: 'MetaMask',
remark: 'Easy-to-use browser extension.',
extensions: [
{
key: 'Chrome',
browserIcon:
'https://github.com/ant-design/ant-design/assets/10286961/0d4e4ac7-8f89-4147-a06a-de72c02e85cb',
browserName: 'Chrome',
link: 'https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn',
description: 'Access your wallet right from your favorite web browser.',
},
],
},
]}
connect={async () => {
const newAccount = {
address: '0x1234567890123456789012345678901234567890',
};
setAccount(newAccount);
}}
disconnect={async () => {
setAccount(undefined);
}}
account={account}
>
<CustomConnector />
</Web3ConfigProvider>
);
};
const { baseElement } = render(<App />);

fireEvent.click(baseElement.querySelector('.custom-btn')!);
await vi.waitFor(() => {
expect(baseElement.querySelector('.ant-web3-address-text')?.textContent).toBe(
'0x1234...7890',
);
});

fireEvent.click(baseElement.querySelector('.custom-btn')!);

const btns = baseElement.querySelectorAll('.ant-btn');
fireEvent.click(baseElement.querySelector('.ant-modal-close')!);

await vi.waitFor(() => {
expect(
baseElement.querySelector('.ant-web3-connect-button-profile-modal')?.className,
).toContain('ant-zoom-leave');
});

fireEvent.click(btns[2]);
await vi.waitFor(() => {
expect(baseElement.querySelector('.ant-web3-connect-button-text')?.textContent).toBe(
'Connect Wallet',
);
});
});
});

0 comments on commit f93aedf

Please sign in to comment.