1

(This is a follow-up question from here.)

From the Metamask developers faq it is stated to "bundle the version of web3 that is used during development".

So I downloaded a web3.min.js version 0.20.6 from GitHub and "bundled" it like in the code below. Then I log "web3.version.api" to the console.

Now, with or without the bundling, the console reports a version 0.20.3 after clicking the button.

I suspect this is due to the line

web3 = new Web3(web3.currentProvider);

which sets web3 to the injected code from my Metamask plugin, in which I am logged in, and it runs that code, not my "bundled" version ...

Question: How do I bundle my own version of web3?

<html>
  <body>

    <script type="text/javascript" src="scripts/web3.min.js"></script>

    <script type="text/javascript">

      window.addEventListener("load", function() {

        if (typeof web3 === "undefined") {
            console.log("No web3 provider found");
        } else {
            web3 = new Web3(web3.currentProvider);
            console.log("Using web wallet");
        }

      })  </script>

    <button id="buttonBalance">Click to report version to console</button>

    <script type="text/javascript">
      button = document.getElementById("buttonBalance")
      button.onclick = function tmp()
  {
    console.log("Version=" + web3.version.api);
      };
    </script>


  </body>
</html>

PS. I created the button to make sure the web3 call to "web.version.api" is done "outside adding the eventListener to window" as per the suggestion of @Kai Kälberer

Update: As suggested by @viz I downloaded the non-minified web3j version from GitHub and uncommented the line that avoids overriding the global web3 instance. Check this screenshot from my dev tools debugger:

screenshot from dev tools debugger showing that bundled web3js code has uncommented the lines that override the global web3 object.

Still I see that the console prints out the version 0.20.3 and not 0.20.6 as defined in the downloaded web3.js ... why?

  • I am testing with your code. After some experiments, it seems like the latest web3.min.js sourced is not correctly overriding global Web3 object. – viz May 17 '18 at 10:15
3

This is happening because of this line. Currently the code is not overriding the Web3 object if the global Web3 already exists. That's why you are getting the same version of Web3 API that MetaMask has already injected however you try.

This can be solved by whether using packaging tool like webpack and load the Web3 object as a module, or manually downloading the web3.js file and fix that line if you want to embed it as a script tag.

I think web3.js should override even if the global object exists, though. If you think the current behavior is inappropriate, you can file an issue over the web3.js github repo.

  • Thanks for your response! I did as you suggested to download manually the web3.js file, comment out that line and bundled it. No success, please see my updated question. – Ytsen de Boer May 17 '18 at 11:38
  • 1
    @YtsendeBoer you should not comment out the whole three lines. Please read the code, you should only remove && typeof window.Web3 === 'undefined' this part. – viz May 17 '18 at 11:40
  • Glad it helped :) – viz May 17 '18 at 12:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.