Mobile App Session Replay: Ability to disable or mask touch capture per screen

Open
#6,299 8 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
48/100
Issue type
Feature
Clarity
Mostly clear
Activity status
Active
Tech stack
react-native, typescript
Domain
mobile-dev, security

Research direction

Start by tracing the native touch tracker and the existing Sentry.Mask API. Compare the proposed per-component masking, a Sentry.MaskTouches wrapper, and global pause options. Done means sensitive screens or components no longer expose tap and drag coordinates in Session Replay, with behavior verified on the affected mobile platforms.

Written by the indexing model from the issue text.

Description

Feature React-Native Replays Security
Problem Statement

Currently, mobile Session Replay captures raw tap and drag gesture coordinates globally via the native touch tracker. While this is incredibly useful for debugging user flows, it introduces security/privacy risk on sensitive screens. Even when the mask strategy is strict and the keyboard doesn't show, the global touch overlay still records and displays the exact coordinates of user taps/drags over the relay. If a user is typing on a standard QWERTY keyboard or a fixed-layout numeric keypad, an observer can easily deduce inputs (passwords, PINs, or PII etc) just by looking at the tap indicator positions on the masked replay.

I would like to see the ability to drop touches for components/views.

Image
Solution Brainstorm
  • Extend Sentry.Mask with a prop to disable touches? Or maybe a new wrapper Sentry.MaskTouches?
  • Failing that, we'd be better off with a global way to pause/unpause or just don't record any at all
Are you willing to submit a PR?

None

Dominant language
TypeScript
Stars
1.8k
Forks
367
Avg merge
1d 4h
Merged PRs (30d)
96

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from getsentry/sentry-react-native

All issues in getsentry/sentry-react-native

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.