search

MetaMask / metamask-mobile

Mobile web browser providing access to websites that use the Ethereum blockchain
https://metamask.io
Other
2.14k stars 1.1k forks source link

Ethereum provider injection randomly fails on Android #1975

Closed arnoudcommandeur closed 3 years ago

arnoudcommandeur commented 3 years ago

Describe the bug When I open my DApp, the web3 provider is not always injected. It doesn't make sence I use @metamask/detect-provider or plain window.ethereum call.

To Reproduce Steps to reproduce the behavior

  1. Start DApp
  2. Check if Web3 is injected via:
async function testEthereum() {

  const provider = await detectEthereumProvider()

  if (provider) {
    alert('YES');
  } else {
    alert('ERROR!');
      setTimeout(testEthereum, 3000); // 3 seconds
  }
}

I also tried adding an eventlistener, but this doesn't' work as well:

      window.addEventListener('ethereum#initialized', App.initWeb3, {
        once: true,
      });

In my HTML file I added:

<script src="https://unpkg.com/@metamask/detect-provider/dist/detect-provider.min.js"></script>

  1. Sometimes the web3 is not available. After refreshign the page, sometimes it works, sometimes it does not work.

Expected behavior I expect the provider is always available.

Smartphone (please complete the following information):

to be added after bug submission by internal support / PM Severity

CryoWebToken commented 2 years ago

this still doesnt work! opens metamask fine on pc wont do anything but load on mobile (chrome)

Any ideas??

`import Web3 from "web3";

const initWeb3 = () => { return new Promise(async (resolve, reject) => { if (window.ethereum) { const web3 = new Web3(window.ethereum); try { await window.ethereum.enable(); resolve(web3); } catch (error) { reject(error); } } else if (window.web3) { const web3 = window.web3; console.log("Injected web3 detected."); resolve(web3); } else { const provider = new Web3.providers.HttpProvider("http://localhost:9545"); const web3 = new Web3(provider); console.log("No web3 instance injected, using Local web3."); resolve(web3); } }); };

export { initWeb3 };`

omnat commented 2 years ago

which app version are you on @CryoWebToken

JoelStrawn commented 2 years ago

I could not access window.ethereum on Android until I added the .html ext to the filename. Hope this helps someone.

jahvi commented 2 years ago

@jamesmorgan Thanks you don't know how much time I spent trying to figure this out.

What made it worse for me was that this worked perfectly on another app using nuxt but after reading your comment I noticed the tag in my other app didn't have a whitespace even though the app.html template is exactly the same, same nuxt versions as well.

Mithila-Panagoda commented 1 year ago

this issue is still there has any one found a fix for this

majidmadadi commented 1 year ago

I think the problem is that metamask tries to inject before html head section load. When I removed the heavy link tags from head tag, the problem was gone.

devbrooklyn commented 1 year ago

I was finally able to fix the issue in my app (after an entire day debugging) by removing the following link tags of Google Fonts from the <head> section:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
puderty commented 1 year ago

I was finally able to fix the issue in my app (after an entire day debugging) by removing the following link tags of Google Fonts from the <head> section:

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

Why is it working by remove these?

augustovicente commented 1 year ago

I am still having this issue

Keleigh123 commented 9 months ago

Hi there, has anyone solved this issue? Ethereum still fails to inject on android more often than it getting injected. Can someone please help @rekmarks