Test React component using trpc client and `useSuspenseQuery`

describe('Navigation menu', () => {
  const mockServer = mockttp.getLocal({
    cors: {...},
  });

  ...

  it('should display the nav menu', async () => {
    const reqUrl = '/ConversationAPI.countPendingConversations';
    const mockedStream = new PassThrough();
    await mockServer.forGet(reqUrl).thenStream(200, mockedStream);

    render(
      <Suspense fallback={<div>Loading...</div>}>
        <Nav />,
      </Suspense>
    );

    mockedStream.emit('data', {
      pending: 0,
    });
    mockedStream.emit('end');

    await waitFor(() => {
      return expect(screen.getByTestId('badge')).toBe('0');
    });
  });

console.error
  Error: Error: socket hang up
      at Object.dispatchError ([...]/node_modules/jsdom/lib/jsdom/living/xhr/xhr-utils.js:63:19)
      ...
      at processTicksAndRejections (node:internal/process/task_queues:82:21) {
    type: 'XMLHttpRequest'
  }