Skip to content
This repository has been archived by the owner on Aug 9, 2021. It is now read-only.

Chatbox example is not working #906

Open
rstuven opened this issue Sep 5, 2020 · 1 comment
Open

Chatbox example is not working #906

rstuven opened this issue Sep 5, 2020 · 1 comment

Comments

@rstuven
Copy link

rstuven commented Sep 5, 2020

Describe the bug
After MetaMask sign in, the app doesn't show chatbox.

To Reproduce
Steps to reproduce the behavior:

  1. git clone [email protected]:3box/3box-chatbox-react.git && cd 3box-chatbox-react
  2. npm install && npm run start
  3. Open http://localhost:8080/
  4. Sign in using MetaMask
  5. Error in console log.

Desktop (please complete the following information):

  • OS: macOS 10.15.5
  • Browser: Chrome
  • Version: 84.0.4147.125 (Official Build) (64-bit)

Additional context

Network log

Request: GET https://beta.3box.io/address-server/odbAddress/0xba8398ce00912922de4ab30caad9a9227872e47a
Response: 200

{"status":"success","data":{"rootStoreAddress":"/orbitdb/QmWiw1B9nG1MC8P8oQZanryGFyB3zMEgb1sh8Z5m4i8rZv/1220464eca31591c31f07450fc5e718a7b592065c4d0ba84520b573ea7b81860632f.root","did":"did:3:bafyreiheopnbxwz24uqukjg4ku7povwffsxybx253v23slkuwm5ybqtsx4"}}
Console log 
generating 2048-bit RSA keypair...
VM48508:1 Fetch finished loading: GET "https://beta.3box.io/address-server/odbAddress/0x1ac6348a404a061dfb1a2709d68361f9f3770004".

rfc4648.js:56 Uncaught (in promise) TypeError: Cannot read property 'length' of undefined
    at encode (rfc4648.js:56)
    at Object.encode (rfc4648.js:86)
    at Base.encode (base.js:14)
    at Function.encode (index.js:42)
    at ./node_modules/ipfs-repo/src/blockstore-utils.js.exports.cidToKey (blockstore-utils.js:19)
    at Object.get (blockstore.js:43)
    at loadOrFetchFromNetwork (index.js:200)
    at Bitswap.get (index.js:231)
    at BlockService.get (index.js:96)
    at IPLDResolver.get (index.js:136)
encode @ rfc4648.js:56
encode @ rfc4648.js:86
encode @ base.js:14
encode @ index.js:42
./node_modules/ipfs-repo/src/blockstore-utils.js.exports.cidToKey @ blockstore-utils.js:19
get @ blockstore.js:43
loadOrFetchFromNetwork @ index.js:200
get @ index.js:231
get @ index.js:96
get @ index.js:136
get @ get.js:15
(anonymous) @ utils.js:180
readCbor @ index.js:79
read @ index.js:127
fromMultihash @ entry.js:145
(anonymous) @ entry-io.js:140
fetchEntry @ entry-io.js:81
(anonymous) @ index.js:57
setTimeout (async)
load @ Replicator.js:107
sync @ Store.js:314
async function (async)
sync @ Store.js:313
_onMessage @ OrbitDB.js:258
onMessage @ OrbitDB.js:273
_handleMessage @ exchange-heads.js:20
emit @ events.js:153
_messageHandler @ direct-channel.js:84
emit @ events.js:153
(anonymous) @ pubsub.js:221
_emitMessage @ pubsub.js:219
_processRpcMessage @ pubsub.js:215
_processRpcMessage @ index.js:155
(anonymous) @ pubsub.js:200
async function (async)
(anonymous) @ pubsub.js:190
_onRpc @ pubsub.js:174
(anonymous) @ pubsub.js:121
async function (async)
(anonymous) @ pubsub.js:118
rawPipe @ index.js:4
pipe @ index.js:49
_processMessages @ pubsub.js:114
_onIncomingStream @ index.js:181
async function (async)
_onIncomingStream @ index.js:174
_onStream @ upgrader.js:313
onStream @ upgrader.js:235
async function (async)
onStream @ upgrader.js:231
_handleIncoming @ mplex.js:202
(anonymous) @ mplex.js:151
async function (async)
(anonymous) @ mplex.js:149
rawPipe @ index.js:4
pipe @ index.js:49
(anonymous) @ mplex.js:144
(anonymous) @ index.js:18
rawPipe @ index.js:4
pipe @ index.js:49
_createConnection @ upgrader.js:261
upgradeOutbound @ upgrader.js:189
async function (async)
upgradeOutbound @ upgrader.js:168
dial @ index.js:45
async function (async)
dial @ index.js:41
dial @ transport-manager.js:87
dialAction @ index.js:140
(anonymous) @ dial-request.js:58
async function (async)
(anonymous) @ dial-request.js:54
run @ dial-request.js:53
_createPendingDial @ index.js:158
connectToPeer @ index.js:75
dialProtocol @ index.js:300
dial @ index.js:276
connect @ connect.js:7
(anonymous) @ utils.js:180
_callee31$ @ 3box.js:1905
tryCatch @ runtime.js:63
invoke @ runtime.js:293
(anonymous) @ runtime.js:118
asyncGeneratorStep @ asyncToGenerator.js:3
_next @ asyncToGenerator.js:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js:13
_next @ asyncToGenerator.js:25
(anonymous) @ asyncToGenerator.js:32
(anonymous) @ asyncToGenerator.js:21
getIPFS @ 3box.js:1926
_callee27$ @ 3box.js:1717
tryCatch @ runtime.js:63
invoke @ runtime.js:293
(anonymous) @ runtime.js:118
asyncGeneratorStep @ asyncToGenerator.js:3
_next @ asyncToGenerator.js:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js:13
_next @ asyncToGenerator.js:25
(anonymous) @ asyncToGenerator.js:32
(anonymous) @ asyncToGenerator.js:21
create @ 3box.js:1741
_callee30$ @ 3box.js:1830
tryCatch @ runtime.js:63
invoke @ runtime.js:293
(anonymous) @ runtime.js:118
asyncGeneratorStep @ asyncToGenerator.js:3
_next @ asyncToGenerator.js:25
(anonymous) @ asyncToGenerator.js:32
(anonymous) @ asyncToGenerator.js:21
openBox @ 3box.js:1849
_callee$ @ Example.js:29
tryCatch @ runtime.js:63
invoke @ runtime.js:293
(anonymous) @ runtime.js:118
asyncGeneratorStep @ bootstrap:856
_next @ bootstrap:856
Promise.then (async)
asyncGeneratorStep @ bootstrap:856
_next @ bootstrap:856
(anonymous) @ bootstrap:856
(anonymous) @ bootstrap:856
componentDidMount @ Example.js:22
$ npm ls --depth=1 
[email protected] /Users/rstuven/lab/3box-chatbox-react
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── @babel/[email protected] deduped
│ ├── @ethersproject/[email protected]
│ ├── @ethersproject/[email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── @babel/[email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ └── [email protected] deduped
├─┬ @babel/[email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected] deduped
├─┬ @babel/[email protected]
│ ├── @babel/[email protected]
│ └── @babel/[email protected]
├─┬ @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected]
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected] deduped
├─┬ @babel/[email protected]
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ ├── @babel/[email protected]
│ └── @babel/[email protected]
├─┬ @babel/[email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected]
│ └── [email protected]
├─┬ @babel/[email protected]
│ └── [email protected]
├── UNMET PEER DEPENDENCY @types/react@^15.0.0 || ^16.0.0
├── [email protected]
├─┬ [email protected]
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected] deduped
│ ├── @babel/[email protected] deduped
│ ├── [email protected]
│ └── [email protected] deduped
├─┬ [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├── [email protected]
├─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ └── [email protected] deduped
├─┬ [email protected]
│ ├── @babel/[email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ └── [email protected]
├─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected] deduped
│ └── [email protected] deduped
├─┬ [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected] deduped
├─┬ [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ └── [email protected] deduped
├── [email protected]
├─┬ UNMET PEER DEPENDENCY [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ └── [email protected] deduped
├── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected] deduped
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── @webassemblyjs/[email protected]
│ ├── @webassemblyjs/[email protected]
│ ├── @webassemblyjs/[email protected]
│ ├── @webassemblyjs/[email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
├─┬ [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
└─┬ [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected] deduped
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  ├── [email protected]
  └── [email protected]

npm ERR! peer dep missing: react-dom@^15.4.2, required by [email protected]
npm ERR! peer dep missing: @types/react@^15.0.0 || ^16.0.0, required by [email protected]
npm ERR! peer dep missing: bufferutil@^4.0.1, required by [email protected]
npm ERR! peer dep missing: utf-8-validate@^5.0.2, required by [email protected]
npm ERR! peer dep missing: bufferutil@^4.0.1, required by [email protected]
npm ERR! peer dep missing: utf-8-validate@^5.0.2, required by [email protected]
npm ERR! peer dep missing: bufferutil@^4.0.1, required by [email protected]
npm ERR! peer dep missing: utf-8-validate@^5.0.2, required by [email protected]
@rstuven
Copy link
Author

rstuven commented Sep 6, 2020 •
edited
Loading

I found the root cause: Some dependencies (see below) are installing [email protected], which removes the buffer property from the CID class, while others still depend on that property.

$ npm ls cids    
[email protected] /Users/rstuven/lab/3box-chatbox-react
├─┬ [email protected]
...
│ ├─┬ [email protected]
│ │ └─┬ [email protected]
│ │   ├── [email protected] 
│ │   └─┬ [email protected]
│ │     └── [email protected] 
...

My workaround was to install a previous version of ipfs-log:

npm install [email protected]

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@rstuven