wip

__tests__/hooks/useWaveIsTyping.test.tsx

@@ -1,109 +1,28 @@
-import { act, renderHook, waitFor } from '@testing-library/react';
+import { renderHook, act } from '@testing-library/react';
 import { useWaveIsTyping } from '@/hooks/useWaveIsTyping';
 import { WsMessageType } from '@/helpers/Types';
-import { useWebSocket } from '@/services/websocket/useWebSocket';
-import { useWebSocketMessage } from '@/services/websocket/useWebSocketMessage';
-import { WebSocketStatus } from '@/services/websocket/WebSocketTypes';
 
-jest.mock('@/services/websocket/useWebSocket', () => ({
-  useWebSocket: jest.fn(),
-}));
+const listeners: any[] = [];
 
-jest.mock('@/services/websocket/useWebSocketMessage', () => ({
-  useWebSocketMessage: jest.fn(),
+jest.mock('@/hooks/useWaveWebSocket', () => ({
+  useWaveWebSocket: () => ({
+    socket: {
+      addEventListener: (_: string, cb: any) => listeners.push(cb),
+      removeEventListener: jest.fn(),
+    },
+  }),
 }));
 
-const sendMock = jest.fn();
-
-const mockedUseWebSocket = useWebSocket as jest.MockedFunction<typeof useWebSocket>;
-const mockedUseWebSocketMessage = useWebSocketMessage as jest.MockedFunction<typeof useWebSocketMessage>;
-
-type MessageHandlers = Partial<Record<WsMessageType, Array<(payload: any) => void>>>;
-
-let messageHandlers: MessageHandlers;
-
-const emitMessage = (type: WsMessageType, payload: any) => {
-  messageHandlers[type]?.forEach((handler) => handler(payload));
-};
-
-beforeEach(() => {
+test('reports typing status and clears after timeout', () => {
   jest.useFakeTimers();
-  sendMock.mockReset();
-  mockedUseWebSocket.mockReset();
-  mockedUseWebSocketMessage.mockReset();
-
-  messageHandlers = {};
-
-  mockedUseWebSocket.mockReturnValue({
-    send: sendMock,
-    status: WebSocketStatus.CONNECTED,
-  } as any);
-
-  mockedUseWebSocketMessage.mockImplementation((type, callback) => {
-    if (!messageHandlers[type]) {
-      messageHandlers[type] = [];
-    }
-    messageHandlers[type]!.push(callback);
-    return { isConnected: true };
-  });
-});
-
-afterEach(() => {
-  jest.clearAllTimers();
-  jest.useRealTimers();
-  jest.clearAllMocks();
-});
-
-test('reports typing status, handles drop updates, and clears after timeout', async () => {
-  const { result, unmount } = renderHook(() => useWaveIsTyping('wave', null));
-
-  await waitFor(() =>
-    expect(sendMock).toHaveBeenCalledWith(WsMessageType.SUBSCRIBE_TO_WAVE, {
-      subscribe: true,
-      wave_id: 'wave',
-    }),
-  );
-
-  act(() => {
-    emitMessage(WsMessageType.USER_IS_TYPING, {
-      wave_id: 'wave',
-      profile: { handle: 'A', level: 1 },
-      timestamp: Date.now(),
-    });
-  });
+  const { result } = renderHook(() => useWaveIsTyping('wave', null));
 
   act(() => {
-    jest.advanceTimersByTime(1000);
+    listeners[0]({ data: JSON.stringify({ type: WsMessageType.USER_IS_TYPING, data: { wave_id: 'wave', profile: { handle: 'A', level: 1 } } }) });
   });
+  act(() => jest.advanceTimersByTime(1000));
   expect(result.current).toContain('A is typing');
 
-  act(() => {
-    emitMessage(WsMessageType.DROP_UPDATE, {
-      wave: { id: 'wave' },
-      author: { handle: 'A', level: 1 },
-    });
-  });
-  expect(result.current).toBe('');
-
-  act(() => {
-    emitMessage(WsMessageType.USER_IS_TYPING, {
-      wave_id: 'wave',
-      profile: { handle: 'A', level: 1 },
-      timestamp: Date.now(),
-    });
-  });
-
-  act(() => {
-    jest.advanceTimersByTime(6000);
-  });
+  act(() => jest.advanceTimersByTime(6000));
   expect(result.current).toBe('');
-
-  act(() => {
-    unmount();
-  });
-
-  expect(sendMock).toHaveBeenLastCalledWith(WsMessageType.SUBSCRIBE_TO_WAVE, {
-    subscribe: false,
-    wave_id: 'wave',
-  });
 });

__tests__/hooks/useWaveWebSocket.test.ts

@@ -0,0 +1,75 @@
+import { act, renderHook, waitFor } from "@testing-library/react";
+import { useWaveWebSocket } from "@/hooks/useWaveWebSocket";
+
+class MockWebSocket {
+  static CONNECTING = 0;
+  static OPEN = 1;
+  static CLOSING = 2;
+  static CLOSED = 3;
+  readyState = MockWebSocket.CONNECTING;
+  onopen = null as ((ev?: any) => any) | null;
+  onclose = null as ((ev?: any) => any) | null;
+  onerror = null as ((ev?: any) => any) | null;
+  send = jest.fn();
+  close = jest.fn(() => {
+    this.readyState = MockWebSocket.CLOSED;
+    this.onclose && this.onclose({});
+  });
+  triggerOpen() {
+    this.readyState = MockWebSocket.OPEN;
+    this.onopen && this.onopen({});
+  }
+  constructor(public url: string) {}
+}
+
+describe("useWaveWebSocket", () => {
+  let originalWs: any;
+  beforeEach(() => {
+    originalWs = global.WebSocket;
+    (global as any).WebSocket = jest.fn(
+      (url: string) => new MockWebSocket(url)
+    );
+    jest.useFakeTimers();
+  });
+  afterEach(() => {
+    jest.useRealTimers();
+    (global as any).WebSocket = originalWs;
+    jest.clearAllMocks();
+  });
+
+  it("connects and sends subscribe message", async () => {
+    const { result } = renderHook(() => useWaveWebSocket("wave1"));
+    const instance = (globalThis.WebSocket as jest.Mock).mock.results[0]
+      .value as MockWebSocket;
+    act(() => {
+      instance.triggerOpen();
+    });
+    await waitFor(() =>
+      expect(result.current.readyState).toBe(MockWebSocket.OPEN)
+    );
+    expect(instance.send).toHaveBeenCalledWith(
+      JSON.stringify({ type: "SUBSCRIBE_TO_WAVE", wave_id: "wave1" })
+    );
+  });
+
+  it("schedules reconnect on close", () => {
+    const spy = jest.spyOn(globalThis, "setTimeout");
+    renderHook(() => useWaveWebSocket("wave1"));
+    const instance = (globalThis.WebSocket as jest.Mock).mock.results[0]
+      .value as MockWebSocket;
+    act(() => {
+      instance.onclose && instance.onclose({});
+    });
+    expect(spy).toHaveBeenCalled();
+  });
+
+  it("disconnect stops reconnecting", () => {
+    const { result } = renderHook(() => useWaveWebSocket("wave1"));
+    const instance = (globalThis.WebSocket as jest.Mock).mock.results[0]
+      .value as MockWebSocket;
+    act(() => {
+      result.current.disconnect();
+    });
+    expect(instance.close).toHaveBeenCalled();
+  });
+});

__tests__/services/websocket/WebSocketProvider.test.tsx

@@ -64,7 +64,6 @@ class MockWebSocket {
 describe('WebSocketProvider', () => {
   let originalWs: any;
   let mockGetAuthJwt: jest.MockedFunction<typeof authUtils.getAuthJwt>;
-  let mathRandomSpy: jest.SpyInstance<number, []>;
 
   beforeEach(() => {
     originalWs = global.WebSocket;
@@ -77,13 +76,11 @@ describe('WebSocketProvider', () => {
     mockGetAuthJwt = authUtils.getAuthJwt as jest.MockedFunction<typeof authUtils.getAuthJwt>;
     mockGetAuthJwt.mockReturnValue('fresh-token');
 
-    mathRandomSpy = jest.spyOn(Math, 'random').mockReturnValue(0.5);
     jest.clearAllMocks();
   });
 
   afterEach(() => {
     (global as any).WebSocket = originalWs;
-    mathRandomSpy.mockRestore();
     jest.useRealTimers();
   });