A way to trigger Web Socket onerror before connection event

[sfc-gh-jtjhin]

Scope

Improves an existing behavior

Compatibility

• This is a breaking change

Feature description

I'd like to be able to test if the a web socket connection erroring e.g. firewall issue
Similar to https://mswjs.io/docs/recipes/network-errors for REST requests

[kettanaito]

Hi, @sfc-gh-jtjhin. Yes, you can emulate the error event on a WebSocket. That event represents connection errors, and to achieve it you can throw an error in the connection event listener:

const api = ws.link('wss://localhost')

export const handlers = [
  api.addEventListener('connection', () => {
    throw new Error('Connection error')
  })
]

This will get translated to a connection error, and will trigger both close and error events per spec (implementation reference).

This works because the connection event is dispatched while your WebSocket client is still in the CONNECTING ready state. That is precisely for you to be able to error that connection before it is open. If you don't error it, the (mocked) connection will open at the next event loop tick.

[sfc-gh-jtjhin]

@kettanaito Actually I can't get it to fail on a simplified test:

import { ws } from 'msw';
import { setupServer } from 'msw/node';

describe('Web socket test', () => {
  beforeEach(() => {
    const api = ws.link('wss://example.com/path');

    const server = setupServer(
      api.addEventListener('connection', () => {
        console.log('connecting');
        throw new Error('Connection error');
      }),
    );
    server.listen();
  });

  it('Connection should error', (done) => {
    const connection = new WebSocket('wss://example.com/path');
    connection.onerror = (e) => {
      console.log('onerror', e);
      done();
    };

    connection.onclose = (e) => {
      console.log('onclose', e);
    };

    connection.onopen = () => {
      console.log('onopen');
      throw new Error('Connection should not be opened');
    };
  });
});

this logs:

connecting...
onopen

But never reaches onerror

[sfc-gh-jtjhin]

Okay I put a bunch of console logs in and the error thrown from the connection handler is definitely getting eaten by the event emitter and not hitting the catch block.

[kettanaito]

@sfc-gh-jtjhin, can you please put it in a standalone repo for me to reproduce? That'd be great.

[joshua-tj]

@kettanaito here you go https://github.com/joshua-tj/msw-ws-onerror-test/

[sfc-gh-jtjhin]

@kettanaito were you able to reproduce it with the repo?