Network.js Vanilla JavaScript boilerplate

Support
1

I’m getting errors while setting up a simple web3 boilerplate using Network.js . I want to check for browser injected web3 else resort to my development ganache provider (or infura). Simple enough except there’s error and/or something I’m missing. This snippet is to get access to my running ganache on port 9545 and assign web3Context to my declared this.variables:

import { fromInjected, fromConnection } from '@openzeppelin/network';

web3Context = await fromConnection('http://xxx.xxx.xxx.xxx:9545', {
      gsn: { signKey: ephemeral() }
      });

      this.accounts = web3Context.accounts
      this.networkId = web3Context.networkId
      this.networkName = web3Context.networkName
      this.providerName = web3Context.providerName
      this.lib = web3Context.lib
      this.connected = web3Context.connected     

      console.log(this.networkId, this.lib)

My Questions:

  1. In the above snippet, I get SyntaxError: missing : after property id
  2. My assumption is that fromInjected checks for MetaMask provider browser injected code. Is that correct?
2 Likes
2

Hi @Steeve,

I haven’t done any Vanilla JavaScript using Network.js, so I am not sure what the error is here.

For question 1, the documentation has the following: https://docs.openzeppelin.com/network-js/0.2/#with_vanilla_javascript

For question 2, fromInjected creates a fully initialized Web3Context from an injected web3 provider, like MetaMask.
See the documentation: https://docs.openzeppelin.com/network-js/0.2/api#frominjected

3

Hey @Steeve! The error you are getting does not seem to be related to network.js or even web3.js, but rather a javascript syntax error. This means there is something wrong with syntax of the code (like a missing colon).

I cannot see anything off in the snippet you shared though. Maybe the error points out the line number or something else that can help locate the issue…?

Also, make sure that whatever you are using to run that code snippet supports imports and async/await! Otherwise, you are likely to get weird syntax errors.

1 Like
4

@spalladino turns out it was a scrypt issue resolved by avoiding packages that use web3 version < 1.2.2. So getting web3 provider isn’t an issue if I use web3 1.2.2+ Unfortunately OZ Network uses web3 1.2.1 . Also means having to remove my truffle-contract dependency.
see

I might be wrong , because the Starter-GSN kit uses OZNetwork without such issues ?

1 Like
5

Actually network-js does not have a pinned web3 version, but uses "web3": "^1.2.1". This means that it will pick the latest from the 1.x versions (starting from 1.2.1). Running npm list web3 should tell you which version you have installed.

1 Like