Learn to effectively mock WebSocket APIs using Mock Service Worker (MSW) in this comprehensive 43-minute tutorial. Master essential techniques from basic setup to advanced implementations, including intercepting WebSocket connections, handling client events, broadcasting mocked messages, and managing client connections. Explore type-safe communication using Zod, establish actual server connections, handle server events, and implement testing strategies with Vitest and Playwright. Gain practical knowledge in preventing event propagation, understanding WebSocket logs, and implementing runtime handler overrides to create robust and reliable WebSocket mocks for your applications.
Overview
Syllabus
- Introduction to Mocking WebSocket APIs with Mock Service Worker
- Install Mock Service Worker (MSW)
- 03 - Set Up MSW in the Browser
- 04 - Intercept a WebSocket connection with Mock Service Worker
- 05 - Intercept WebSocket Client Events with Mock Service Worker
- 06 - Broadcast a Mocked Message to All WebSocket Clients
- 07 - Modify WebSocket Client Events with Mock Service Worker
- 08 - Replay WebSocket Events with Mock Service Worker
- 09 - Make a Type-safe and Runtime-safe WebSocket Communication with Zod
- 10 - Close a WebSocket Client Connection with Mock Service Worker
- 11 - Use Non-configurable Close Code to Close a WebSocket Connection with MSW
- 12 - Close Multiple WebSocket Clients with MSW
- 13 - Establish Actual WebSocket Server Connection with MSW
- 14 - Intercept WebSocket Server Events with MSW
- 15 - Modify WebSocket Server Events with MSW
- 16 - Prevent Client-to-Server WebSocket Events Forwarding with MSW
- 17 - Prevent WebSocket Server Close Event with MSW
- 18 - Prevent WebSocket Event Propagation Between Listeners with MSW
- 19 - Understand WebSocket Logs in MSW
- 20 - Test WebSockets in Vitest with MSW
- 21 - Test WebSockets in Playwright with MSW
- 22 - Runtime WebSocket Event Handler Overrides with MSW
Taught by
Artem Zakharchenko