Hi Web3Auth team,
I’m experiencing an issue when trying to connect via MetaMask using Web3Auth. The wallet UI does not open, and I see the following error in the console:
Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received
-
SDK Version(package.json):
“@web3auth/modal”: “^9.7.0”,
“@web3auth/wallet-services-plugin”: “^9.7.0”, -
Browser Console Screenshots:
My code:
const name = 'myapp'
const chainConfig = {
chainNamespace: CHAIN_NAMESPACES.EIP155,
chainId: `0x${chain.id.toString(16)}`,
rpcTarget: chain.rpcUrls.default.http[0],
displayName: chain.name,
tickerName: chain.nativeCurrency?.name,
ticker: chain.nativeCurrency?.symbol,
blockExplorerUrl: chain.blockExplorers?.default.url[0] as string
}
const privateKeyProvider = new EthereumPrivateKeyProvider({ config: { chainConfig } })
const web3authOptions: Web3AuthOptions = {
clientId: WEB3AUTH_CLIENT_ID,
chainConfig,
privateKeyProvider,
uiConfig: {
appName: name,
defaultLanguage: 'en',
logoLight: `${window.location.origin}/logo.svg`,
logoDark: `${window.location.origin}/logo.svg`,
mode: 'auto'
},
web3AuthNetwork: 'sapphire_devnet',
enableLogging: true
}
const web3AuthModalInstance = new Web3Auth(web3authOptions)
const authAdapter = new AuthAdapter({
adapterSettings: {
uxMode: UX_MODE.POPUP
},
loginSettings: {
mfaLevel: 'optional'
},
privateKeyProvider
})
const injectedAdapters = getInjectedAdapters({ options: web3authOptions })
injectedAdapters.forEach((adapter: IAdapter<unknown>) => {
web3AuthModalInstance.configureAdapter(adapter)
})
const walletServicesPlugin = new WalletServicesPlugin({
walletInitOptions: {
whiteLabel: {
showWidgetButton: false,
appName: name
}
}
})
web3AuthModalInstance.addPlugin(walletServicesPlugin)
web3AuthModalInstance.configureAdapter(authAdapter)