loading...

Test Socket.io backend in 10sec with Firecamp

nishchit14 profile image Nishchit Updated on ・2 min read

Problem


Testing and debugging of the Socket.IO real-time events is not as easy as today's REST. The only way to test it is by creating extra front-end with jQuery/HTML and use console.log there. Sometimes the hard-coded mocha test can work.

But this way is more complex, expensive in time, less manageable and indeed lower confident about the code quality and best practices.

Solution


Firecamp, It's a GUI testing client for the SocketIO and WebSocket.

FC completely removes the frontend dependencies for testing and rapidly boost the development of real-time engineering (RTE) by saving extra time and efforts. Socket requests can be saved for the future purpose so again in future engineers can start debugging it in 5-10 seconds in case of an emergency.

SocketIO has mainly three elements

  1. Connection URL - Connect to socket URL
  2. Listener - Listen to events from the server
  3. Emitter - Emit events to the server

We'll take an example of the real-time drawing app built by Ali Spittle.

  1. Demo App: https://www.alispit.tel/websocket-drawing/
  2. Back-end: https://github.com/aspittel/websocket-drawing-backend/blob/master/app.js
  3. Front-end: https://github.com/aspittel/websocket-drawing/blob/master/src/App.js

From the backend server and demo app, we have the

  1. Connection URL,
    • https://agile-taiga-80620.herokuapp.com
    • and path /socket.io
  2. Listners
    • color_change
  3. emitters
    • color_change
    • payload: { "color": "#e0e0e0", "id": 71 }

This video will show the main three steps for debugging the socket events. Connect, Listen and Emit, that simple.

Thank you Ali Spittel for the the real-time drawing app and the article.

Discussion

markdown guide