docs(replay): best practices for integrating masking/blocking in app code - #19298
Merged
Conversation
…app code Adds guidance for hooking global masking rules into an i18n layer, making mask/block/unmask explicit in shared React components, and blocking profile-image/avatar components that use CSS background-image instead of <img> (not covered by the default block list). Co-Authored-By: James Keane <james.keane@sentry.io>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
1 Skipped Deployment
|
github-actions
Bot
added
the
Priority: Needs Triage
Contributor
|
Please update the IS YOUR CHANGE URGENT? section of the PR description:
This information helps the Docs team prioritize your review. |
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
jameskeane
reviewed
Sep 8, 2026
- export/import staticStrings across the i18n.js/sentry.js examples so the maskFn snippet doesn't throw a ReferenceError - add a warning that data-sentry-unmask requires opting into the unmask selector explicitly on SDK v8+ (unmask/unblock no longer ship default DOM selectors)
Match the prose (which mentions both sentry-unmask and data-sentry-unmask) by including .sentry-unmask in the unmask config example, not just the data attribute selector.
ryan953
reviewed
Sep 8, 2026
Only cache a translated string as safe-to-unmask when it has no
interpolated placeholders. An interpolated result (e.g. 'Hello Ryan')
can contain user data even though its template ('Hello {name}') is
static copy.
ryan953
reviewed
Sep 8, 2026
…n bugs A <span> wrapper produces invalid HTML (and SSR hydration mismatches) if the wrapped component renders a block-level element. Switch to a <div> wrapper and note why.
|
@sentry-junior Fix this 404 error:
|
jameskeane
enabled auto-merge (squash)
September 9, 2026 14:29
jameskeane
approved these changes
Sep 9, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Adds a "Best Practices for Masking and Blocking in Your Codebase" section to the JS Session Replay privacy page (
docs/platforms/javascript/common/session-replay/privacy.mdx), per the discussion in #discuss-replay about giving coding agents (and humans) concrete integration patterns instead of relying on hand-written skills.Covers:
t()/formatMessage()) and use a custommaskFnto unmask only known-safe static copy, mirroring the pattern Sentry's own web app uses (isStaticString+maskFninuseReplayInit).withReplayMaskHOC so privacy rules live in design-system primitives, not individual pages.divavatars using CSSbackground-image(letter-avatar fallbacks, Gravatar, custom pipelines) aren't covered by the defaultimg/svg/videoblock list, with a workedProfileAvatarexample usingdata-sentry-block.First pass per James's request — happy to iterate on tone/placement.
via james.keane.
--
View Junior Session [Sentry]