Data masking
Blank the sensitive stuff before it hits the screenshot
Give Bugpot a list of CSS selectors and it replaces matching elements with solid blocks before the screenshot is taken. Card numbers, personal details and half-typed passwords are removed at source — before anything leaves the reporter’s browser.
How it works
CSS selectors, applied in the browser, at capture time
Configure the masking list in your project settings. When the reporter opens the widget and takes a screenshot, Bugpot walks the DOM, finds anything matching your selectors, and paints a solid block over each match before rendering the capture. The original elements are never serialised or transmitted.
- Standard CSS selectors — IDs, classes, attributes, combinators
- Masks applied in-browser, before any capture pass runs
- Also applied on the pixel-perfect getDisplayMedia fallback
- Matching keys redacted in the captured network log
# CSS selectors — matched elements are blanked
# before the screenshot is captured.
mask_selectors:
- "[data-private]"
- ".card-number"
- "input[type=password]"
- "#customer-address"
- ".order-total"
# Payload keys redacted in the captured network log.
redact_keys:
- "password"
- "cardNumber"
- "cvv"
- "authorization"Selector recipes
A few selectors covers most sites
You don’t need to catalogue every field on your site. A handful of well-chosen selectors will cover the common patterns.
Every password field
Blanks any password input on the page. Works everywhere without needing per-page config.
input[type=password]
Card number widgets
Covers Stripe Elements, hand-rolled cards and browser autocomplete-tagged fields.
.card-number, [autocomplete="cc-number"]
Anything marked private
Add data-private to elements as you go — a design system attribute you never regret.
[data-private]
Signed-in user chip
Keep names, emails and avatars out of screenshots when the reporter is signed in.
.header-user, .avatar-name
Payment totals
Money on the page is often the thing not to share when a screenshot leaves the building.
.order-total, .price-large
Personal address blocks
Post codes, phone numbers, names — hidden even from your own triage inbox.
#customer-address, .shipping-details
What we guarantee
Masking is a first-class capture step
Masking runs as part of the same pass that produces the screenshot. If a matched element isn’t blanked, the capture is discarded and the reporter is asked to try again — the widget never falls back to an unmasked screenshot.
Applied before every capture
DOM snapshot and pixel-perfect mode both walk the mask list before painting the final image.
Applied before the buffer serialises
The captured network log redacts matching payload keys in the same pass; the raw values never enter the report.
Fails closed
If masking cannot run for any reason, the widget aborts the capture and shows the reporter an error.
Auditable
Every masking-list change is recorded in the workspace audit log with the actor and the previous value.
Keep sensitive fields out of every ticket
Add a masking list to your project and Bugpot will blank matches before any screenshot leaves the reporter’s browser.