got initCrypto working

package.json

@@ -4,11 +4,11 @@
   "description": "building an embeddable js widget with react",
   "main": "index.js",
   "scripts": {
-    "build": "NODE_ENV=production webpack-cli --mode production && npm run build-storybook",
+    "build": "NODE_ENV=production webpack-cli --mode production",
     "start": "webpack-dev-server",
     "test": "jest",
     "test-update-snapshots": "jest --updateSnapshot",
-    "deploy": "npm run build && gh-pages -d dist",
+    "deploy": "yarn build && gh-pages -d dist",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook -c .storybook -o dist/storybook",
     "lint": "./node_modules/.bin/eslint ."
@@ -115,6 +115,7 @@
   },
   "dependencies": {
     "matrix-js-sdk": "^4.0.0",
+    "node-localstorage": "^2.1.5",
     "olm": "https://packages.matrix.org/npm/olm/olm-3.1.4.tgz",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",

src/components/chatbox.jsx

@@ -1,13 +1,20 @@
 import React from "react"
 import PropTypes from "prop-types"
+import * as util from "util";
+import * as os from "os";
+import * as path from "path";
+import * as fs from "fs";
+import { LocalStorage } from "node-localstorage";
 import * as olm from "olm"
 global.Olm = olm
 
-import * as sdk from "matrix-js-sdk";
+import * as matrix from "matrix-js-sdk";
+import LocalStorageCryptoStore from "matrix-js-sdk/lib/crypto/store/localStorage-crypto-store";
 import {uuid} from "uuidv4"
 
 import Message from "./message";
 
+
 const MATRIX_SERVER_ADDRESS = "https://matrix.rhok.space"
 const FACILITATOR_USERNAME = "@ocrcc-facilitator-demo:rhok.space"
 const CHATROOM_NAME = "Support Chat"
@@ -16,7 +23,7 @@ const CHATROOM_NAME = "Support Chat"
 class ChatBox extends React.Component {
   constructor(props) {
     super(props)
-    const client = sdk.createClient(MATRIX_SERVER_ADDRESS)
+    const client = matrix.createClient(MATRIX_SERVER_ADDRESS)
     this.state = {
       client: client,
       ready: false,
@@ -73,32 +80,42 @@ class ChatBox extends React.Component {
       // actual registration request with randomly generated username and password
       const username = uuid()
       const password = uuid()
+      const sessionId = err.data.session
       this.state.client.registerRequest({
-        auth: {session: err.data.session, type: "m.login.dummy"},
+        auth: {session: sessionId, type: "m.login.dummy"},
         inhibit_login: false,
         password: password,
         username: username,
         x_show_msisdn: true,
       }).then(data => {
         console.log("Registered user", data)
+
+        // use node localStorage if window.localStorage is not available
+        let localStorage = global.localStorage;
+        if (typeof localStorage === "undefined" || localStorage === null) {
+          const deviceDesc = `matrix-chat-${data.device_id}-${sessionId}`
+          const localStoragePath = path.resolve(path.join(os.homedir(), ".local-storage", deviceDesc))
+          localStorage = new LocalStorage(localStoragePath);
+        }
+
+        console.log("localStorage", localStorage)
+
+        // create new client with full options
         let opts = {
           baseUrl: MATRIX_SERVER_ADDRESS,
           accessToken: data.access_token,
           userId: data.user_id,
           deviceId: data.device_id,
+          sessionStore: new matrix.WebStorageSessionStore(localStorage),
         }
-        const localStorage = window.localStorage;
-        if (localStorage) {
-          opts.sessionStore = new sdk.WebStorageSessionStore(localStorage)
-        }
+
         this.setState({
           access_token: data.access_token,
           user_id: data.user_id,
           username: username,
-          client: sdk.createClient(opts)
+          client: matrix.createClient(opts)
         }, () => {
           this.state.client.setDisplayName("Anonymous")
-          this.state.client.initCrypto()
         })
       }).catch(err => {
         console.log("Registration error", err)
@@ -108,7 +125,13 @@ class ChatBox extends React.Component {
 
   componentDidUpdate(prevProps, prevState) {
     if (prevState.client !== this.state.client) {
+      this.state.client.initCrypto().then(res => {
+        console.log("Crypto initialized!")
+      }).catch(err => {
+        console.log("Crypto ERROR", err)
+      }).finally(() => {
         this.state.client.startClient()
+      })
 
       this.state.client.once('sync', (state, prevState, res) => {
         if (state === "PREPARED") {

webpack.config.js

@@ -71,8 +71,7 @@ const defaultConfig = {
   },
   resolve: {
     extensions: ['*', '.js', '.jsx'],
-  },
-  node: { fs: 'empty' },
+  }
 };
 
 module.exports = [{

yarn.lock

@@ -8698,6 +8698,13 @@ node-int64@^0.4.0:
     util "^0.11.0"
     vm-browserify "^1.0.1"
 
+node-localstorage@^2.1.5:
+  version "2.1.5"
+  resolved "https://registry.yarnpkg.com/node-localstorage/-/node-localstorage-2.1.5.tgz#5fc5bf05191439d3938c32efc95edc41dfe647cb"
+  integrity sha512-DMmdnUxGbDg/vKECZv+4SU3OMKo+TieRNbjncttxEo92IgJIpBfxQJHfD5Oz4nwTYajW4De1wyL9O4HcWeZ90Q==
+  dependencies:
+    write-file-atomic "^1.1.4"
+
 node-modules-regexp@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/node-modules-regexp/-/node-modules-regexp-1.0.0.tgz#8d9dbe28964a4ac5712e9131642107c71e90ec40"
@@ -10989,6 +10996,11 @@ slice-ansi@^2.1.0:
     astral-regex "^1.0.0"
     is-fullwidth-code-point "^2.0.0"
 
+slide@^1.1.5:
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/slide/-/slide-1.1.6.tgz#56eb027d65b4d2dce6cb2e2d32c4d4afc9e1d707"
+  integrity sha1-VusCfWW00tzmyy4tMsTUr8nh1wc=
+
 snapdragon-node@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
@@ -12467,6 +12479,15 @@ write-file-atomic@2.4.1:
     imurmurhash "^0.1.4"
     signal-exit "^3.0.2"
 
+write-file-atomic@^1.1.4:
+  version "1.3.4"
+  resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-1.3.4.tgz#f807a4f0b1d9e913ae7a48112e6cc3af1991b45f"
+  integrity sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8=
+  dependencies:
+    graceful-fs "^4.1.11"
+    imurmurhash "^0.1.4"
+    slide "^1.1.5"
+
 write@1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3"