Session Replay
Session Replay captures screenshot-based recordings of user sessions with full lifecycle control and privacy masking. View replays in the Desktop App to understand exactly what users experienced.
How It Works
The replay system periodically captures screenshots of your app’s screen. These frames are streamed to the Desktop App via WebSocket during debug sessions, or stored locally for later review.
- Screenshot-based — captures visual state, not DOM
- Configurable capture rate — control frame frequency
- Privacy masking — redact sensitive areas
- Start/stop/pause/resume — full lifecycle control
Enabling Session Replay
App.tsxtypescript
await WhatzBug.init({
projectId: 'your-project-id',
publishableKey: 'pk_your_key',
features: {
replay: true, // default: true
},
});Controlling Replay Lifecycle
// Start recording
WhatzBug.replay.start();
// Pause recording (e.g., on sensitive screens)
WhatzBug.replay.pause();
// Resume recording
WhatzBug.replay.resume();
// Stop recording
WhatzBug.replay.stop();Privacy Controls
Mask sensitive areas of the screen to prevent PII from appearing in replay frames:
// Set privacy mode for sensitive screens
WhatzBug.replay.setPrivacy('masked');
// Adjust quality to balance detail vs bandwidth
WhatzBug.replay.setQuality('medium');Important
Session Replay captures screenshots, not video. This approach is more efficient and gives you control over exactly when captures occur. Privacy masking is applied before frames leave the device.
Viewing Replays
The Desktop App’s Replay Panel provides:
- Frame timeline — scrub through captured screenshots
- Playback controls — play, pause, speed control
- Session correlation — replay frames are linked to network, logs, and crash events
- Session save — save complete sessions with replay data to SQLite for later review
Note
Cloud-based replay sharing is not yet available. Currently, replays are viewable only in the Desktop App.
Disabling Session Replay
await WhatzBug.init({
projectId: 'your-project-id',
features: {
replay: false,
},
});