🐛 Bug Report: React native socket doesn't work.

[TNAJanssen]

📜 Description

The code below on react web works perfect, on react native the on does not trigger and unread doesn't update. Using the react-native package with react-native-web and also on Android it works. But only on iOS devices it does not. I tried raw websocket to connect that works, when trying to connect to socketio debug server it works so it's the socket-io implementation of Novu.

👟 Reproduction steps

  const novu = useNovu();
  const { counts } = useCounts({ filters: [{ read: false }] });
  const unreadCount = counts?.[0].count ?? 0;

  useEffect(() => {
    const listener = (test) => {
      console.log('notification_received', test);
    };

    novu.on('notifications.notification_received', listener);

    return () => {
      novu.off('notifications.notification_received', listener);
    };
  }, [novu]);

👍 Expected behavior

The socket to trigger an event

👎 Actual Behavior with Screenshots

The socket does not trigger an event

Novu version

Self hosted

npm version

10.9.2

node version

23.7.0

📃 Provide any additional context for the Bug.

I tried with more debugging, this code shows:
(NOBRIDGE) LOG WebSocket connected! ios
(NOBRIDGE) LOG WebSocket message received: 0{"sid":"rT3Yhs3r2VkpUYo8AAMs","upgrades":[],"pingInterval":25000,"pingTimeout":20000,"maxPayload":1000000}
(NOBRIDGE) ERROR SocketIo connect error: websocket error ios

However when using the socket.io test server:

import { Server } from 'socket.io';

const io = new Server(3000, {});

io.on('connection', (socket) => {
  console.log(`connect ${socket.id}`);

  socket.on('disconnect', () => {
    console.log(`disconnect ${socket.id}`);
  });
});

The logs are:
(NOBRIDGE) LOG Connected to socket.io server

import { Platform } from 'react-native';
import io from 'socket.io-client';

export const socket = io(
  'wss://xxxx',
  {
    transports: ['websocket'],
    protocols: ['websocket'],
    upgrade: true, // force WS only
    forceNew: true,
    timeout: 10000,
    reconnectionAttempts: 5,
    extraHeaders: {
      Upgrade: 'websocket',
      Connection: 'Upgrade',
    },
  },
);

socket.on('connect_error', (err) => {
  console.error('SocketIo connect error:', err.message, Platform.OS);
});

const ws = new WebSocket( 'wss://xxx');

ws.onopen = () => {
  console.log('WebSocket connected!', Platform.OS);
  // Optionally, send an initial message if your backend expects one
  // ws.send(JSON.stringify({ type: 'subscribe', channel: 'xyz' }));
};

ws.onerror = (e) => {
  console.error('WebSocket error:', e.message, e, Platform.OS);
};

ws.onclose = (e) => {
  console.warn('WebSocket closed:', e.code, e.reason);
};

ws.onmessage = (e) => {
  console.log('WebSocket message received:', e.data);
};

The normal Web

👀 Have you spent some time to check if this bug has been raised before?

• I checked and didn't find a similar issue

🏢 Have you read the Contributing Guidelines?

• I have read the Contributing Guidelines

Are you willing to submit PR?

Yes I am willing to submit a PR!

[linear]

NV-5692 🐛 Bug Report: React native socket doesn't work.