feat(replay): Add SentryMask and SentryUnmask iOS components #4224

krystofwoldrich · 2024-10-31T16:22:38Z

📢 Type of change

Bugfix
New feature
Enhancement
Refactoring

📜 Description

This PR adds custom redact/mask components for iOS.

The implementation includes noop fallback for Android and other unsupported platforms and fallback Web implementation. These will be added in a follow up PRs.

import * as Sentry from '@sentry/react-native'

const Example = () => (
  <View>
    <Sentry.Unmask>
      <Text>This is unmasked because it's direct child of Sentry.Unmask (can be masked if Sentry.Masked is used higher in the hierarchy)</Text>
      <Sentry.Mask>
        <Text>This is masked always because it's a child of a Sentry.Mask</Text>
        <Sentry.Unmask>
          {/* Sentry.Unmask does not override the Sentry.Mask from above in the hierarchy */}
          <Text>This is masked always because it's a child of Sentry.Mask</Text>
        </Sentry.Unmask>
      </Sentry.Mask>
    </Sentry.Unmask>
  </View>
);

Device	Replay

Todo

Give feedback

Requires https://github.com/getsentry/sentry-cocoa/releases/tag/8.40.0
internal(replay): Add IgnoreWrapper class for hybrid SDKs sentry-cocoa#4522
iOS Legacy Native Components
iOS New Arch Components
Android Legacy Components (in a follow up PR)
Android New Arch Components (in a follow up PR)
Web Component (in a follow up PR)
Options

💡 Motivation and Context

This is a part of RN Replay GA tasks

[Epic] Mobile Replay: GA sentry#74441

💚 How did you test it?

ci, local,

📝 Checklist

I reviewed submitted code
I added tests to verify changes
No new PII added or SDK only sends newly added PII if sendDefaultPII is enabled
All tests passing
No breaking changes

🔮 Next steps

github-actions · 2024-10-31T16:23:07Z

	Messages
📖	Do not forget to update Sentry-docs with your feature once the pull request gets approved.

Generated by 🚫 dangerJS against eb457fc

github-actions · 2024-10-31T16:33:26Z

Android (legacy) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	478.92 ms	473.89 ms	-5.03 ms
Size	17.74 MiB	20.08 MiB	2.35 MiB

Baseline results on branch: main

Startup times

Revision	Plain	With Sentry	Diff
`5446992`	403.40 ms	426.70 ms	23.30 ms
`700cbf4`	425.56 ms	436.26 ms	10.70 ms
`15c80ab`+dirty	336.27 ms	350.58 ms	14.31 ms
`8ae23a7`	526.83 ms	513.38 ms	-13.45 ms
`12427f4`	393.69 ms	414.84 ms	21.14 ms
`e1ea4a8`	506.82 ms	510.48 ms	3.66 ms
`e5c9b8b`	409.02 ms	426.66 ms	17.64 ms
`5571a20`	410.55 ms	441.06 ms	30.51 ms
`fe13591`	478.92 ms	480.84 ms	1.92 ms
`9c48b2c`	349.24 ms	385.96 ms	36.72 ms

App size

Revision	Plain	With Sentry	Diff
`5446992`	17.73 MiB	19.85 MiB	2.12 MiB
`700cbf4`	17.73 MiB	20.07 MiB	2.33 MiB
`15c80ab`+dirty	17.73 MiB	20.04 MiB	2.31 MiB
`8ae23a7`	17.74 MiB	20.07 MiB	2.34 MiB
`12427f4`	17.73 MiB	19.85 MiB	2.12 MiB
`e1ea4a8`	17.74 MiB	20.08 MiB	2.34 MiB
`e5c9b8b`	17.73 MiB	19.83 MiB	2.10 MiB
`5571a20`	17.73 MiB	19.93 MiB	2.19 MiB
`fe13591`	17.74 MiB	20.07 MiB	2.34 MiB
`9c48b2c`	17.73 MiB	19.80 MiB	2.07 MiB

github-actions · 2024-10-31T16:46:25Z

iOS (new) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	1227.00 ms	1238.17 ms	11.17 ms
Size	2.92 MiB	3.64 MiB	743.77 KiB

Baseline results on branch: main

Startup times

Revision	Plain	With Sentry	Diff
`12427f4`+dirty	1224.90 ms	1231.40 ms	6.50 ms
`5446992`+dirty	1249.94 ms	1254.80 ms	4.86 ms
`e73d82f`+dirty	1231.20 ms	1228.81 ms	-2.40 ms
`148f924`+dirty	1220.72 ms	1221.30 ms	0.58 ms
`fe13591`+dirty	1250.69 ms	1246.27 ms	-4.43 ms
`1faf8e3`+dirty	1223.38 ms	1220.56 ms	-2.82 ms
`484813b`+dirty	1225.07 ms	1221.00 ms	-4.07 ms
`4a6664f`+dirty	1218.77 ms	1221.07 ms	2.30 ms
`e5bc97b`+dirty	1229.17 ms	1227.64 ms	-1.54 ms
`15c80ab`+dirty	1248.41 ms	1251.24 ms	2.83 ms

App size

Revision	Plain	With Sentry	Diff
`12427f4`+dirty	2.92 MiB	3.44 MiB	533.29 KiB
`5446992`+dirty	2.92 MiB	3.44 MiB	535.26 KiB
`e73d82f`+dirty	2.92 MiB	3.64 MiB	740.56 KiB
`148f924`+dirty	2.92 MiB	3.60 MiB	701.88 KiB
`fe13591`+dirty	2.92 MiB	3.66 MiB	757.71 KiB
`1faf8e3`+dirty	2.92 MiB	3.64 MiB	742.61 KiB
`484813b`+dirty	2.92 MiB	3.64 MiB	740.56 KiB
`4a6664f`+dirty	2.92 MiB	3.60 MiB	702.09 KiB
`e5bc97b`+dirty	2.92 MiB	3.66 MiB	758.40 KiB
`15c80ab`+dirty	2.92 MiB	3.39 MiB	481.56 KiB

github-actions · 2024-10-31T16:49:29Z

iOS (legacy) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	1220.49 ms	1226.37 ms	5.88 ms
Size	2.36 MiB	3.10 MiB	757.24 KiB

Baseline results on branch: main

Startup times

Revision	Plain	With Sentry	Diff
`77680ec`+dirty	1231.81 ms	1238.35 ms	6.54 ms
`1faf8e3`+dirty	1214.87 ms	1222.83 ms	7.97 ms
`7bc4d75`+dirty	1233.40 ms	1229.56 ms	-3.83 ms
`d7401ac`+dirty	1252.38 ms	1275.04 ms	22.66 ms
`8ae23a7`+dirty	1230.02 ms	1227.62 ms	-2.40 ms
`5a22220`+dirty	1209.49 ms	1220.94 ms	11.45 ms
`80b2ce3`+dirty	1265.92 ms	1268.60 ms	2.69 ms
`b95b8af`+dirty	1221.39 ms	1228.52 ms	7.13 ms
`d0bf494`+dirty	1289.40 ms	1298.40 ms	9.00 ms
`f06c879`+dirty	1252.64 ms	1259.66 ms	7.02 ms

App size

Revision	Plain	With Sentry	Diff
`77680ec`+dirty	2.36 MiB	3.10 MiB	753.42 KiB
`1faf8e3`+dirty	2.36 MiB	3.08 MiB	736.75 KiB
`7bc4d75`+dirty	2.36 MiB	3.10 MiB	752.58 KiB
`d7401ac`+dirty	2.36 MiB	2.83 MiB	481.14 KiB
`8ae23a7`+dirty	2.36 MiB	3.10 MiB	752.42 KiB
`5a22220`+dirty	2.36 MiB	2.92 MiB	570.21 KiB
`80b2ce3`+dirty	2.36 MiB	2.84 MiB	486.98 KiB
`b95b8af`+dirty	2.36 MiB	3.14 MiB	793.32 KiB
`d0bf494`+dirty	2.36 MiB	2.83 MiB	481.15 KiB
`f06c879`+dirty	2.36 MiB	2.88 MiB	530.42 KiB

…-redact-components

…act-components

…-redact-components

…droid

…mponents

github-actions · 2024-11-08T18:42:34Z

Android (new) Performance metrics 🚀

	Plain	With Sentry	Diff
Startup time	378.38 ms	418.32 ms	39.94 ms
Size	7.15 MiB	8.37 MiB	1.22 MiB

Baseline results on branch: main

Startup times

Revision	Plain	With Sentry	Diff
`7fd512a`+dirty	439.69 ms	503.71 ms	64.01 ms
`0d3e677`+dirty	384.24 ms	431.45 ms	47.21 ms
`15c80ab`+dirty	276.38 ms	327.54 ms	51.17 ms
`0db0c72`+dirty	335.20 ms	351.06 ms	15.86 ms
`e2b64fe`+dirty	258.82 ms	304.26 ms	45.44 ms
`1c65324`+dirty	381.10 ms	427.26 ms	46.16 ms
`5a22220`+dirty	384.61 ms	419.06 ms	34.45 ms
`728164b`+dirty	335.93 ms	342.94 ms	7.01 ms
`62a750b`+dirty	370.78 ms	376.73 ms	5.96 ms
`c398f67`+dirty	315.08 ms	345.60 ms	30.52 ms

App size

Revision	Plain	With Sentry	Diff
`7fd512a`+dirty	7.15 MiB	8.35 MiB	1.21 MiB
`0d3e677`+dirty	7.15 MiB	8.35 MiB	1.20 MiB
`15c80ab`+dirty	7.15 MiB	8.09 MiB	966.13 KiB
`0db0c72`+dirty	7.15 MiB	8.04 MiB	911.02 KiB
`e2b64fe`+dirty	7.15 MiB	8.07 MiB	947.16 KiB
`1c65324`+dirty	7.15 MiB	8.22 MiB	1.07 MiB
`5a22220`+dirty	7.15 MiB	8.21 MiB	1.06 MiB
`728164b`+dirty	7.15 MiB	8.12 MiB	997.71 KiB
`62a750b`+dirty	7.15 MiB	8.21 MiB	1.06 MiB
`c398f67`+dirty	7.15 MiB	8.21 MiB	1.07 MiB

samples/react-native-macos/src/Screens/PlaygroundScreen.tsx

packages/core/test/replay/CustomMask.test.ts

…getsentry/sentry-react-native into kw/feat/replay-custom-redact-components

Co-authored-by: LucasZF <[email protected]>

packages/core/package.json

packages/core/ios/RNSentryReplay.m

CHANGELOG.md

packages/core/ios/RNSentryReplay.m

feat(replay): Add SentryMask and SentryUnmask native components

0fc1b42

krystofwoldrich added 8 commits November 4, 2024 14:53

add clang-format

9933a86

apply the formatter

e17ac31

Merge remote-tracking branch 'origin/main' into kw/feat/replay-custom…

534cbce

…-redact-components

Merge remote-tracking branch 'origin/main' into kw/internal/clag-format

ef863a1

Merge branch 'kw/internal/clag-format' into kw/feat/replay-custom-red…

d317e1e

…act-components

fix clang format

eb9d2de

add native architecture masks for ios

cbf400a

Merge remote-tracking branch 'origin/main' into kw/feat/replay-custom…

be04dfc

…-redact-components

krystofwoldrich mentioned this pull request Nov 5, 2024

[Epic] Mobile Replay: GA getsentry/sentry#74441

Open

krystofwoldrich added 6 commits November 5, 2024 18:52

add js tests

77691bd

fix eslint changing the native props interface to type

45374be

Fix mask components for non uikit builds

0a127d2

add changelog

4f5b967

fix typo

eb64e8d

fix ts3.8 type check test

32c45e4

krystofwoldrich mentioned this pull request Nov 6, 2024

test(ts3.8): fix ts3.8 type check test to not include dom types #4238

Merged

Merge branch 'kw/fix/type-check' into kw/feat/replay-custom-redact-an…

691f8f4

…droid

krystofwoldrich changed the base branch from main to kw/fix/type-check November 6, 2024 15:21

krystofwoldrich added 3 commits November 6, 2024 16:57

fix new arch build decoupled replay and replay mask

02bb913

fix missing react native types

5315bb2

Merge branch 'kw/fix/type-check' into kw/feat/replay-custom-redact-co…

f07f155

…mponents

Base automatically changed from kw/fix/type-check to main November 6, 2024 16:35

Merge branch 'main' into kw/feat/replay-custom-redact-components

1b1c435

Update mask sample

cdd3da8

Merge branch 'main' into kw/feat/replay-custom-redact-components

503c992