Session replay — what it is and how to enable it

Session replay is one of the most useful signals in a Yaplet bug report. Instead of reading a description of what happened, you watch it — clicks, scrolling and page changes, reconstructed as a replay. This article explains what it captures, how the privacy model works, and how to turn it on.

What session replay captures

When it is switched on, Yaplet records a stream of page snapshots in the background and attaches the run-up to the report when a bug is submitted. The replay includes:

• Mouse cursor movements and clicks
• Keyboard input (see masking below)
• Page scrolling
• Page changes — elements appearing, disappearing or changing state
• Style changes — animations and transitions
• Network request timing, shown alongside as a summary
• Console errors, shown alongside as a summary

It is not a video file. It is an event log replayed in a sandboxed frame in your dashboard, so recording costs your visitors almost nothing in performance.

What Yaplet masks automatically

Session replay is built on rrweb, an open-source page-recording library. Without any work from you, Yaplet applies these protections before anything leaves the browser:

• Password fields — the recorder never captures the value of an <input type="password">.
• Canvas content and cross-origin frames — never recorded at all.
• Large embedded images — stripped out of oversized recordings rather than uploaded.

That is the whole list. There is no automatic masking of personal data beyond passwords. Anything else on the page — names, email addresses, order numbers — is recorded as shown unless you tag it yourself.

What you can mask yourself

Add one of these classes in your own HTML to control what the recorder does with an element:

• gl-block — the element is left out of the recording entirely and replaced with a placeholder of the same size.
• gl-mask — the element's text is replaced with asterisks.

How to turn it on

1. In the sidebar, open Brand → (your brand) → Chat widget.
2. Open the Features tab and find the SDK Features section. (If you cannot see that section at all, your organisation has not added Session replays — it is a $12/month add-on. If your organisation does have it and you still cannot see the section, you have not been granted the Session Replays permission; ask your administrator.)
3. Switch Session Replays on.
4. Click Save Changes.

It is off until you do this. Once it is on, a Recording Rules setting appears underneath it: Configure rules lets you limit which pages and which visitors are recorded, and it reads "Recording all pages" until you set any. Use it to keep the recorder away from checkout, account or admin pages.

How long recordings are kept

Recordings are not kept for a fixed number of days. Each chat widget has a storage budget instead, and once it is full the oldest recording is deleted to make room for the newest one. The add-on comes with 50 slots of roughly 2 MB each — a long or busy session uses more than one slot — and higher plans get more.

Pin a recording you need to keep and the clean-up skips it, up to half the budget. Very long sessions stop recording on their own at 6 hours or 50 MB. A replay attached to a bug report is stored with that ticket and stays as long as the ticket does.

Extending privacy controls via the SDK

Your development team can go further with Yaplet.setReplayOptions(options), called before Yaplet.initialize(). Useful options:

• maskAllInputs: true — masks every text input value, not just passwords.
• maskTextSelector: ".sensitive-data" — masks the text of anything matching a CSS selector.
• blockSelector: "#payment-form" — keeps a whole section out of the recording.
• recordCanvas: true — records <canvas> content, which Yaplet leaves off by default because it is expensive.

Network log privacy is separate: Yaplet.setNetworkLogsBlacklist(["api.payments.com"]) and Yaplet.setNetworkLogPropsToIgnore(["Authorization"]).

GDPR considerations

Session replay records how a person used your site, which is personal data. To stay on the right side of it:

• Disclose session replay in your privacy policy and cookie notice.
• Turn on maskAllInputs: true unless you have a specific reason to record what people type.
• Use blockSelector, or the Recording Rules above, to keep any screen showing personal or financial data out of the recording.

For where Yaplet stores this data and what our data processing agreement covers, see Data processing agreement and data residency.