Manual WebSocket
Table of Contents:
-
-
-
- mws.
track
(method) - mws.
untrack
(method) - mws.
readyState
(object with constants) - mws.
trackedConnections
(object with methods)- mws.trackedConnections.
getAll
(method) - mws.trackedConnections.
getByUrl
(method) - mws.trackedConnections.
when
(method)
- mws.trackedConnections.
- mws.
when
(method) - mws.
bus
(event emitter) - mws.
busEvent
(object with constants)
- mws.
-
Instance of
ManualWebSocketConnection
- WebSocket methods
- ability to change readyState by hand
- connection.
addServerScenario
(method)
-
Example:
Motivation:
There are many ways for stubbing http responses, for example in cypress we can use cy.route()
.
But there is no out of the box way to stub WebSocket communication.
Manual WebSocket is built to serve that purpose.
Check repository https://github.com/baal-cadar/manual-web-socket-example
for working example.
Documentation
The big picture
- Replace native
WebSocket
constructor withManualWebSocketConnection
- Tell
ManualWebSocket
which addresses to track - When
new WebSocket(addr)
is executed:- Check if
addr
is marked to be tracked- If yes - create
ManualWebSocketConnection
instance - If not - create
WebSocket
instance
- If yes - create
- Check if
ManualWebSocket
object gives you access to tracked connections, so you can manipulate them with no need to make any changes in your application code. Also can act as a server, creating fake communication channel.
Global scope:
windowManualWebSocket = windowMWS = windowmws;
Public API:
1. Global object:
track
1. mws.Add addresses you want to be tracked.
Can be used multiple times, each time it will add new addresses to the tracked list.
Be aware that track
will not close nor replace active connection.
Just next time when WebSocket will be created using given address, it will be marked as tracked
.
public track: addresses: Array<string | RegExp>: void
Example:
mws; /* address can be string or RegExp */mws;
untrack
2. MWS.Remove addresses you want don't want to be tracked next time.
Be aware that untrack
will not close nor replace active connection.
Just next time when WebSocket will be created using given address, it won't be marked as tracked
.
public untrack: addresses: Array<string | RegExp>: void
Example:
mws; /* address can be string or RegExp */mws;
readyState
3. MWS.WebSocket ready state constants:
enum ReadyState CONNECTING = 0 OPEN = 1 CLOSING = 2 CLOSED = 3
Example:
connectionreadyState = mwsreadyStateOPEN; /** * By the way - setting a new state will trigger proper callbacks * For example `OPEN` will trigger `onOpen` and callbacks registered with `.on('open', ...)` */
trackedConnections
4. MWS.Container with all tracked connections. Exposes public interface:
public : ManualWebSocketpublic : ManualWebSocket | undefinedpublic : Promise<ManualWebSocket>
-
trackedConnections.
getAll
- returns list of all active tracked connectionspublic : ManualWebSocketExample:
mwstrackedConnections; -
trackedConnections.
getByUrl
- returns connection with given url (explicit)public : ManualWebSocket | undefinedExample:
const connection = mwstrackedConnections; -
trackedConnections.
when
- returns a promise that will resolve into a valid connection. If connection already exists, will resolve immediatelypublic : Promise<ManualWebSocket>Example:
const promise = mwstrackedConnections// ormwstrackedConnections
when
5. MWS.Alias to mws.trackedConnections.when
bus
6. MWS.Event emitter. Will trigger callbacks upon ManualWebSocket creation - if you need to do some private business
.
Example:
mwsbus; // or just simplymwsbus;
busEvent
7. MWS.List of events that you can subscribe to on mws.bus
.
Currently there is only one event
- MANUAL_WEBSOCKET_CREATED : will run given callback with created
connection
(see example above)
Example:
console;
ManualWebSocketConnection
:
2. Instance of addServerScenario
1. connection.Prepare server response for given message. Use connection.send()
to trigger scenario.
public : void
Example:
const message = "some message";connection; connection;
How to use it in your project?
module
- Cypress example:
1. Setup using - Install package
yarn add manual-web-socket --dev
- Require in test
const manualWebSocket = ;
- Inject script at the top of
header
section inonBeforeLoad
stage. UsegetScript
and place it manually
cy;
- Now you'll have access to
ManualWebSocket
object inwin
scope.
module
- raw html:
2. Setup without - Download
manual-web-socket.raw.js
file - Place it on top of
<head>
in yourindex.html