Upgrade MetaMask support (#217)

Fetch the account address from MetaMask using request({ method: 'eth_requestAccounts' }). Previously used the deprecated selectedAddress field.

Configure chainId to StreamrClient options. The parameter is required when using MetaMask sidechain signing.

BREAKING CHANGE: client.getAddress() is now async

We could be more explicit about network chainIds. Sidechain chainId could be a required parameter in StreamrClient options and we could also add chainId parameter to options.mainnet definition. The chainId validation can be enhanced in another PR later, if needed.

Note that there are currently no automated tests to check the MetaMask integration.

Author: teogeb

examples/node/package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "streamr-client",
-  "version": "5.0.0-beta.9",
+  "version": "5.0.0-beta.10",
   "description": "JavaScript client library for Streamr",
   "repository": {
     "type": "git",

examples/webpack/package-lock.json

@@ -33,7 +33,7 @@ export type StrictStreamrClientOptions = {
     groupKeys: Todo
     keyExchange: Todo
     mainnet?: ConnectionInfo|string
-    sidechain?: ConnectionInfo|string
+    sidechain: ConnectionInfo & { chainId?: number }
     tokenAddress: EthereumAddress,
     dataUnion: {
         minimumWithdrawTokenWei: BigNumber|number|string
@@ -86,7 +86,10 @@ export default function ClientConfig(opts: StreamrClientOptions = {}) {
         // Ethereum and Data Union related options
         // For ethers.js provider params, see https://docs.ethers.io/ethers.js/v5-beta/api-providers.html#provider
         mainnet: undefined, // Default to ethers.js default provider settings
-        sidechain: 'https://rpc.xdaichain.com/',
+        sidechain: {
+            url: 'https://rpc.xdaichain.com/',
+            chainId: 100
+        },
         tokenAddress: '0x0Cf0Ee63788A0849fE5297F3407f701E122cC023',
         dataUnion: {
             minimumWithdrawTokenWei: '1000000', // Threshold value set in AMB configs, smallest token amount to pass over the bridge
@@ -106,7 +109,7 @@ export default function ClientConfig(opts: StreamrClientOptions = {}) {
 
     const options: StrictStreamrClientOptions = {
         ...defaults,
-        ...opts,
+        ...opts, // sidechain is not merged with the defaults
         dataUnion: {
             ...defaults.dataUnion,
             ...opts.dataUnion

package-lock.json

@@ -19,31 +19,35 @@ export default class StreamrEthereum {
         if (auth.privateKey) {
             const key = auth.privateKey
             const address = getAddress(computeAddress(key))
-            this._getAddress = () => address
+            this._getAddress = async () => address
             this.getSigner = () => new Wallet(key, this.getMainnetProvider())
             this.getSidechainSigner = async () => new Wallet(key, this.getSidechainProvider())
         } else if (auth.ethereum) {
-            this._getAddress = () => {
-                if (auth.ethereum.selectedAddress) {
+            this._getAddress = async () => {
+                try {
+                    const accounts = await auth.ethereum.request({ method: 'eth_requestAccounts' })
+                    const account = getAddress(accounts[0]) // convert to checksum case
+                    return account
+                } catch {
                     throw new Error('no addresses connected+selected in Metamask')
                 }
-                return getAddress(auth.ethereum.selectedAddress)
             }
             this._getSigner = () => {
                 const metamaskProvider = new Web3Provider(auth.ethereum)
                 const metamaskSigner = metamaskProvider.getSigner()
                 return metamaskSigner
             }
             this._getSidechainSigner = async () => {
-                // chainId is required for checking when using Metamask
                 if (!options.sidechain || !options.sidechain.chainId) {
                     throw new Error('Streamr sidechain not configured (with chainId) in the StreamrClient options!')
                 }
 
                 const metamaskProvider = new Web3Provider(auth.ethereum)
                 const { chainId } = await metamaskProvider.getNetwork()
                 if (chainId !== options.sidechain.chainId) {
-                    throw new Error(`Please connect Metamask to Ethereum blockchain with chainId ${options.sidechain.chainId}`)
+                    throw new Error(
+                        `Please connect Metamask to Ethereum blockchain with chainId ${options.sidechain.chainId}: current chainId is ${chainId}`
+                    )
                 }
                 const metamaskSigner = metamaskProvider.getSigner()
                 return metamaskSigner
@@ -57,7 +61,7 @@ export default class StreamrEthereum {
         }
     }
 
-    getAddress() {
+    async getAddress() {
         if (!this._getAddress) {
             // _getAddress is assigned in constructor
             throw new Error('StreamrClient is not authenticated with private key')

package.json

@@ -381,7 +381,7 @@ export class StreamrClient extends EventEmitter {
         return this.connection.enableAutoDisconnect(...args)
     }
 
-    getAddress(): EthereumAddress {
+    async getAddress(): Promise<EthereumAddress> {
         return this.ethereum.getAddress()
     }
 

src/Config.ts

@@ -94,7 +94,7 @@ export class DataUnion {
      * Send a joinRequest, or get into data union instantly with a data union secret
      */
     async join(secret?: string): Promise<JoinResponse> {
-        const memberAddress = this.client.getAddress() as string
+        const memberAddress = await this.client.getAddress()
         const body: any = {
             memberAddress
         }
@@ -132,7 +132,7 @@ export class DataUnion {
      * @returns receipt once withdraw is complete (tokens are seen in mainnet)
      */
     async withdrawAll(options?: DataUnionWithdrawOptions): Promise<TransactionReceipt> {
-        const recipientAddress = this.client.getAddress()
+        const recipientAddress = await this.client.getAddress()
         return this._executeWithdraw(
             () => this.getWithdrawAllTx(),
             recipientAddress,
@@ -464,7 +464,7 @@ export class DataUnion {
      * @internal
      */
     static async _deploy(options: DataUnionDeployOptions = {}, client: StreamrClient): Promise<DataUnion> {
-        const deployerAddress = client.getAddress()
+        const deployerAddress = await client.getAddress()
         const {
             owner,
             joinPartAgents,

src/Ethereum.js

@@ -41,7 +41,7 @@ describe('DataUnion admin fee', () => {
         const dataUnion = await adminClient.deployDataUnion()
         const oldFee = await dataUnion.getAdminFee()
         log(`DU owner: ${await dataUnion.getAdminAddress()}`)
-        log(`Sending tx from ${adminClient.getAddress()}`)
+        log(`Sending tx from ${await adminClient.getAddress()}`)
         const tr = await dataUnion.setAdminFee(0.1)
         log(`Transaction receipt: ${JSON.stringify(tr)}`)
         const newFee = await dataUnion.getAdminFee()

src/StreamrClient.ts

@@ -34,7 +34,7 @@ describe('DataUnion deploy', () => {
 
         it('not specified: defaults to deployer', async () => {
             const dataUnion = await adminClient.deployDataUnion()
-            expect(await dataUnion.getAdminAddress()).toBe(adminClient.getAddress())
+            expect(await dataUnion.getAdminAddress()).toBe(await adminClient.getAddress())
         }, 60000)
 
         it('specified', async () => {