Error - Uncaught in promise (purser-metamask)

[fuguefoundation]

Error: Uncaught (in promise): Error: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locked Error: Cannot read property '_state' of undefined

So I'm calling metamask.open() inside my project, and Metamask is enabled and unlocked. global.ethereum is also in scope and I can see it in the console. And the first time I call open the popup window appears in the browser asking me to grant permissions for Colony to access Metamask. But then I get the error mentioned above. Packages seem to be up to date in package.json. I have tried disabling/reenabling Metamask, and have tried on localhost network in addition to testnets like Rinkeby, same error.

I tried adding some console statements inside the switch statement in purser-metamask/es/index.js and I get the following context information in case that is of any use for troubleshooting. Do you have any insight as to why I'm getting this error?

• Node 10.12
• OS Mojave 10.14.2

Context {tryEntries: Array(2), prev: 0, next: 0, _sent: undefined, sent: undefined, …}arg: ZoneAwarePromise {__zone_symbol__state: false, __zone_symbol__value: Error: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locke…}delegate: nulldone: truemethod: "return"next: "end"prev: "end"rval: ZoneAwarePromise {__zone_symbol__state: false, __zone_symbol__value: Error: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locke…}sent: ["0xb77d57f4959eafa0339424b83fcfaf9c15407461"]tryEntries: (2) [{…}, {…}]0: {tryLoc: "root", completion: {…}}1: {tryLoc: 0, catchLoc: 12, completion: {…}}length: 2__proto__: Array(0)_sent: ["0xb77d57f4959eafa0339424b83fcfaf9c15407461"]__proto__: Object

Context {tryEntries: Array(2), prev: 0, next: 5, _sent: Array(1), sent: Array(1), …}arg: ZoneAwarePromise {__zone_symbol__state: false, __zone_symbol__value: Error: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locke…}delegate: nulldone: truemethod: "return"next: "end"prev: "end"rval: ZoneAwarePromise {__zone_symbol__state: false, __zone_symbol__value: Error: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locke…}sent: ["0xb77d57f4959eafa0339424b83fcfaf9c15407461"]tryEntries: (2) [{…}, {…}]_sent: ["0xb77d57f4959eafa0339424b83fcfaf9c15407461"]__proto__: Object

Context {tryEntries: Array(2), prev: 5, next: "end", _sent: Array(1), sent: Array(1), …}

[rdig]

This seems to crash when purser is trying to hook into metamask's internal event listener (so we can change the Wallet Instance's account in sync with the UI), but I can't exactly pin point this...

On another note, while this most likely isn't the cause, we don't officially support node @ 10 yet (it's not properly tested on it)

I'll investigate.

[rdig]

Also, which version of purser-metamask are you using ?

[fuguefoundation]

"@colony/purser-metamask": "^2.1.0"

Thanks for any help on this!

[fuguefoundation]

Tried running the code in Firefox with a fresh install of Metamask (the above error was from Chrome) and get a slightly different error:

Unhandled Promise rejection: Metamask extension could not be accessed. Please ensure that it is enabled and it's not locked Error: _getInpageProvider.publicConfigStore is undefined

FYI, the detect method imported from @colony/purser-metamask is resolving to true thus showing Metamask is available.

I don't think this is an Angular issue, since I am running open outside of Angular's change detection and error handling (I'm running the command from inside the NgZone.runOutsideAngular function, though I've tried running it elsewhere and get the above error plus some complaints from NgZone).

  async init() {
    this.ngZone.runOutsideAngular(async () => {
      const available = await isMetamaskAvailable();
      console.log(available); // true
      await metamask.open().then((res) => {
        console.log(res); // error
      });
    });
  }

[rdig]

Turns out Metamask Web3 changed some internal API's that we rely on to hook into the UI change events. (eg: publicConfigStore is no longer available)

I've set up a repo that replicates this in a controlled environment: rdig/purser-node10

I'll refactor the code and push a patch release for this later today.

Good catch! 🎉

[rdig]

Upon further investigation, I was somewhat correct in my initial assumption that this is a node version issue:

• under node 8, the web3 that gets installed is 1.0.0-beta.36 (which has the API we rely on, hence it works)
• under node 8, the web3 that gets installed is 1.0.0-beta.42 (which removed the publicConfigStore prop, breaking the package)

Most likely I'll end up pinning the web3 to a known working version until they release a stable one.

[fuguefoundation]

I have cloned the repo and tested after I updated to Node 10.15, same errors as before. Will comment about purser-trezor in the other issue after testing.

Chrome: Error: Cannot read property '_state' of undefined
Firefox: Error: _getInpageProvider.publicConfigStore is undefined

[fuguefoundation]

FYI, just pulled in the new code from your release candidate 2.1.1 into my project. Worked like a charm, thanks for your help on this!

[rdig]

I just released version 2.1.1 on the latest track, so it's available for upgrade via npm/yarn:

• https://www.npmjs.com/package/@colony/purser-metamask/v/2.1.1
• https://github.com/JoinColony/purser/releases/tag/v2.1.1

Thanks for you help!