js-waku: Bug: Cannot convert BigInt value to a number.

This is a bug report

Problem

In our frontend platform at Huddle01 we are facing this bug on running yarn build.

On checking various packages we found that when we commented the usage of waku functions and deleted the waku package then this error wasn’t showing up.

Here is all the code related to waku functionality that we are using.

wakuUtils.js

import protons from "protons";
const proto = protons(`
    message SimpleChatMessage {
      uint64 timestamp = 1;
      string text = 2;
      string sender = 3;
    }
  `);

const selectFleetEnv = () => {
  // Works with react-scripts
  if (process?.env?.NODE_ENV === "development") {
    return ["fleets", "wakuv2.test", "waku-websocket"];
  } else {
    return ["fleets", "wakuv2.prod", "waku-websocket"];
  }
};

const processMsgs = (msg) => {
  if (!msg.payload) return;

  const { timestamp, text, sender } = proto.SimpleChatMessage.decode(
    msg.payload
  );

  const time = new Date(timestamp).toLocaleTimeString();

  const utf8Text = Buffer.from(text).toString("utf-8");

  return { timestamp: time, text: utf8Text, sender };
};

export { proto, selectFleetEnv, processMsgs };

Parts of code where we used waku in our live stream chats:

// creating waku object
  useEffect(() => {
    if (!isLivestreamChat) return;
    if (!!waku) return;
    if (wakuStatus !== "None") return;

    setWakuStatus("Starting");

    // Create Waku
    Waku.create({
      libp2p: {
        config: {
          pubsub: {
            enabled: true,
            emitSelf: true,
          },
        },
      },
      bootstrap: getBootstrapNodes.bind({}, selectFleetEnv()),
    }).then((waku) => {
      setWaku(waku);
      setWakuStatus("Started");
      waku.waitForConnectedPeer().then(() => {
        setWakuStatus("Ready");
        console.log(wakuStatus);
      });
    });
    console.log(wakuStatus);
  }, [waku, wakuStatus]);

  const processWakuHistory = (retrievedMessages) => {
    const messages = retrievedMessages
      .map((msg) => processMsgs(msg))
      .filter(Boolean);

    setWakuMsgs((waku) => {
      return messages.concat(waku);
    });

    if (wakuMsgs.length >= 20) return true;
  };

  // fetching history of chats from waku-store
  useEffect(() => {
    if (wakuStatus !== "Ready") return;

    waku.store
      .queryHistory([ContentTopic], { callback: processWakuHistory })
      .catch((e) => {
        console.log("Failed to retrieve messages", e);
      });
    dispatch(setWakuStoreRetrieved(true));
  }, [waku, wakuStatus]);

  // sending message using waku-relay
  const handleWakuMessage = async (msgInput) => {
    if (!isLivestreamChat) return;
    if (wakuStatus !== "Ready") return;
    if (!msgInput) return;

    const text = msgInput.trim();

    const payload = proto.SimpleChatMessage.encode({
      timestamp: new Date(),
      text: text,
      sender:
        localStorage.getItem("livestream_viewer") ||
        window.ethereum.selectedAddress,
    });

    WakuMessage.fromBytes(payload, ContentTopic).then((wakuMessage) =>
      waku.relay.send(wakuMessage)
    );
    console.log(payload);
  };

  // observer for receiving messages
  const processIncomingMessage = useCallback((wakuMessage) => {
    const message = processMsgs(wakuMessage);
    setWakuMsgs((messages) => {
      return messages.concat(message);
    });
  }, []);

  // receive message using waku-relay
  useEffect(() => {
    if (!waku) return;

    waku.relay.addObserver(processIncomingMessage, [ContentTopic]);

    return function cleanUp() {
      waku.relay.deleteObserver(processIncomingMessage, [ContentTopic]);
    };
  }, [waku, wakuStatus, processIncomingMessage]);

Notes

• js-waku version: 0.14.2