Skip to content

Commit 6e02345

Browse files
Apply suggestions from code review
Co-authored-by: Krystof Woldrich <31292499+krystofwoldrich@users.noreply.github.com>
1 parent 35aeb98 commit 6e02345

File tree

1 file changed

+6
-7
lines changed
  • docs/platforms/react-native/session-replay

1 file changed

+6
-7
lines changed

docs/platforms/react-native/session-replay/index.mdx

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -101,18 +101,18 @@ Sentry.mobileReplayIntegration({
101101

102102
## React Component Names
103103

104-
Sentry helps you capture your React components and unlock additional insights in your application. You can set it up to use React component names instead of selectors.
104+
Sentry helps you capture your React components and unlock additional insights in your application. You can set it up to use React component names.
105105

106-
So instead of looking at selectors like this:
106+
So instead of looking at this:
107107

108-
```html
109-
button.en302zp1.app-191aavw.e16hd6vm2[role="button"][data-test-id="common-options"]
108+
```html {tabTitle:Generic Components}
109+
View > Touchable > View > Text
110110
```
111111

112112
You can also see exactly which React component was used, like:
113113

114-
```html
115-
CommonOptions
114+
```html {tabTitle:React Components}
115+
MyCard (View, MyCard.ts) > MyButton (Touchable, MyCard.ts) > View > Text
116116
```
117117

118118
To add React Component Names use `annotateReactComponents` in `metro.config.js`.
@@ -124,7 +124,6 @@ module.exports = withSentryConfig(getDefaultConfig(__dirname), { annotateReactCo
124124
```
125125

126126
```js {tabTitle: Expo}
127-
// For Expo
128127
const { getSentryExpoConfig } = require("@sentry/react-native/metro");
129128
const config = getSentryExpoConfig(__dirname, { annotateReactComponents: true });
130129
```

0 commit comments

Comments
 (0)