MetaMask connector doesn't work within MetaMask iOS app

[mattparrilla]

Loading the example in the metamask app browser results in the MetaMask card displaying "Connecting" and a disabled connect button and chain select.

Example is using: "@web3-react/metamask": "8.0.16-beta.0",

Trying to figure out how to debug. If I manage to, I'll update.

[NoahZinsmeister]

hm i can repro - might be a regression on their end? i can't get it to work on a number of older deploys of the preview site, so it doesn't seem like this is because of any change i recently merged. don't have time to debug atm but will try to when i get a moment. i was able to verify that running the example on localhost works though...

[coopbri]

@mattparrilla I had the same issue on the MetaMask Android app, and discovered that the issue was occurring when using the MetaMask connector's eager connection functionality (metamaskConnector.connectEagerly()) which was added in @web3-react/metamask@8.0.8-beta.0. Mobile MetaMask started working after I disabled this, however of course I lost the eager connection benefits on desktop (but you could conditionally enable this based on the device). Let me know whether or not you are using this and I can help you debug further.

For what it's worth (you might already know about this), https://docs.metamask.io/guide/mobile-best-practices.html#website-testing-and-debugging describes details about testing the MetaMask app locally, which helped me debug the app with a quicker feedback loop.

[NoahZinsmeister]

hm so i tried again today against the latest official web3-react example and couldn't replicate the issue. perhaps metamask pushed a bug fix? is anyone else still facing the same issue?

[mattparrilla]

@NoahZinsmeister I still have the issue using the official example. On Metamask v4.3.1 (859). Apologies for not helping debug. I don't have an OSX device to debug locally, though I might get one soon.

[NoahZinsmeister]

huh, yeah ok i can repro on the hosted example, just not on localhost. i suspect a race condition

[coopbri]

I am now encountering this issue on desktop with eager connection enabled -- the MetaMask provider in https://github.com/tmm/wagmi works if reliable automatic connection is needed in the meantime (I suspect web3-react v6 would work as well, but haven't tested). Let me know if I can help debug this @NoahZinsmeister. Another alternative that worked for me was to manually connect to the dapp through MetaMask's connection UI, but of course that isn't great UX.

I agree that this seems to be a post-build race condition. For me, it works sometimes but mostly not

[mattparrilla]

@coopbri you might want to file this as a separate issue and include steps to reproduce. I use connectEagerly and have no issues on desktop and the iOS issue predates the use of connectEagerly.

I just ordered an OSX device and will be using it to debug the iOS issue as soon as it arrives.

[coopbri]

Ah, it seemed like the same issue based on your description since I was able to reproduce on Android and iOS, and occasionally on desktop with v8.0.19-beta.0 of the MetaMask connector. However maybe there are other variables here I am not considering. If a fix comes up in this thread (I am still testing this as well) and it does not fix MetaMask with web3-react for the other platforms (Android and occasional desktop), I will open a new issue.

[fdsfdsfhsdjf4444]

Is this resolved?

[logan272]

Same issue here, seems state don't got synced to the store after calling connector.activate() successfully.

[arickuter]

Still encountering this issue.

[siosio34]

Same issue here

[mattparrilla]

I never fixed. I switched to wagmi.sh