Merge pull request #212 from status-im/eth-dm

.cspell.json

@@ -19,10 +19,12 @@
     "Dscore",
     "editorconfig",
     "esnext",
+    "ethersproject",
     "execa",
     "exponentiate",
     "fanout",
     "floodsub",
+    "fontsource",
     "globby",
     "gossipsub",
     "huilong",
@@ -32,6 +34,7 @@
     "ineed",
     "iwant",
     "jdev",
+    "keccak",
     "lastpub",
     "libauth",
     "libp",

.github/workflows/examples-ci.yml

@@ -12,7 +12,7 @@ jobs:
   examples_build_and_test:
     strategy:
       matrix:
-        example: [ cli-chat, web-chat ]
+        example: [ cli-chat, web-chat, eth-dm ]
     runs-on: ubuntu-latest
     steps:
 

CHANGELOG.md

@@ -14,6 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Changed
 - **Breaking**: Auto select peer if none provided for store and light push protocols.
+- Upgrade to `libp2p@0.31.7` and `libp2p-gossipsub@0.10.0` to avoid `TextEncoder` errors in ReactJS tests.
 
 ## [0.7.0] - 2021-06-15
 

README.md

@@ -191,6 +191,29 @@ You can also specify an optional `listenAddr` parameter (.e.g `--listenAddr /ip4
 This is only useful if you want a remote node to dial to your chat app, 
 it is not necessary in normal usage when you just connect to the fleet.
 
+## Ethereum Direct Message
+
+A PoC implementation of [20/ETH-DM](https://rfc.vac.dev/spec/20/).
+
+Ethereum Direct Message, or Eth-DM, is a protocol that allows sending encrypted message to a recipient,
+only knowing their Ethereum Address.
+
+This is protocol has been created to demonstrated how encryption and signature could be added to messages
+sent over the Waku v2 network.
+
+The `main` branch's HEAD is deployed on GitHub Pages at https://status-im.github.io/js-waku/eth-dm/.
+
+To run a development version locally, do:
+
+```shell
+git clone https://github.com/status-im/js-waku/ ; cd js-waku
+npm install   # Install dependencies for js-waku
+npm run build # Build js-waku
+cd examples/eth-dm   
+npm install   # Install dependencies for the web app
+npm run start # Start development server to serve the web app on http://localhost:3000/js-waku/eth-dm
+```
+
 ## Contributing
 
 See [CONTRIBUTING.md](./CONTRIBUTING.md).

examples/eth-dm/README.md

@@ -1,3 +1,3 @@
 # Ethereum Direct Message Web App
 
-A showcase app of [20/ETH-DM](https://rfc.vac.dev/spec/20/).
+See js-waku [README](../../README.md#ethereum-direct-message) for details.

examples/eth-dm/contracts/Dummy.sol

@@ -1,6 +0,0 @@
-pragma solidity ^0.6.0;
-
-contract Dummy {
-  constructor() public {
-  }
-}

examples/eth-dm/contracts_build/Dummy.json

@@ -1,24 +0,0 @@
-{
-  "abi": [
-    {
-      "inputs": [],
-      "stateMutability": "nonpayable",
-      "type": "constructor"
-    }
-  ],
-  "evm": {
-    "bytecode": {
-      "linkReferences": {},
-      "object": "6080604052348015600f57600080fd5b50603f80601d6000396000f3fe6080604052600080fdfea264697066735822122085ecc1272da81a9643c13d0f593ec5056152ae255b6b63d3368e440c9cffe75c64736f6c63430006020033",
-      "opcodes": "PUSH1 0x80 PUSH1 0x40 MSTORE CALLVALUE DUP1 ISZERO PUSH1 0xF JUMPI PUSH1 0x0 DUP1 REVERT JUMPDEST POP PUSH1 0x3F DUP1 PUSH1 0x1D PUSH1 0x0 CODECOPY PUSH1 0x0 RETURN INVALID PUSH1 0x80 PUSH1 0x40 MSTORE PUSH1 0x0 DUP1 REVERT INVALID LOG2 PUSH5 0x6970667358 0x22 SLT KECCAK256 DUP6 0xEC 0xC1 0x27 0x2D 0xA8 BYTE SWAP7 NUMBER 0xC1 RETURNDATASIZE 0xF MSIZE RETURNDATACOPY 0xC5 SDIV PUSH2 0x52AE 0x25 JUMPDEST PUSH12 0x63D3368E440C9CFFE75C6473 PUSH16 0x6C634300060200330000000000000000 ",
-      "sourceMap": "25:47:0:-:0;;;44:26;8:9:-1;5:2;;;30:1;27;20:12;5:2;44:26:0;25:47;;;;;;"
-    },
-    "deployedBytecode": {
-      "linkReferences": {},
-      "object": "6080604052600080fdfea264697066735822122085ecc1272da81a9643c13d0f593ec5056152ae255b6b63d3368e440c9cffe75c64736f6c63430006020033",
-      "opcodes": "PUSH1 0x80 PUSH1 0x40 MSTORE PUSH1 0x0 DUP1 REVERT INVALID LOG2 PUSH5 0x6970667358 0x22 SLT KECCAK256 DUP6 0xEC 0xC1 0x27 0x2D 0xA8 BYTE SWAP7 NUMBER 0xC1 RETURNDATASIZE 0xF MSIZE RETURNDATACOPY 0xC5 SDIV PUSH2 0x52AE 0x25 JUMPDEST PUSH12 0x63D3368E440C9CFFE75C6473 PUSH16 0x6C634300060200330000000000000000 ",
-      "sourceMap": "25:47:0:-:0;;;;;"
-    }
-  },
-  "bytecode": "6080604052348015600f57600080fd5b50603f80601d6000396000f3fe6080604052600080fdfea264697066735822122085ecc1272da81a9643c13d0f593ec5056152ae255b6b63d3368e440c9cffe75c64736f6c63430006020033"
-}

examples/eth-dm/package.json

@@ -9,7 +9,6 @@
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.15",
-    "@types/node": "^12.0.0",
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
     "eth-crypto": "^1.9.0",
@@ -25,9 +24,7 @@
   "scripts": {
     "start": "react-scripts start",
     "build": "run-s build:*",
-    "build:waffle": "waffle",
     "build:react": "react-scripts build",
-    "test:unit": "react-scripts test",
     "eject": "react-scripts eject",
     "fix": "run-s fix:*",
     "test": "run-s build test:*",
@@ -56,9 +53,11 @@
     ]
   },
   "devDependencies": {
-    "@ethereum-waffle/jest": "^3.2.2",
     "@ethersproject/shims": "^5.3.0",
-    "ethereum-waffle": "^3.3.0",
-    "npm-run-all": "^4.1.5"
+    "@types/node": "^14.17.3",
+    "cspell": "^5.6.6",
+    "eslint": "^7.29.0",
+    "npm-run-all": "^4.1.5",
+    "prettier": "^2.3.1"
   }
 }

examples/eth-dm/src/App.test.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});

examples/eth-dm/src/App.tsx

@@ -181,11 +181,11 @@ async function initWaku(): Promise<Waku> {
 
 function getNodes() {
   // Works with react-scripts
-  // if (process?.env?.NODE_ENV === 'development') {
-  return getStatusFleetNodes(Environment.Test);
-  // } else {
-  //   return getStatusFleetNodes(Environment.Prod);
-  // }
+  if (process?.env?.NODE_ENV === 'development') {
+    return getStatusFleetNodes(Environment.Test);
+  } else {
+    return getStatusFleetNodes(Environment.Prod);
+  }
 }
 
 function encodePublicKeyWakuMessage(ethDmMsg: PublicKeyMessage): WakuMessage {

examples/eth-dm/src/crypto.test.ts

@@ -1,26 +0,0 @@
-import '@ethersproject/shims';
-
-import {
-  createPublicKeyMessage,
-  generateEthDmKeyPair,
-  validatePublicKeyMessage,
-} from './crypto';
-import { MockProvider } from 'ethereum-waffle';
-import { waffleJest } from '@ethereum-waffle/jest';
-
-expect.extend(waffleJest);
-
-test('Signature of Eth-DM key is verifiable', async () => {
-  console.log('get wallet');
-  const [wallet] = new MockProvider().getWallets();
-  console.log('Generate Keys');
-  const ethDmKeys = await generateEthDmKeyPair(wallet);
-
-  console.log('Create EthDm message');
-  const ethDmMsg = await createPublicKeyMessage(wallet, ethDmKeys.publicKey);
-
-  console.log('Verify EthDm message');
-  const res = validatePublicKeyMessage(ethDmMsg);
-
-  expect(res).toBe(true);
-});

examples/eth-dm/src/crypto.ts

@@ -1,7 +1,6 @@
 import '@ethersproject/shims';
 
 import * as EthCrypto from 'eth-crypto';
-import { toUtf8Bytes } from '@ethersproject/strings';
 import { ethers } from 'ethers';
 import { Signer } from '@ethersproject/abstract-signer';
 import { PublicKeyMessage } from './messages';
@@ -24,15 +23,17 @@ export async function generateEthDmKeyPair(
   web3Signer: Signer
 ): Promise<KeyPair> {
   const signature = await web3Signer.signMessage(Salt);
-  const entropy = Buffer.from(toUtf8Bytes(signature));
+  // Need to remove '0x' prefix to allow buffer to decode the hex string.
+  const sigBuf = Buffer.from(signature.slice(2), 'hex');
+  const entropy = Buffer.concat([sigBuf, sigBuf]);
   const keys = EthCrypto.createIdentity(entropy);
   return keys;
 }
 
 /**
  * Sign the Eth-DM public key with Web3. This can then be published to let other
- * users know to use this Eth-DM public key to encrypt messages destinated to the
- * Web3 account holder (ie, Ethereum Address holder).
+ * users know to use this Eth-DM public key to encrypt messages for the
+ * Ethereum Address holder.
  */
 export async function createPublicKeyMessage(
   web3Signer: Signer,

examples/eth-dm/src/index.tsx

@@ -2,7 +2,6 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
 import App from './App';
-import reportWebVitals from './reportWebVitals';
 
 ReactDOM.render(
   <React.StrictMode>
@@ -10,8 +9,3 @@ ReactDOM.render(
   </React.StrictMode>,
   document.getElementById('root')
 );
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();

examples/eth-dm/src/reportWebVitals.ts

@@ -1,15 +0,0 @@
-import { ReportHandler } from 'web-vitals';
-
-const reportWebVitals = (onPerfEntry?: ReportHandler) => {
-  if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
-      getCLS(onPerfEntry);
-      getFID(onPerfEntry);
-      getFCP(onPerfEntry);
-      getLCP(onPerfEntry);
-      getTTFB(onPerfEntry);
-    });
-  }
-};
-
-export default reportWebVitals;

examples/eth-dm/waffle.json

@@ -1,6 +0,0 @@
-{
-  "compilerType": "solcjs",
-  "compilerVersion": "0.6.2",
-  "sourceDirectory": "./contracts",
-  "outputDirectory": "./contracts_build"
-}

package.json

@@ -59,8 +59,8 @@
     "debug": "^4.3.1",
     "it-concat": "^2.0.0",
     "it-length-prefixed": "^5.0.2",
-    "libp2p": "^0.31.0",
-    "libp2p-gossipsub": "^0.9.0",
+    "libp2p": "^0.31.7",
+    "libp2p-gossipsub": "^0.10.0",
     "libp2p-mplex": "^0.10.3",
     "libp2p-noise": "^3.0.0",
     "libp2p-tcp": "^0.15.4",

src/lib/waku.spec.ts

@@ -17,7 +17,7 @@ describe('Waku Dial', function () {
     const [waku1, waku2] = await Promise.all([
       Waku.create({
         staticNoiseKey: NOISE_KEY_1,
-        libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/wss'] } },
+        libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/ws'] } },
       }),
       Waku.create({ staticNoiseKey: NOISE_KEY_2 }),
     ]);

src/lib/waku.ts

@@ -71,7 +71,7 @@ export class Waku {
     lightPush: WakuLightPush
   ) {
     this.libp2p = libp2p;
-    this.relay = (libp2p.pubsub as unknown) as WakuRelay;
+    this.relay = libp2p.pubsub as unknown as WakuRelay;
     this.store = store;
     this.lightPush = lightPush;
     this.keepAliveTimers = {};
@@ -154,9 +154,7 @@ export class Waku {
    *
    * @param peer The peer to dial
    */
-  async dial(
-    peer: PeerId | Multiaddr | string
-  ): Promise<{
+  async dial(peer: PeerId | Multiaddr | string): Promise<{
     stream: import('libp2p-interfaces/src/stream-muxer/types').MuxedStream;
     protocol: string;
   }> {

src/lib/waku_relay/index.spec.ts

@@ -31,7 +31,7 @@ describe('Waku Relay', () => {
         Waku.create({ staticNoiseKey: NOISE_KEY_1 }),
         Waku.create({
           staticNoiseKey: NOISE_KEY_2,
-          libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/wss'] } },
+          libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/ws'] } },
         }),
       ]);
 
@@ -58,12 +58,10 @@ describe('Waku Relay', () => {
     });
 
     it('Subscribe', async function () {
-      const subscribers1 = waku1.libp2p.pubsub.getSubscribers(
-        DefaultPubsubTopic
-      );
-      const subscribers2 = waku2.libp2p.pubsub.getSubscribers(
-        DefaultPubsubTopic
-      );
+      const subscribers1 =
+        waku1.libp2p.pubsub.getSubscribers(DefaultPubsubTopic);
+      const subscribers2 =
+        waku2.libp2p.pubsub.getSubscribers(DefaultPubsubTopic);
 
       expect(subscribers1).to.contain(waku2.libp2p.peerId.toB58String());
       expect(subscribers2).to.contain(waku1.libp2p.peerId.toB58String());
@@ -181,7 +179,7 @@ describe('Waku Relay', () => {
         Waku.create({
           pubsubTopic,
           staticNoiseKey: NOISE_KEY_2,
-          libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/wss'] } },
+          libp2p: { addresses: { listen: ['/ip4/0.0.0.0/tcp/0/ws'] } },
         }),
         Waku.create({
           staticNoiseKey: NOISE_KEY_2,
@@ -267,9 +265,8 @@ describe('Waku Relay', () => {
 
       it('nim subscribes to js', async function () {
         const nimPeerId = await nimWaku.getPeerId();
-        const subscribers = waku.libp2p.pubsub.getSubscribers(
-          DefaultPubsubTopic
-        );
+        const subscribers =
+          waku.libp2p.pubsub.getSubscribers(DefaultPubsubTopic);
 
         expect(subscribers).to.contain(nimPeerId.toB58String());
       });

src/lib/waku_relay/index.ts

@@ -12,7 +12,7 @@ import {
   messageIdToString,
   shuffle,
 } from 'libp2p-gossipsub/src/utils';
-import Pubsub, { InMessage } from 'libp2p-interfaces/src/pubsub';
+import { InMessage } from 'libp2p-interfaces/src/pubsub';
 import { SignaturePolicy } from 'libp2p-interfaces/src/pubsub/signature-policy';
 import PeerId from 'peer-id';
 
@@ -57,7 +57,7 @@ export interface GossipOptions {
  * @implements {Pubsub}
  * @noInheritDoc
  */
-export class WakuRelay extends Gossipsub implements Pubsub {
+export class WakuRelay extends Gossipsub {
   heartbeat: RelayHeartbeat;
   pubsubTopic: string;
   /**
@@ -456,9 +456,8 @@ export class WakuRelay extends Gossipsub implements Pubsub {
         const peerId = PeerId.createFromB58String(p);
         px.push({
           peerID: peerId.toBytes(),
-          signedPeerRecord: this._libp2p.peerStore.addressBook.getRawEnvelope(
-            peerId
-          ),
+          signedPeerRecord:
+            this._libp2p.peerStore.addressBook.getRawEnvelope(peerId),
         });
       });
     }

src/proto/chat/v2/chat_message.ts

@@ -132,8 +132,8 @@ const btoa: (bin: string) => string =
   ((bin) => globalThis.Buffer.from(bin, 'binary').toString('base64'));
 function base64FromBytes(arr: Uint8Array): string {
   const bin: string[] = [];
-  for (let i = 0; i < arr.byteLength; ++i) {
-    bin.push(String.fromCharCode(arr[i]));
+  for (const byte of arr) {
+    bin.push(String.fromCharCode(byte));
   }
   return btoa(bin.join(''));
 }

src/proto/waku/v2/message.ts

@@ -150,8 +150,8 @@ const btoa: (bin: string) => string =
   ((bin) => globalThis.Buffer.from(bin, 'binary').toString('base64'));
 function base64FromBytes(arr: Uint8Array): string {
   const bin: string[] = [];
-  for (let i = 0; i < arr.byteLength; ++i) {
-    bin.push(String.fromCharCode(arr[i]));
+  for (const byte of arr) {
+    bin.push(String.fromCharCode(byte));
   }
   return btoa(bin.join(''));
 }

src/proto/waku/v2/store.ts

@@ -660,8 +660,8 @@ const btoa: (bin: string) => string =
   ((bin) => globalThis.Buffer.from(bin, 'binary').toString('base64'));
 function base64FromBytes(arr: Uint8Array): string {
   const bin: string[] = [];
-  for (let i = 0; i < arr.byteLength; ++i) {
-    bin.push(String.fromCharCode(arr[i]));
+  for (const byte of arr) {
+    bin.push(String.fromCharCode(byte));
   }
   return btoa(bin.join(''));
 }

src/test_utils/nim_waku.spec.ts

@@ -30,30 +30,8 @@ it('Convert utf-8 string to hex', function () {
 
 it('Convert buffer to hex', function () {
   const buf = Uint8Array.from([
-    0x54,
-    0x68,
-    0x69,
-    0x73,
-    0x20,
-    0x69,
-    0x73,
-    0x20,
-    0x61,
-    0x6e,
-    0x20,
-    0x75,
-    0x74,
-    0x66,
-    0x2d,
-    0x38,
-    0x20,
-    0x73,
-    0x74,
-    0x72,
-    0x69,
-    0x6e,
-    0x67,
-    0x2e,
+    0x54, 0x68, 0x69, 0x73, 0x20, 0x69, 0x73, 0x20, 0x61, 0x6e, 0x20, 0x75,
+    0x74, 0x66, 0x2d, 0x38, 0x20, 0x73, 0x74, 0x72, 0x69, 0x6e, 0x67, 0x2e,
   ]);
   const expected = '5468697320697320616e207574662d3820737472696e672e';