Get provider with Ethers.js / Ethereum > React | Error : unsupported provider (argument="provider", value={}, code=INVALID_ARGUMENT, version=providers/5.6.0)

[Dansando8]

Hello there 🙂

If somebody had the same problem and may share some light it would be nice, thx!

When initializing web3auth, I did this as it's displayed on the documentation:

const web3authProvider = web3auth.connect();

const provider = new ethers.providers.Web3Provider(web3authProvider);

Then I get this error in the console:

Error: unsupported provider (argument="provider", value={}, code=INVALID_ARGUMENT, version=providers/5.6.0)

There is also a TypeScript error concerning the argument 'web3authProvider':

Argument of type 'Promise<SafeEventEmitterProvider | null>' is not assignable to parameter of type 'ExternalProvider | JsonRpcFetchFunc'.

Somebody managed to fix it ?

[Dansando8]

Oki there is a turnaround :

const provider = await new ethers.providers.Web3Provider( web3authProvider as any, );

Deactivating TypeScript passing the argument as any type.

Nevertheless it's not optimal. It kind of defeat the purpose of TS.

So web3auth team, is there any Type on the library for this. Or, will you add it soon? 🙂

thx!

[weekash]

@Dansando8

web3auth.connect(); actually returns a promise so you have to use it like
const web3authProvider = await web3auth.connect();
It will fix both, the error and typescript issue.