Skip to content

Commit eac9aa4

Browse files
allan-almeida-imtblallan-almeida-imtbl
authored
fix(checkout-sdk): Unrecognized chain error handling (#2666)
1 parent 7101656 commit eac9aa4

8 files changed

Lines changed: 72 additions & 25 deletions

File tree

‎packages/checkout/sdk-sample-app/src/components/CheckConnection.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@ export default function CheckConnection(props: CheckConnectionProps) {
1818

1919
async function checkMyConnection() {
2020
if (!checkout) {
21-
console.error('missing checkout, please connect frist');
21+
console.error('missing checkout, please connect first');
2222
return;
2323
}
2424
if (!provider) {
25-
console.error('missing provider, please connect frist');
25+
console.error('missing provider, please connect first');
2626
return;
2727
}
2828

‎packages/checkout/sdk-sample-app/src/components/GetAllBalances.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@ export default function GetAllBalances(props: BalanceProps) {
1818

1919
async function getAllBalances() {
2020
if (!checkout) {
21-
console.error('missing checkout, please connect frist');
21+
console.error('missing checkout, please connect first');
2222
return;
2323
}
2424
if (!provider) {
25-
console.error('missing provider, please connect frist');
25+
console.error('missing provider, please connect first');
2626
return;
2727
}
2828
setError(null);

‎packages/checkout/sdk-sample-app/src/components/GetBalance.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,11 +24,11 @@ export default function GetBalance(props: BalanceProps) {
2424

2525
async function getNativeBalanceClick() {
2626
if (!checkout) {
27-
console.error('missing checkout, please connect frist');
27+
console.error('missing checkout, please connect first');
2828
return;
2929
}
3030
if (!provider) {
31-
console.error('missing provider, please connect frist');
31+
console.error('missing provider, please connect first');
3232
return;
3333
}
3434

@@ -55,11 +55,11 @@ export default function GetBalance(props: BalanceProps) {
5555

5656
async function getERC20BalanceClick() {
5757
if (!checkout) {
58-
console.error('missing checkout, please connect frist');
58+
console.error('missing checkout, please connect first');
5959
return;
6060
}
6161
if (!provider) {
62-
console.error('missing provider, please connect frist');
62+
console.error('missing provider, please connect first');
6363
return;
6464
}
6565

‎packages/checkout/sdk-sample-app/src/components/SendTransaction.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,11 +43,11 @@ export default function SendTransaction(props: SendTransactionProps) {
4343

4444
async function sendTxClick() {
4545
if (!checkout) {
46-
console.error('missing checkout, please connect frist');
46+
console.error('missing checkout, please connect first');
4747
return;
4848
}
4949
if (!provider) {
50-
console.error('missing provider, please connect frist');
50+
console.error('missing provider, please connect first');
5151
return;
5252
}
5353

‎packages/checkout/sdk-sample-app/src/components/SwitchNetwork.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -49,11 +49,11 @@ export default function SwitchNetwork(props: SwitchNetworkProps) {
4949

5050
const switchNetwork = useCallback(async(chainId: ChainId) => {
5151
if (!checkout) {
52-
console.error('missing checkout, please connect frist');
52+
console.error('missing checkout, please connect first');
5353
return;
5454
}
5555
if (!provider) {
56-
console.error('missing provider, please connect frist');
56+
console.error('missing provider, please connect first');
5757
return;
5858
}
5959

@@ -81,11 +81,11 @@ export default function SwitchNetwork(props: SwitchNetworkProps) {
8181

8282
async function getNetworkInfo() {
8383
if (!checkout) {
84-
console.error('missing checkout, please connect frist');
84+
console.error('missing checkout, please connect first');
8585
return;
8686
}
8787
if (!provider) {
88-
console.error('missing provider, please connect frist');
88+
console.error('missing provider, please connect first');
8989
return;
9090
}
9191

‎packages/checkout/sdk-sample-app/src/pages/ConnectWidget.tsx‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -20,16 +20,7 @@ export default function ConnectWidget() {
2020
}, [environment]);
2121
const [provider, setProvider] = useState<WrappedBrowserProvider>();
2222

23-
function toggleEnvironment() {
24-
if (environment === Environment.PRODUCTION) {
25-
setEnvironment(Environment.SANDBOX);
26-
} else {
27-
setEnvironment(Environment.PRODUCTION);
28-
}
29-
}
30-
31-
console.log('qwerqewrqwer')
32-
console.log(checkout.getInjectedProviders())
23+
console.log('injected providers:', checkout.getInjectedProviders())
3324

3425
return (
3526
<div>

‎packages/checkout/sdk/src/network/network.test.ts‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,13 @@ const unrecognisedChainError = {
5252
},
5353
};
5454

55+
const anotherUnrecognisedChainError = {
56+
error: {
57+
message: 'Provider error',
58+
code: 4902,
59+
},
60+
};
61+
5562
jest.mock('../api/http', () => ({
5663
// eslint-disable-next-line @typescript-eslint/naming-convention
5764
HttpClient: jest.fn().mockImplementation(() => ({
@@ -342,6 +349,54 @@ describe('network functions', () => {
342349
]);
343350
});
344351

352+
it('should request the user to add a new network when anotherUnrecognisedChainError is received', async () => {
353+
(WrappedBrowserProvider as unknown as jest.Mock)
354+
.mockReturnValueOnce({
355+
send: jest
356+
.fn()
357+
.mockRejectedValueOnce(anotherUnrecognisedChainError)
358+
.mockResolvedValueOnce({}),
359+
ethereumProvider: {
360+
isMetaMask: true,
361+
},
362+
getNetwork: jest.fn().mockResolvedValue(zkevmNetworkInfo),
363+
})
364+
.mockReturnValueOnce({
365+
send: jest.fn().mockResolvedValueOnce({}),
366+
ethereumProvider: {
367+
isMetaMask: true,
368+
},
369+
getNetwork: jest.fn().mockResolvedValue(zkevmNetworkInfo),
370+
});
371+
const { provider } = await createProvider(WalletProviderName.METAMASK);
372+
373+
await switchWalletNetwork(
374+
testCheckoutConfiguration,
375+
provider,
376+
ChainId.IMTBL_ZKEVM_TESTNET,
377+
);
378+
379+
expect(provider.send).toHaveBeenCalledWith(WalletAction.ADD_NETWORK, [
380+
{
381+
chainId: testCheckoutConfiguration.networkMap.get(
382+
ChainId.IMTBL_ZKEVM_TESTNET,
383+
)?.chainIdHex,
384+
chainName: testCheckoutConfiguration.networkMap.get(
385+
ChainId.IMTBL_ZKEVM_TESTNET,
386+
)?.chainName,
387+
rpcUrls: testCheckoutConfiguration.networkMap.get(
388+
ChainId.IMTBL_ZKEVM_TESTNET,
389+
)?.rpcUrls,
390+
nativeCurrency: testCheckoutConfiguration.networkMap.get(
391+
ChainId.IMTBL_ZKEVM_TESTNET,
392+
)?.nativeCurrency,
393+
blockExplorerUrls: testCheckoutConfiguration.networkMap.get(
394+
ChainId.IMTBL_ZKEVM_TESTNET,
395+
)?.blockExplorerUrls,
396+
},
397+
]);
398+
});
399+
345400
it('should throw an error when switch network is called with a passport provider', async () => {
346401
try {
347402
await switchWalletNetwork(

‎packages/checkout/sdk/src/network/network.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,8 @@ export async function getNetworkInfo(
136136
* You get "Error: could not coalesce error....".
137137
* This is a workaround to check if the error is an unrecognised chain error.
138138
* */
139-
const isUnrecognisedChainError = (err: any) => err.error?.data?.originalError?.code === UNRECOGNISED_CHAIN_ERROR_CODE;
139+
const isUnrecognisedChainError = (err: any) => err.error?.data?.originalError?.code === UNRECOGNISED_CHAIN_ERROR_CODE
140+
|| err.error?.code === UNRECOGNISED_CHAIN_ERROR_CODE;
140141

141142
export async function switchWalletNetwork(
142143
config: CheckoutConfiguration,

0 commit comments

Comments
 (0)