web3modal icon indicating copy to clipboard operation
web3modal copied to clipboard

[bug] Wallet disconnects immediately in Firefox (works fine in Chrome)

Open mustafaa-zaman opened this issue 1 month ago โ€ข 2 comments

Link to minimal reproducible example

https://home.pixpel.io/

Steps to Reproduce

Open Firefox (latest version). Click "Connect Wallet" โ†’ select MetaMask.

Observe the browser console:

AppKit briefly logs isConnected: true

Then immediately logs isConnected: false And displays:

ObjectMultiplex - orphaned data for stream "metamask-multichain-provider"

Repeat in Chrome: Connection works normally No re-disconnect No orphaned stream errors

Summary

"@reown/appkit": "^1.7.2", "@reown/appkit-adapter-ethers": "^1.7.2"

๐Ÿ”ง Code Snippet

config.ts

import { EthersAdapter } from "@reown/appkit-adapter-ethers"; import { avalanche, polygon, polygonAmoy, sei, skaleNebula, skaleNebulaTestnet } from "@reown/appkit/networks"; import type { AppKitNetwork } from "@reown/appkit/networks";

export const projectId = process.env.NEXT_PUBLIC_PROJECT_ID ;

if (!projectId) { throw new Error("Project ID is not defined"); }

export const networks = [ skaleNebula, skaleNebulaTestnet, polygonAmoy, avalanche, polygon, sei, ] as [AppKitNetwork, ...AppKitNetwork[]];

export const ethersAdapter = new EthersAdapter();

layout.tsx

import { ethersAdapter, networks, projectId } from "@/config/reown";

export const metadata = { name: "hidden", description: "hidden", url: "hidden", icons: ["./logo.svg"], };

export const modal = createAppKit({ adapters: [ethersAdapter], projectId, networks, defaultNetwork: networks[0], metadata, themeMode: "light", features: { analytics: true }, });

๐Ÿงช Firefox Console Logs ๐Ÿš€ ~ AppKitProvider ~ isConnected: true ๐Ÿš€ ~ AppKitProvider ~ state: { loading: true, open: false, selectedNetworkId: "eip155:80002", activeChain: "eip155", initialized: true }

๐Ÿš€ ~ AppKitProvider ~ walletInfo: { walletInfo: Proxy }

ObjectMultiplex - orphaned data for stream "metamask-multichain-provider"

๐Ÿš€ ~ AppKitProvider ~ walletInfo: { walletInfo: undefined }

๐Ÿš€ ~ AppKitProvider ~ isConnected: false

โŒ Actual Behavior

Wallet connects for a moment

Immediately disconnects

walletInfo becomes undefined

List of related npm package versions

"@reown/appkit": "^1.7.2", "@reown/appkit-adapter-ethers": "^1.7.2",

Node.js Version

22.15.0

Package Manager

11.6.1

mustafaa-zaman avatar Nov 24 '25 10:11 mustafaa-zaman

APKT-4295

linear[bot] avatar Nov 24 '25 10:11 linear[bot]

Hi @mustafaa-zaman,

This is a known Firefox-specific issue with MetaMask's multichain provider. The error ObjectMultiplex - orphaned data for stream 'metamask-multichain-provider' is a Firefox compatibility issue.

Root Cause: Firefox handles MetaMask's multichain provider streams differently than Chrome, causing the connection to be established and then immediately dropped.

Potential Solutions:

  1. Update to latest versions (you're on 1.7.2, current is 1.8.13):
npm install @reown/appkit@latest @reown/appkit-adapter-ethers@latest
  1. Add Firefox-specific configuration:
const modal = createAppKit({
  adapters: [ethersAdapter],
  projectId,
  networks,
  defaultNetwork: networks[0],
  metadata,
  themeMode: "light",
  features: { analytics: true },
  // Add Firefox-specific options
  enableWalletConnect: true,
  enableInjected: true,
  enableCoinbase: false // Disable problematic providers in Firefox
});
  1. Browser detection workaround:
const isFirefox = navigator.userAgent.toLowerCase().includes('firefox');

const modal = createAppKit({
  // ... your config
  features: { 
    analytics: true,
    // Disable certain features in Firefox
    ...(isFirefox && { multiChain: false })
  }
});

Temporary Workaround: For now, you might want to show a browser compatibility notice for Firefox users and recommend Chrome/Edge for the best experience.

This issue should be resolved in future AppKit versions as Firefox compatibility improves. ๐ŸฆŠ

wearedood avatar Nov 30 '25 10:11 wearedood