@chainsafe/libp2p-gossipsub does not create topics or connect users

[ZababurinSergei]

I have a project in which I used the js-libp2p-gossipsub library.

I've updated all the libraries to the latest versions.
Subscriptions and topic creation using this library stopped working.

I looked at examples I found online, and they all use floodsub. It works.

Is there an example of how to create, subscribe, and send messages using the latest version of the js-libp2p-gossipsub library?

package.json

{
  "name": "@libp2p/example-browser-pubsub",
  "version": "1.0.0",
  "description": "How to use libp2p pubsub in browsers",
  "license": "Apache-2.0 OR MIT",
  "homepage": "",
  "repository": {
    "type": "git",
    "url": ""
  },
  "bugs": {
    "url": ""
  },
  "type": "module",
  "scripts": {
    "start": "node server.js",
    "build:front": "esbuild ./docs/index.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/index.bundle.mjs",
    "build": "npm run build:pubsub && npm run build:libp2p && npm run build:peer-store && npm run build:pubsubPeerDiscovery && npm run build:gossipsub && npm run build:identify",
    "build:pubsub": "esbuild ./src/dep-pubsub.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-pubsub.js",
    "build:libp2p": "esbuild ./src/dep-libp2p.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-libp2p.js",
    "build:peer-store": "esbuild ./src/dep-peer-store.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-peer-store.js",
    "build:gossipsub": "esbuild ./src/dep-gossipsub.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-gossipsub.js",
    "build:pubsubPeerDiscovery": "esbuild ./src/dep-pubsubPeerDiscovery.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-pubsubPeerDiscovery.js",
    "build:identify": "esbuild ./src/dep-identify.js --bundle --sourcemap --format=esm --target=chrome114 --define:global=window --keep-names --outfile=./docs/lib-identify.js",
    "test:firefox": "npm run build && playwright test --browser=firefox test",
    "test:chrome": "npm run build && playwright test test"
  },
  "dependencies": {
    "@chainsafe/libp2p-gossipsub": "^14.1.2",
    "@chainsafe/libp2p-noise": "^17.0.0",
    "@chainsafe/libp2p-yamux": "^8.0.1",
    "@libp2p/autonat-v2": "^2.0.5",
    "@libp2p/bootstrap": "^12.0.6",
    "@libp2p/circuit-relay-v2": "^4.0.5",
    "@libp2p/crypto": "^5.1.12",
    "@libp2p/dcutr": "^3.0.5",
    "@libp2p/floodsub": "^11.0.6",
    "@libp2p/http": "^2.0.1",
    "@libp2p/http-fetch": "^4.0.1",
    "@libp2p/http-ping": "^2.0.1",
    "@libp2p/http-server": "^2.0.1",
    "@libp2p/identify": "^4.0.5",
    "@libp2p/interface": "^3.0.2",
    "@libp2p/interface-transport": "^4.0.3",
    "@libp2p/kad-dht": "^16.0.5",
    "@libp2p/peer-id": "^6.0.3",
    "@libp2p/peer-id-factory": "^4.2.4",
    "@libp2p/peer-store": "^12.0.5",
    "@libp2p/ping": "^3.0.5",
    "@libp2p/pubsub-peer-discovery": "^12.0.0",
    "@libp2p/tcp": "^11.0.5",
    "@libp2p/webrtc": "^6.0.6",
    "@libp2p/websockets": "^10.0.6",
    "@libp2p/webtransport": "^6.0.7",
    "@multiformats/multiaddr": "^13.0.1",
    "@multiformats/multiaddr-matcher": "^3.0.1",
    "blockstore-core": "^6.1.1",
    "compression": "^1.8.1",
    "cors": "^2.8.5",
    "datastore-core": "^11.0.2",
    "datastore-idb": "^4.0.1",
    "dotenv": "^17.2.3",
    "express": "^5.1.0",
    "express-enqueue": "^1.0.0",
    "http-proxy": "^1.18.1",
    "libp2p": "^3.0.6",
    "peer-id": "^0.16.0",
    "protons-runtime": "^5.6.0",
    "uint8arrays": "^5.1.0"
  },
  "devDependencies": {
    "esbuild": "^0.25.11",
    "test-ipfs-example": "^1.3.3"
  },
  "engines": {
    "node": ">= 20.19.0"
  }
}

js-libp2p config

const libp2p = await createLibp2p({
  addresses: {
    listen: [
      '/p2p-circuit',
      '/webrtc'
    ]
  },
  transports: [
    webRTCDirect(),
    webSockets(),
    webRTC(),
    circuitRelayTransport()
  ],
  connectionEncrypters: [noise()],
  streamMuxers: [yamux()],
  connectionManager: {
    minConnections: 20
  },
  transportManager: {
    faultTolerance: FaultTolerance.NO_FATAL
  },
  services: {
    identify: identify(),
    pubsub: floodsub(), // How to replace with a library @chainsafe/libp2p-gossipsub ?
    identifyPush: identifyPush(),
    dcutr: dcutr(),
    ping: ping(),
  },
  connectionGater: {
    denyDialPeer: (currentPeerId) => {
      // console.log('-------- denyDialPeer --------', currentPeerId.toString())
      return false
    },
    denyDialMultiaddr: async (currentPeerId) => {
      // console.log('-------- denyDialMultiaddr --------', currentPeerId.toString())
      return false
    },
    denyOutboundConnection: (currentPeerId, maConn) => {
      // console.log('-------- 1 denyOutboundConnection 1 --------', currentPeerId.toString(), maConn)
      return false
    },
    denyOutboundEncryptedConnection: (currentPeerId, maConn) => {
      // console.log('-------- 2 denyOutboundEncryptedConnection 2 --------', currentPeerId.toString(), maConn)
      return false
    },
    denyOutboundUpgradedConnection: (currentPeerId, maConn) => {
      // console.log('-------- 3 denyOutboundUpgradedConnection 3 --------', currentPeerId.toString(), maConn)
      return false
    },
    denyInboundConnection: (maConn) => {
      // console.log('-------- 1 denyInboundConnection 1 --------', maConn)
      return false
    },
    denyInboundEncryptedConnection: (currentPeerId, maConn) => {
      // console.log('-------- 2 denyInboundEncryptedConnection 2 --------', currentPeerId.toString(), maConn)
      return false
    },
    denyInboundUpgradedConnection: (currentPeerId, maConn) => {
      // console.log('-------- 3 denyInboundUpgradedConnection 3 --------', currentPeerId.toString(), maConn)
      return false
    },
    filterMultiaddrForPeer: async (currentPeerId, maConn) => {
      // console.log('-------- filterMultiaddrForPeer --------', currentPeerId.toString(), maConn)
      return true
    }
  }
})

[joshreynolds]

Hey Sergei!

I found myself battle a similar problem and came across your issue. I had some luck switching the gossipsub depedency. I was trying to use https://www.jsdelivr.com/package/npm/@chainsafe/libp2p-gossipsub which is version 14.1.2 just like you. I switched to this one: https://www.jsdelivr.com/package/npm/@libp2p/gossipsub which is at version 15.0.7. Once I made this change my two browser peers found themselves through a relay.

[ZababurinSergei]

Thanks. But.
What version is this?
Where can I find it in the repository?

I can't find a tag for this version in the repository.
I can't install this version via npm.
However, I see version 15.0.7 in npm, but I can't figure out what this code is.

Last Releases v14.1.2

[joshreynolds]

I know super confusing. If you go to the releases for this project (https://github.com/libp2p/js-libp2p/releases) and search the module like gossipsub you'll find an individual release and version. I moved all my imports to use those instead of under the ones under chainsafe. I was pulling the noise module from chainsafe as well but there's one under js-libp2p.

[ZababurinSergei]

Thanks. I'll try to build a new version tomorrow.

[NiKrause]

Thank you, this was helping me out. I am using it to connect browser peers with WebRTC but doesn't seem as reliable then the older version. Can anyone confirm?

E.g. the browser peers often do not receive pubsub peer discovery messages from some browsers.

Example: A and B is connected via WebRTC direct (and ws relay) C is connecting to relay and receives /webrtc from A but not from B (something like that)

[joshreynolds]

I have also been having difficulty getting private browser peers to reliably communicate. I've tried spinning up a bunch of go relay nodes locally that the browsers can reach without hole punching. I was thinking that maybe I just don't have enough nodes so I spun up a bunch. They do seem to be able to discover each other but are unable to reliably send messages over gossipsub. Some peers start throwing js errors about streams being closed. I built a simple chat app and I can get messages to be sent around but some peers just never get the message or if they send they go nowhere.

It seems like as soon as a stream is closed the peer doesn't try to reestablish the connection. My app is simple but that could very well be something specific I'm doing in my code, or maybe I'm missing configuration options. Not sure.