Code Monkey home page Code Monkey logo

Comments (14)

mqklin avatar mqklin commented on August 25, 2024 1

@mehranhydary to fix this I store lastChainId in localStorage and on chainChained check if it's the same:

      (async () => {
        try {
          const chainId = await web3.eth.getChainId();
          StoredLastEthereumChain.set(`0x${chainId.toString(16)}`); // save to localStorage

          web3.currentProvider.on(
            'chainChanged',
            chainId => {
              const lastChainId = StoredLastEthereumChain.get(); // get from localStorage
              if (String(chainId) !== String(lastChainId)) {
                window.location.reload();
              }
            },
          );
        }
        catch (e) {
          // handle exception
        }
      })();

from providers.

danfinlay avatar danfinlay commented on August 25, 2024

Thanks for the report!

from providers.

mehranhydary avatar mehranhydary commented on August 25, 2024

Hi! I ran into this issue as well... has anyone solved this?

from providers.

wbt avatar wbt commented on August 25, 2024

I am also seeing this issue, on MetaMask 8.1.3 on Windows 10 on Chrome 86.0.4240.183 (Official Build) (64-bit). The reload loop is long but not infinite; it's usually on the order of "several" and rarely into "dozens" of refreshes or few/none. It makes for pretty terrible UX.

from providers.

wbt avatar wbt commented on August 25, 2024

I should probably clarify that my computer is running very slowly today, and I suspect this is actually what interrupts the loop: if the computer is running slowly enough that the event handler (code from start of OP) does not get attached before the chainChanged event fires, the page stays loaded. That also explains the pseudorandom number of reloads.

from providers.

blakewest avatar blakewest commented on August 25, 2024

I ran into the same issue. I had to use the localStorage approach, which works, but is gross.

from providers.

wbt avatar wbt commented on August 25, 2024

The localStorage solution above runs somewhat slowly because of the call to getChainId, slower than the pretty fast timer on producing this warning:

MetaMask: MetaMask will soon stop reloading pages on network change.
For more information, see: https://docs.metamask.io/guide/ethereum-provider.html#ethereum-autorefreshonnetworkchange
Set 'ethereum.autoRefreshOnNetworkChange' to 'false' to silence this warning.

One way around this is to only store the chain ID in the chainChanged event handler callback, which means one extra refresh when first loading the dapp and fewer warnings thereafter. However, if you have multiple tabs open, if you actually do change networks the localStorage will be updated in only one of them and already updated in all the rest, missing refreshes that should happen, so sessionStorage should be used instead.

Hopefully it can be fixed soon in MetaMask!

from providers.

wbt avatar wbt commented on August 25, 2024

FYI, it looks like the chainChanged event is emitted here, which looks like it's in the InPageProvider constructor, in a conditional if ('chainId' in state && state.chainId !== this.chainId). Above that, this.chainId is set to null.
Within the conditional but before the event emission, there is this.chainId = state.chainId || null.

The way I read it, if state.chainId is not null, the first half of the conditional will necessarily be true and the second half will also be true, because at that point in execution this.chainId === null and (!null !== null). Therefore, the conditional will evaluate true and be entered. Then, the this.chainId will be set to the same as state.chainId and that value will be emitted with the event, obscuring the fact that this.chainId was null until just prior to the event emission.

I suspect the issue may have been introduced in this commit, but am not familiar enough with the context/flow/intended behavior of the InPageProvider constructor to give a sure fix. Hopefully the above can guide someone who is more familiar with that block of code than I... @rekmarks perhaps? He would at least have a better idea than I of what he was aiming to accomplish with that commit.

from providers.

rekmarks avatar rekmarks commented on August 25, 2024

Thank you for pinging me @wbt. I'm going to fix this ASAP, and it should be included in the same release as all of these changes: MetaMask/metamask-extension#8077

I'll leave this open until we've merged the fix.

from providers.

zimmah avatar zimmah commented on August 25, 2024

Since which version is this fixed? Because I'm still having this issue. (not sure if I have the latest version, BTW I use the build-in wallet by brave that's based on metamask)

from providers.

rekmarks avatar rekmarks commented on August 25, 2024

We haven't shipped this yet due to the holidays, but it will be included in version 9 of the MetaMask extension.

Edit: Expect it early in the New Year.

from providers.

mqklin avatar mqklin commented on August 25, 2024

The localStorage solution above runs somewhat slowly because of the call to getChainId, slower than the pretty fast timer on producing this warning:

@wbt I moved window.ethereum.autoRefreshOnNetworkChange = false; line before async function and don't see it anymore.

from providers.

laygir avatar laygir commented on August 25, 2024

I'm having this issue with Brave but not with Chrome.

Brave v1.34.81 Chromium: 97.0.4692.99
MetaMask v10.8.1

from providers.

Sheriik avatar Sheriik commented on August 25, 2024

Having this issue on android with TrustWallet browser.

from providers.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    πŸ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. πŸ“ŠπŸ“ˆπŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❀️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.