I cannot detect network change

[javierguzman]

Hello all,

I am learning ethers & web3 in general and I do not manage to make the network/account change detection mechanism to work properly.

I have the following code:

  const [walletInfo, setWalletInfo] = useState<Wallet>({
    account: '',
    balance: ethers.BigNumber.from(0),
    provider: undefined,
    signer: undefined,
    network: undefined
  });

useEffect(() => {
    const checkConnection = async (): Promise<void> => {
      const isConnected = await isWalletConnected(walletInfo);
      if (!isConnected) {
        await connectWallet(setWalletInfo);
      }
    };

    checkConnection();

    (window.ethereum as any).on("chainChanged", () => {
      console.log('Chain changed');
    });
    (window.ethereum as any).on("accountsChanged", () => {
      console.log('Account changed');
    });
    if (walletInfo.provider) {
      walletInfo.provider.on('network', (x, y) => {
        console.log('This does not work');
      });
    }

    return () => {
      walletInfo.provider?.removeListener('network', handleClonedBlackCat);
    }
  }, []);

const connectWallet = async (setWallet: SetWallet): Promise<Wallet> => {
  const { ethereum } = window;
  if (ethereum) {
      const provider = new ethers.providers.Web3Provider(ethereum, 'any');
      await provider.send('eth_requestAccounts', []);
      const signer = provider.getSigner();
      const account = await signer.getAddress();
      const balance = await provider.getBalance(account);
      const network = await provider.getNetwork();
      const walletData = {
        account,
        balance,
        provider,
        signer,
        network
      };
      setWallet(walletData);
      console.log('Connected Wallet');
      console.log(walletData);
      return walletData;
  }
  throw new Error('Wallet is not installed e.g. Metamask, please, install it first');
};

So if I use window.ethereum.on it seems to work, but provider.on('network') is not triggered when I change chain. Also, is there a similar listener for an account change?

As far as I have understood, the usage of window.ethereum.on is not ethers implementation and listening to network it is ethers implementation that is why I would like to have it working on "ethers way".

Any clue why is not working?

Thank you in advance and regards,
Javier Guzman