All masking happens client-side, inside the recorder, while the DOM is being serialized. Masked or blocked content never leaves the user’s browser: it is not captured, buffered, or sent in any form.
What is masked by default
Out of the box, the SDK masks the contents of:
<input type="password"><input type="email"><input type="tel">
Masked input values are replaced with asterisks in the recording. Everything else, including other input fields and page text, is recorded as-is unless you configure otherwise.
The SDK does not automatically detect and mask sensitive text that appears outside those input types, such as credit card numbers rendered in page content. If your product displays sensitive data, mask or block those elements explicitly using the classes and selectors below.
Controlling elements with CSS classes
Three classes are honored by default. Add them directly in your markup, no SDK configuration needed:
The class names themselves are configurable via maskTextClass, blockClass, and ignoreClass if you cannot use the defaults.
Controlling elements with CSS selectors
If you cannot add classes to your markup, target elements with selectors instead:
Selectors and classes combine: an element matching either is treated accordingly.
Choosing between mask, block, and ignore
- Mask when the layout matters but the content is sensitive: balances, names, message text.
- Block when the whole region should not be captured: embedded third-party widgets, document viewers, video.
- Ignore when the element can be shown but what the user types into it should not be captured.
What this feature does not do
To keep the privacy story honest:
- There is no automatic detection of credit card numbers, government IDs, or emails in page text. Mask those regions explicitly.
- The SDK does not ship consent management. If you need user consent before recording, gate the
init() call behind your own consent flow.
