@multiplayer-app/session-recorder-react-native 0.0.1-beta.2 → 0.0.1-beta.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/copy-react-native-dist.sh +1 -7
- package/dist/components/SessionRecorderWidget/FinalPopover.d.ts +11 -0
- package/dist/components/SessionRecorderWidget/FinalPopover.js +1 -0
- package/dist/components/SessionRecorderWidget/FinalPopover.js.map +1 -0
- package/dist/components/SessionRecorderWidget/FloatingButton.d.ts +8 -0
- package/dist/components/SessionRecorderWidget/FloatingButton.js +1 -0
- package/dist/components/SessionRecorderWidget/FloatingButton.js.map +1 -0
- package/dist/components/SessionRecorderWidget/InitialPopover.d.ts +13 -0
- package/dist/components/SessionRecorderWidget/InitialPopover.js +1 -0
- package/dist/components/SessionRecorderWidget/InitialPopover.js.map +1 -0
- package/dist/components/SessionRecorderWidget/ModalContainer.d.ts +8 -0
- package/dist/components/SessionRecorderWidget/ModalContainer.js +1 -0
- package/dist/components/SessionRecorderWidget/ModalContainer.js.map +1 -0
- package/dist/components/SessionRecorderWidget/SessionRecorderWidget.d.ts +5 -0
- package/dist/components/SessionRecorderWidget/SessionRecorderWidget.js +1 -0
- package/dist/components/SessionRecorderWidget/SessionRecorderWidget.js.map +1 -0
- package/dist/components/SessionRecorderWidget/icons.d.ts +10 -0
- package/dist/components/SessionRecorderWidget/icons.js +1 -0
- package/dist/components/SessionRecorderWidget/icons.js.map +1 -0
- package/dist/components/SessionRecorderWidget/index.d.ts +2 -0
- package/dist/components/SessionRecorderWidget/index.js +1 -0
- package/dist/components/SessionRecorderWidget/index.js.map +1 -0
- package/dist/components/SessionRecorderWidget/styles.d.ts +128 -0
- package/dist/components/SessionRecorderWidget/styles.js +1 -0
- package/dist/components/SessionRecorderWidget/styles.js.map +1 -0
- package/dist/context/SessionRecorderContext.d.ts +5 -3
- package/dist/context/SessionRecorderContext.js +1 -1
- package/dist/context/SessionRecorderContext.js.map +1 -1
- package/dist/index.d.ts +0 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/patch/xhr.js +1 -1
- package/dist/patch/xhr.js.map +1 -1
- package/dist/services/storage.service.d.ts +18 -2
- package/dist/services/storage.service.js +1 -1
- package/dist/services/storage.service.js.map +1 -1
- package/dist/session-recorder.d.ts +2 -1
- package/dist/session-recorder.js +1 -1
- package/dist/session-recorder.js.map +1 -1
- package/dist/utils/platform.d.ts +3 -0
- package/package.json +3 -6
- package/src/components/SessionRecorderWidget/FinalPopover.tsx +73 -0
- package/src/components/SessionRecorderWidget/FloatingButton.tsx +149 -0
- package/src/components/SessionRecorderWidget/InitialPopover.tsx +95 -0
- package/src/components/SessionRecorderWidget/ModalContainer.tsx +80 -0
- package/src/components/SessionRecorderWidget/SessionRecorderWidget.tsx +109 -0
- package/src/components/SessionRecorderWidget/icons.tsx +43 -0
- package/src/components/SessionRecorderWidget/index.ts +3 -0
- package/src/components/SessionRecorderWidget/styles.ts +137 -0
- package/src/context/SessionRecorderContext.tsx +12 -34
- package/src/index.ts +1 -9
- package/src/patch/xhr.ts +6 -7
- package/src/services/storage.service.ts +45 -4
- package/src/session-recorder.ts +9 -3
- package/tsconfig.json +1 -1
- package/RRWEB_INTEGRATION.md +0 -336
- package/VIEWSHOT_INTEGRATION_TEST.md +0 -123
- package/dist/components/GestureCaptureWrapper.d.ts +0 -6
- package/dist/components/GestureCaptureWrapper.js +0 -1
- package/dist/components/GestureCaptureWrapper.js.map +0 -1
- package/dist/expo.d.ts +0 -7
- package/dist/expo.js +0 -1
- package/dist/expo.js.map +0 -1
- package/dist/otel/instrumentations/gestureInstrumentation.d.ts +0 -15
- package/dist/otel/instrumentations/gestureInstrumentation.js +0 -1
- package/dist/otel/instrumentations/gestureInstrumentation.js.map +0 -1
- package/dist/otel/instrumentations/reactNativeInstrumentation.d.ts +0 -8
- package/dist/otel/instrumentations/reactNativeInstrumentation.js +0 -1
- package/dist/otel/instrumentations/reactNativeInstrumentation.js.map +0 -1
- package/dist/otel/instrumentations/reactNavigationInstrumentation.d.ts +0 -13
- package/dist/otel/instrumentations/reactNavigationInstrumentation.js +0 -1
- package/dist/otel/instrumentations/reactNavigationInstrumentation.js.map +0 -1
- package/dist/recorder/gestureHandlerRecorder.d.ts +0 -19
- package/dist/recorder/gestureHandlerRecorder.js +0 -1
- package/dist/recorder/gestureHandlerRecorder.js.map +0 -1
- package/dist/types/rrweb.d.ts +0 -118
- package/dist/types/rrweb.js +0 -1
- package/dist/types/rrweb.js.map +0 -1
- package/src/expo.ts +0 -11
package/RRWEB_INTEGRATION.md
DELETED
|
@@ -1,336 +0,0 @@
|
|
|
1
|
-
# RRWeb Integration for React Native Session Recorder
|
|
2
|
-
|
|
3
|
-
This document explains the rrweb-compatible event generation system implemented for React Native session recording.
|
|
4
|
-
|
|
5
|
-
## Overview
|
|
6
|
-
|
|
7
|
-
The React Native session recorder automatically generates rrweb-compatible events that can be replayed using standard rrweb players. **No manual intervention is required** - the system automatically captures:
|
|
8
|
-
|
|
9
|
-
1. **Screen snapshots** as `FullSnapshotEvent` with base64-encoded images (periodic + on interaction)
|
|
10
|
-
2. **Touch interactions** as `IncrementalSnapshotEvent` with `MouseInteraction` data (automatic)
|
|
11
|
-
3. **Navigation events** and other user interactions (automatic)
|
|
12
|
-
|
|
13
|
-
**Recording starts automatically when you call `sessionRecorder.start()` and stops when you call `sessionRecorder.stop()`.**
|
|
14
|
-
|
|
15
|
-
### 🚀 **Smart Change Detection**
|
|
16
|
-
|
|
17
|
-
The system now includes **intelligent change detection** that prevents duplicate events:
|
|
18
|
-
|
|
19
|
-
- **Automatic Comparison**: Each screen capture is compared with the previous one
|
|
20
|
-
- **Hash-Based Detection**: Uses lightweight hashing to detect changes quickly
|
|
21
|
-
- **Skip Unchanged Screens**: Only sends events when the screen actually changes
|
|
22
|
-
- **Touch-Triggered Capture**: Forces capture after touch interactions regardless of change detection
|
|
23
|
-
|
|
24
|
-
## Architecture
|
|
25
|
-
|
|
26
|
-
### Core Components
|
|
27
|
-
|
|
28
|
-
1. **RRWeb Types** (`src/types/rrweb.ts`)
|
|
29
|
-
|
|
30
|
-
- Complete TypeScript definitions for rrweb events
|
|
31
|
-
- React Native specific types for screen and touch data
|
|
32
|
-
|
|
33
|
-
2. **SessionRecorder** (`src/session-recorder.ts`)
|
|
34
|
-
|
|
35
|
-
- Main entry point with `recordEvent()` method for custom events
|
|
36
|
-
- Automatic touch recording (internal methods)
|
|
37
|
-
- Automatic screen capture coordination
|
|
38
|
-
|
|
39
|
-
3. **ScreenRecorder** (`src/recorder/screenRecorder.ts`)
|
|
40
|
-
|
|
41
|
-
- Captures screenshots and converts to `FullSnapshotEvent`
|
|
42
|
-
- Creates virtual DOM with `<img>` elements containing base64 screenshots
|
|
43
|
-
|
|
44
|
-
4. **GestureRecorder** (`src/recorder/gestureRecorder.ts`)
|
|
45
|
-
|
|
46
|
-
- Automatically converts touch events to rrweb `MouseInteraction` events
|
|
47
|
-
- Maps React Native coordinates to rrweb format
|
|
48
|
-
- Sets up automatic touch capture on session start
|
|
49
|
-
|
|
50
|
-
5. **TouchEventCapture** (`src/context/SessionRecorderContext.tsx`)
|
|
51
|
-
- React component that automatically captures touch events
|
|
52
|
-
- No manual setup required - works automatically when session is active
|
|
53
|
-
|
|
54
|
-
## Event Types Generated
|
|
55
|
-
|
|
56
|
-
### FullSnapshotEvent
|
|
57
|
-
|
|
58
|
-
```typescript
|
|
59
|
-
{
|
|
60
|
-
type: EventType.FullSnapshot,
|
|
61
|
-
data: {
|
|
62
|
-
node: {
|
|
63
|
-
type: 1, // Element node
|
|
64
|
-
id: 1,
|
|
65
|
-
tagName: 'div',
|
|
66
|
-
attributes: { style: 'width: 375px; height: 667px; position: relative;' },
|
|
67
|
-
childNodes: [{
|
|
68
|
-
type: 1,
|
|
69
|
-
id: 2,
|
|
70
|
-
tagName: 'img',
|
|
71
|
-
attributes: {
|
|
72
|
-
src: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...',
|
|
73
|
-
width: '375',
|
|
74
|
-
height: '667',
|
|
75
|
-
style: 'width: 375px; height: 667px;'
|
|
76
|
-
}
|
|
77
|
-
}]
|
|
78
|
-
},
|
|
79
|
-
initialOffset: { left: 0, top: 0 }
|
|
80
|
-
},
|
|
81
|
-
timestamp: 1640995200000
|
|
82
|
-
}
|
|
83
|
-
```
|
|
84
|
-
|
|
85
|
-
### IncrementalSnapshotEvent (Touch Interactions)
|
|
86
|
-
|
|
87
|
-
```typescript
|
|
88
|
-
{
|
|
89
|
-
type: EventType.IncrementalSnapshot,
|
|
90
|
-
data: {
|
|
91
|
-
source: IncrementalSource.MouseInteraction,
|
|
92
|
-
type: MouseInteractionType.TouchStart, // or TouchMove, TouchEnd
|
|
93
|
-
id: 2, // References the image node ID
|
|
94
|
-
x: 150,
|
|
95
|
-
y: 200
|
|
96
|
-
},
|
|
97
|
-
timestamp: 1640995201000
|
|
98
|
-
}
|
|
99
|
-
```
|
|
100
|
-
|
|
101
|
-
## Usage
|
|
102
|
-
|
|
103
|
-
### Basic Setup (Automatic Recording)
|
|
104
|
-
|
|
105
|
-
```typescript
|
|
106
|
-
import { SessionRecorderProvider } from '@multiplayer-app/session-recorder-react-native'
|
|
107
|
-
|
|
108
|
-
function App() {
|
|
109
|
-
return (
|
|
110
|
-
<SessionRecorderProvider
|
|
111
|
-
options={{
|
|
112
|
-
apiKey: 'your-api-key',
|
|
113
|
-
version: '1.0.0',
|
|
114
|
-
application: 'MyApp',
|
|
115
|
-
environment: 'production',
|
|
116
|
-
recordScreen: true, // Automatic screen capture
|
|
117
|
-
recordGestures: true // Automatic touch recording
|
|
118
|
-
}}
|
|
119
|
-
>
|
|
120
|
-
<YourAppContent />
|
|
121
|
-
</SessionRecorderProvider>
|
|
122
|
-
)
|
|
123
|
-
}
|
|
124
|
-
```
|
|
125
|
-
|
|
126
|
-
**That's it!** Recording is now automatic. When you start a session, the system will:
|
|
127
|
-
|
|
128
|
-
- Automatically capture screen snapshots periodically
|
|
129
|
-
- Automatically record all touch interactions
|
|
130
|
-
- Generate rrweb-compatible events without any manual intervention
|
|
131
|
-
|
|
132
|
-
### Custom Event Recording (Optional)
|
|
133
|
-
|
|
134
|
-
```typescript
|
|
135
|
-
import { useSessionRecorder } from '@multiplayer-app/session-recorder-react-native'
|
|
136
|
-
|
|
137
|
-
function MyComponent() {
|
|
138
|
-
const { client } = useSessionRecorder()
|
|
139
|
-
|
|
140
|
-
const handleCustomEvent = () => {
|
|
141
|
-
// Record a custom rrweb event (optional)
|
|
142
|
-
client.recordEvent({
|
|
143
|
-
type: EventType.Custom,
|
|
144
|
-
data: { customData: 'value' },
|
|
145
|
-
timestamp: Date.now()
|
|
146
|
-
})
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
return <Button onPress={handleCustomEvent} title='Record Custom Event' />
|
|
150
|
-
}
|
|
151
|
-
```
|
|
152
|
-
|
|
153
|
-
## Integration Points
|
|
154
|
-
|
|
155
|
-
### Screen Capture Integration
|
|
156
|
-
|
|
157
|
-
The `ScreenRecorder` class now includes **complete react-native-view-shot integration**:
|
|
158
|
-
|
|
159
|
-
```typescript
|
|
160
|
-
// In screenRecorder.ts - _captureScreenBase64 method
|
|
161
|
-
private async _captureScreenBase64(): Promise<string | null> {
|
|
162
|
-
try {
|
|
163
|
-
if (!this.viewShotRef) {
|
|
164
|
-
console.warn('ViewShot ref not available for screen capture')
|
|
165
|
-
return null
|
|
166
|
-
}
|
|
167
|
-
|
|
168
|
-
// Capture the screen using react-native-view-shot
|
|
169
|
-
const result = await captureRef(this.viewShotRef, {
|
|
170
|
-
format: this.captureFormat,
|
|
171
|
-
quality: this.captureQuality,
|
|
172
|
-
result: 'base64'
|
|
173
|
-
})
|
|
174
|
-
|
|
175
|
-
return result
|
|
176
|
-
} catch (error) {
|
|
177
|
-
console.error('Failed to capture screen:', error)
|
|
178
|
-
return null
|
|
179
|
-
}
|
|
180
|
-
}
|
|
181
|
-
```
|
|
182
|
-
|
|
183
|
-
**The ViewShot ref is automatically set up** in the `TouchEventCapture` component, so no manual configuration is needed!
|
|
184
|
-
|
|
185
|
-
### Automatic ViewShot Setup
|
|
186
|
-
|
|
187
|
-
The `TouchEventCapture` component automatically sets up the ViewShot ref:
|
|
188
|
-
|
|
189
|
-
```typescript
|
|
190
|
-
// In SessionRecorderContext.tsx
|
|
191
|
-
const TouchEventCapture: React.FC<{ children: ReactNode }> = ({ children }) => {
|
|
192
|
-
const context = useContext(SessionRecorderContext)
|
|
193
|
-
const viewShotRef = useRef<View>(null)
|
|
194
|
-
|
|
195
|
-
// Callback ref to set the viewshot ref immediately when available
|
|
196
|
-
const setViewShotRef = (ref: View | null) => {
|
|
197
|
-
if (ref && context?.client) {
|
|
198
|
-
context.client.setViewShotRef?.(ref)
|
|
199
|
-
}
|
|
200
|
-
}
|
|
201
|
-
|
|
202
|
-
return (
|
|
203
|
-
<View
|
|
204
|
-
ref={(ref) => {
|
|
205
|
-
viewShotRef.current = ref
|
|
206
|
-
setViewShotRef(ref)
|
|
207
|
-
}}
|
|
208
|
-
style={{ flex: 1 }}
|
|
209
|
-
onTouchStart={handleTouchStart}
|
|
210
|
-
onTouchMove={handleTouchMove}
|
|
211
|
-
onTouchEnd={handleTouchEnd}
|
|
212
|
-
>
|
|
213
|
-
{children}
|
|
214
|
-
</View>
|
|
215
|
-
)
|
|
216
|
-
}
|
|
217
|
-
```
|
|
218
|
-
|
|
219
|
-
This ensures that:
|
|
220
|
-
|
|
221
|
-
- The same View that captures touch events is used for screen capture
|
|
222
|
-
- Perfect synchronization between touch interactions and screen captures
|
|
223
|
-
- No manual ref setup required
|
|
224
|
-
|
|
225
|
-
### Required Dependencies
|
|
226
|
-
|
|
227
|
-
Add these to your `package.json`:
|
|
228
|
-
|
|
229
|
-
```json
|
|
230
|
-
{
|
|
231
|
-
"dependencies": {
|
|
232
|
-
"react-native-view-shot": "^3.8.0"
|
|
233
|
-
}
|
|
234
|
-
}
|
|
235
|
-
```
|
|
236
|
-
|
|
237
|
-
## Automatic Event Flow
|
|
238
|
-
|
|
239
|
-
1. **Session Start**: `SessionRecorder.start()` automatically initializes all recorders
|
|
240
|
-
2. **Automatic Screen Capture**: `ScreenRecorder` automatically captures screenshots periodically + on interactions
|
|
241
|
-
3. **Automatic Touch Events**: `TouchEventCapture` automatically captures all touch interactions
|
|
242
|
-
4. **Automatic Event Generation**: Touch events are automatically converted to rrweb `MouseInteraction` events
|
|
243
|
-
5. **Automatic Event Recording**: All events are automatically stored and can be exported
|
|
244
|
-
|
|
245
|
-
**No manual intervention required!** The entire process is automatic once you start a session.
|
|
246
|
-
|
|
247
|
-
## Customization
|
|
248
|
-
|
|
249
|
-
### Screen Capture Frequency
|
|
250
|
-
|
|
251
|
-
```typescript
|
|
252
|
-
// Adjust capture interval in ScreenRecorder
|
|
253
|
-
screenRecorder.setCaptureInterval(3000) // Capture every 3 seconds
|
|
254
|
-
```
|
|
255
|
-
|
|
256
|
-
### Change Detection Configuration
|
|
257
|
-
|
|
258
|
-
```typescript
|
|
259
|
-
// Enable/disable change detection
|
|
260
|
-
screenRecorder.setChangeDetection(true) // Default: true
|
|
261
|
-
|
|
262
|
-
// Adjust hash sample size for change detection
|
|
263
|
-
screenRecorder.setHashSampleSize(200) // Default: 100 characters
|
|
264
|
-
|
|
265
|
-
// Force capture (bypasses change detection)
|
|
266
|
-
screenRecorder.forceCapture()
|
|
267
|
-
```
|
|
268
|
-
|
|
269
|
-
### Touch Event Throttling
|
|
270
|
-
|
|
271
|
-
```typescript
|
|
272
|
-
// Adjust gesture throttling in GestureRecorder
|
|
273
|
-
gestureRecorder.setGestureThrottle(100) // Throttle to 100ms
|
|
274
|
-
```
|
|
275
|
-
|
|
276
|
-
### Event Filtering
|
|
277
|
-
|
|
278
|
-
You can filter events by modifying the `recordEvent` method in `SessionRecorder`:
|
|
279
|
-
|
|
280
|
-
```typescript
|
|
281
|
-
recordEvent(event: RRWebEvent): void {
|
|
282
|
-
if (!this._isInitialized || this.sessionState !== SessionState.started) {
|
|
283
|
-
return
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
// Add custom filtering logic here
|
|
287
|
-
if (event.type === EventType.IncrementalSnapshot) {
|
|
288
|
-
// Filter out certain touch events if needed
|
|
289
|
-
}
|
|
290
|
-
|
|
291
|
-
this._recorder.recordEvent(event)
|
|
292
|
-
}
|
|
293
|
-
```
|
|
294
|
-
|
|
295
|
-
## Exporting Events
|
|
296
|
-
|
|
297
|
-
To export recorded events for rrweb playback:
|
|
298
|
-
|
|
299
|
-
```typescript
|
|
300
|
-
const events = sessionRecorder.getRecordedEvents()
|
|
301
|
-
// Save events to file or send to server
|
|
302
|
-
```
|
|
303
|
-
|
|
304
|
-
## Troubleshooting
|
|
305
|
-
|
|
306
|
-
### Common Issues
|
|
307
|
-
|
|
308
|
-
1. **Screen capture not working**: Ensure `react-native-view-shot` is properly installed and configured
|
|
309
|
-
2. **Touch events not recorded**: Check that `TouchEventCapture` wraps your app content
|
|
310
|
-
3. **Events not generated**: Verify session is in `started` state
|
|
311
|
-
|
|
312
|
-
### Debug Mode
|
|
313
|
-
|
|
314
|
-
Enable debug logging by setting:
|
|
315
|
-
|
|
316
|
-
```typescript
|
|
317
|
-
// In your app configuration
|
|
318
|
-
console.log('Recording stats:', sessionRecorder.getRecordingStats())
|
|
319
|
-
```
|
|
320
|
-
|
|
321
|
-
## Future Enhancements
|
|
322
|
-
|
|
323
|
-
- [ ] Support for multiple screen orientations
|
|
324
|
-
- [ ] Gesture recognition and classification
|
|
325
|
-
- [ ] Performance optimization for large sessions
|
|
326
|
-
- [ ] Integration with additional React Native libraries
|
|
327
|
-
- [ ] Custom event types for React Native specific interactions
|
|
328
|
-
|
|
329
|
-
## Compatibility
|
|
330
|
-
|
|
331
|
-
This implementation is compatible with:
|
|
332
|
-
|
|
333
|
-
- rrweb 1.x and 2.x
|
|
334
|
-
- React Native 0.60+
|
|
335
|
-
- iOS and Android platforms
|
|
336
|
-
- Standard rrweb players and replay tools
|
|
@@ -1,123 +0,0 @@
|
|
|
1
|
-
# ViewShot Integration Test
|
|
2
|
-
|
|
3
|
-
This document explains how to test the complete react-native-view-shot integration.
|
|
4
|
-
|
|
5
|
-
## Test Setup
|
|
6
|
-
|
|
7
|
-
1. **Install Dependencies**
|
|
8
|
-
|
|
9
|
-
```bash
|
|
10
|
-
npm install react-native-view-shot
|
|
11
|
-
# For iOS
|
|
12
|
-
cd ios && pod install && cd ..
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
2. **Test the Integration**
|
|
16
|
-
|
|
17
|
-
```typescript
|
|
18
|
-
import React from 'react'
|
|
19
|
-
import { View, Text, Button } from 'react-native'
|
|
20
|
-
import { SessionRecorderProvider, useSessionRecorder } from './src/context/SessionRecorderContext'
|
|
21
|
-
|
|
22
|
-
function TestApp() {
|
|
23
|
-
const { client } = useSessionRecorder()
|
|
24
|
-
|
|
25
|
-
const testScreenCapture = async () => {
|
|
26
|
-
// Start session to enable automatic screen capture
|
|
27
|
-
await client.start()
|
|
28
|
-
|
|
29
|
-
// Wait a moment for initial screen capture
|
|
30
|
-
setTimeout(() => {
|
|
31
|
-
console.log('Screen capture should have happened automatically!')
|
|
32
|
-
// Check the recorded events
|
|
33
|
-
const events = client.getRecordedEvents?.()
|
|
34
|
-
console.log('Recorded events:', events)
|
|
35
|
-
}, 2000)
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
return (
|
|
39
|
-
<View style={{ flex: 1, padding: 20 }}>
|
|
40
|
-
<Text>ViewShot Integration Test</Text>
|
|
41
|
-
<Button title='Test Screen Capture' onPress={testScreenCapture} />
|
|
42
|
-
<Text>Touch the screen to test touch recording</Text>
|
|
43
|
-
</View>
|
|
44
|
-
)
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
export default function App() {
|
|
48
|
-
return (
|
|
49
|
-
<SessionRecorderProvider
|
|
50
|
-
options={{
|
|
51
|
-
apiKey: 'test-key',
|
|
52
|
-
version: '1.0.0',
|
|
53
|
-
application: 'TestApp',
|
|
54
|
-
environment: 'test',
|
|
55
|
-
recordScreen: true,
|
|
56
|
-
recordGestures: true
|
|
57
|
-
}}
|
|
58
|
-
>
|
|
59
|
-
<TestApp />
|
|
60
|
-
</SessionRecorderProvider>
|
|
61
|
-
)
|
|
62
|
-
}
|
|
63
|
-
```
|
|
64
|
-
|
|
65
|
-
## Expected Behavior
|
|
66
|
-
|
|
67
|
-
When you run this test:
|
|
68
|
-
|
|
69
|
-
1. **Automatic Screen Capture**: The system should automatically capture the screen when the session starts
|
|
70
|
-
2. **Touch Recording**: Touching the screen should generate rrweb MouseInteraction events
|
|
71
|
-
3. **ViewShot Integration**: The same View that handles touch events should be used for screen capture
|
|
72
|
-
4. **Event Generation**: Both FullSnapshotEvent and IncrementalSnapshotEvent should be generated
|
|
73
|
-
|
|
74
|
-
## Verification Steps
|
|
75
|
-
|
|
76
|
-
1. **Check Console Logs**: Look for screen capture success/failure messages
|
|
77
|
-
2. **Verify Events**: Check that `getRecordedEvents()` returns both screen and touch events
|
|
78
|
-
3. **Test Touch Interactions**: Touch the screen and verify touch events are recorded
|
|
79
|
-
4. **Check Event Format**: Ensure events are in proper rrweb format
|
|
80
|
-
|
|
81
|
-
## Troubleshooting
|
|
82
|
-
|
|
83
|
-
### Common Issues
|
|
84
|
-
|
|
85
|
-
1. **"ViewShot ref not available"**: The ref setup might be timing-related
|
|
86
|
-
|
|
87
|
-
- Solution: Ensure the SessionRecorderProvider wraps your app properly
|
|
88
|
-
|
|
89
|
-
2. **Screen capture fails**: react-native-view-shot might not be properly installed
|
|
90
|
-
|
|
91
|
-
- Solution: Check installation and run `pod install` for iOS
|
|
92
|
-
|
|
93
|
-
3. **No events recorded**: Session might not be started
|
|
94
|
-
- Solution: Call `client.start()` before testing
|
|
95
|
-
|
|
96
|
-
### Debug Information
|
|
97
|
-
|
|
98
|
-
Add this to your test component to debug:
|
|
99
|
-
|
|
100
|
-
```typescript
|
|
101
|
-
const debugInfo = () => {
|
|
102
|
-
console.log('Session State:', client.sessionState)
|
|
103
|
-
console.log('Is Recording:', client.isRecording)
|
|
104
|
-
console.log('Events Count:', client.getRecordedEvents?.()?.length || 0)
|
|
105
|
-
}
|
|
106
|
-
```
|
|
107
|
-
|
|
108
|
-
## Success Criteria
|
|
109
|
-
|
|
110
|
-
✅ Screen capture works automatically when session starts
|
|
111
|
-
✅ Touch events are recorded automatically
|
|
112
|
-
✅ Events are in proper rrweb format
|
|
113
|
-
✅ No manual ref setup required
|
|
114
|
-
✅ Perfect synchronization between touch and screen events
|
|
115
|
-
|
|
116
|
-
## Next Steps
|
|
117
|
-
|
|
118
|
-
Once the test passes:
|
|
119
|
-
|
|
120
|
-
1. Integrate into your main app
|
|
121
|
-
2. Configure capture intervals and quality as needed
|
|
122
|
-
3. Export events for rrweb playback
|
|
123
|
-
4. Customize event filtering if required
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _typeof=require("@babel/runtime/helpers/typeof");Object.defineProperty(exports,"__esModule",{value:true});exports.GestureCaptureWrapper=void 0;var _react=_interopRequireWildcard(require("react"));var _reactNativeGestureHandler=require("react-native-gesture-handler");var _jsxRuntime=require("react/jsx-runtime");var _this=void 0,_jsxFileName="/Users/gegham/www/multiplayer-debugger-javascript/packages/session-recorder-react-native/dist/components/GestureCaptureWrapper.js";function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap(),n=new WeakMap();return(_interopRequireWildcard=function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,"default":e};if(null===e||"object"!=_typeof(e)&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f);}for(var _t2 in e)"default"!==_t2&&{}.hasOwnProperty.call(e,_t2)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,_t2))&&(i.get||i.set)?o(f,_t2,i):f[_t2]=e[_t2]);return f;})(e,t);}var GestureCaptureWrapper=exports.GestureCaptureWrapper=function GestureCaptureWrapper(_ref){var children=_ref.children,onGestureRecord=_ref.onGestureRecord;var recordGesture=(0,_react.useCallback)(function(gestureType,data){onGestureRecord(gestureType,data);},[onGestureRecord]);var tapGesture=(0,_react.useMemo)(function(){return _reactNativeGestureHandler.Gesture.Tap().runOnJS(true).onStart(function(event){recordGesture('tap',{x:event.x,y:event.y,timestamp:Date.now()});});},[recordGesture]);var panGesture=(0,_react.useMemo)(function(){return _reactNativeGestureHandler.Gesture.Pan().runOnJS(true).onStart(function(event){recordGesture('pan_start',{x:event.x,y:event.y,timestamp:Date.now()});}).onUpdate(function(event){recordGesture('pan_update',{x:event.x,y:event.y,translationX:event.translationX,translationY:event.translationY,velocityX:event.velocityX,velocityY:event.velocityY,timestamp:Date.now()});}).onEnd(function(event){recordGesture('pan_end',{x:event.x,y:event.y,translationX:event.translationX,translationY:event.translationY,velocityX:event.velocityX,velocityY:event.velocityY,timestamp:Date.now()});});},[recordGesture]);var longPressGesture=(0,_react.useMemo)(function(){return _reactNativeGestureHandler.Gesture.LongPress().runOnJS(true).minDuration(500).onStart(function(event){recordGesture('long_press',{x:event.x,y:event.y,duration:500,timestamp:Date.now()});});},[recordGesture]);return(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{style:{flex:1},children:(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureDetector,{gesture:_reactNativeGestureHandler.Gesture.Simultaneous(tapGesture,panGesture,longPressGesture),children:children})});};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"GestureCaptureWrapper.js","sourceRoot":"","sources":["../../src/components/GestureCaptureWrapper.tsx"],"names":[],"mappings":"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"}
|
package/dist/expo.d.ts
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import './patch';
|
|
2
|
-
import SessionRecorder from './session-recorder';
|
|
3
|
-
export * from '@multiplayer-app/session-recorder-common';
|
|
4
|
-
export * from './context/SessionRecorderContext';
|
|
5
|
-
export { SessionRecorder };
|
|
6
|
-
export default SessionRecorder;
|
|
7
|
-
export { isExpoEnvironment, getPlatformAttributes } from './utils/platform';
|
package/dist/expo.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});var _exportNames={SessionRecorder:true,isExpoEnvironment:true,getPlatformAttributes:true};Object.defineProperty(exports,"SessionRecorder",{enumerable:true,get:function get(){return _sessionRecorder["default"];}});exports["default"]=void 0;Object.defineProperty(exports,"getPlatformAttributes",{enumerable:true,get:function get(){return _platform.getPlatformAttributes;}});Object.defineProperty(exports,"isExpoEnvironment",{enumerable:true,get:function get(){return _platform.isExpoEnvironment;}});require("./patch");var _sessionRecorder=_interopRequireDefault(require("./session-recorder"));var _sessionRecorderCommon=require("@multiplayer-app/session-recorder-common");Object.keys(_sessionRecorderCommon).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_sessionRecorderCommon[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _sessionRecorderCommon[key];}});});var _SessionRecorderContext=require("./context/SessionRecorderContext");Object.keys(_SessionRecorderContext).forEach(function(key){if(key==="default"||key==="__esModule")return;if(Object.prototype.hasOwnProperty.call(_exportNames,key))return;if(key in exports&&exports[key]===_SessionRecorderContext[key])return;Object.defineProperty(exports,key,{enumerable:true,get:function get(){return _SessionRecorderContext[key];}});});var _platform=require("./utils/platform");var _default=exports["default"]=_sessionRecorder["default"];
|
package/dist/expo.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"expo.js","sourceRoot":"","sources":["../src/expo.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,CAAA;AAChB,OAAO,eAAe,MAAM,oBAAoB,CAAA;AAChD,cAAc,0CAA0C,CAAA;AACxD,cAAc,kCAAkC,CAAA;AAEhD,OAAO,EAAE,eAAe,EAAE,CAAA;AAC1B,iCAAiC;AACjC,eAAe,eAAe,CAAA;AAE9B,iCAAiC;AACjC,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { InstrumentationBase } from '@opentelemetry/instrumentation';
|
|
2
|
-
export declare class GestureInstrumentation extends InstrumentationBase {
|
|
3
|
-
private _isEnabled;
|
|
4
|
-
constructor();
|
|
5
|
-
init(): void;
|
|
6
|
-
enable(): void;
|
|
7
|
-
disable(): void;
|
|
8
|
-
isEnabled(): boolean;
|
|
9
|
-
recordTap(x: number, y: number, target?: string): void;
|
|
10
|
-
recordSwipe(direction: string, target?: string): void;
|
|
11
|
-
recordPinch(scale: number, target?: string): void;
|
|
12
|
-
recordPan(deltaX: number, deltaY: number, target?: string): void;
|
|
13
|
-
recordLongPress(duration: number, target?: string): void;
|
|
14
|
-
recordGestureError(error: Error, gestureType: string): void;
|
|
15
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.GestureInstrumentation=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _instrumentation=require("@opentelemetry/instrumentation");var _api=require("@opentelemetry/api");function _callSuper(t,o,e){return o=(0,_getPrototypeOf2["default"])(o),(0,_possibleConstructorReturn2["default"])(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],(0,_getPrototypeOf2["default"])(t).constructor):o.apply(t,e));}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}var scopeName="@opentelemetry/instrumentation-user-interaction";var GestureInstrumentation=exports.GestureInstrumentation=function(_InstrumentationBase){function GestureInstrumentation(){var _this;(0,_classCallCheck2["default"])(this,GestureInstrumentation);_this=_callSuper(this,GestureInstrumentation,['react-native-gesture','1.0.0',{}]);_this._isEnabled=false;return _this;}(0,_inherits2["default"])(GestureInstrumentation,_InstrumentationBase);return(0,_createClass2["default"])(GestureInstrumentation,[{key:"init",value:function init(){}},{key:"enable",value:function enable(){this._isEnabled=true;}},{key:"disable",value:function disable(){this._isEnabled=false;}},{key:"isEnabled",value:function isEnabled(){return this._isEnabled;}},{key:"recordTap",value:function recordTap(x,y,target){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan('Gesture.tap',{attributes:{'gesture.type':'tap','gesture.coordinates.x':x,'gesture.coordinates.y':y,'gesture.timestamp':Date.now()}});if(target){span.setAttribute('gesture.target',target);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordSwipe",value:function recordSwipe(direction,target){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan('Gesture.swipe',{attributes:{'gesture.type':'swipe','gesture.direction':direction,'gesture.timestamp':Date.now()}});if(target){span.setAttribute('gesture.target',target);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordPinch",value:function recordPinch(scale,target){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan('Gesture.pinch',{attributes:{'gesture.type':'pinch','gesture.scale':scale,'gesture.timestamp':Date.now()}});if(target){span.setAttribute('gesture.target',target);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordPan",value:function recordPan(deltaX,deltaY,target){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan('Gesture.pan',{attributes:{'gesture.type':'pan','gesture.delta_x':deltaX,'gesture.delta_y':deltaY,'gesture.timestamp':Date.now()}});if(target){span.setAttribute('gesture.target',target);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordLongPress",value:function recordLongPress(duration,target){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan('Gesture.longPress',{attributes:{'gesture.type':'longPress','gesture.duration':duration,'gesture.timestamp':Date.now()}});if(target){span.setAttribute('gesture.target',target);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordGestureError",value:function recordGestureError(error,gestureType){if(!this._isEnabled)return;var span=_api.trace.getTracer(scopeName).startSpan("Gesture.".concat(gestureType,".error"),{attributes:{'gesture.type':gestureType,'gesture.error':true,'gesture.timestamp':Date.now()}});span.setStatus({code:_api.SpanStatusCode.ERROR,message:error.message});span.recordException(error);span.end();}}]);}(_instrumentation.InstrumentationBase);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"gestureInstrumentation.js","sourceRoot":"","sources":["../../../src/otel/instrumentations/gestureInstrumentation.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ReactNativeInstrumentation=void 0;var _regenerator=_interopRequireDefault(require("@babel/runtime/regenerator"));var _asyncToGenerator2=_interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _instrumentation=require("@opentelemetry/instrumentation");var _utils=require("../../utils");var _api=require("@opentelemetry/api");var _asyncStorage=_interopRequireDefault(require("@react-native-async-storage/async-storage"));function _callSuper(t,o,e){return o=(0,_getPrototypeOf2["default"])(o),(0,_possibleConstructorReturn2["default"])(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],(0,_getPrototypeOf2["default"])(t).constructor):o.apply(t,e));}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}var ReactNativeInstrumentation=exports.ReactNativeInstrumentation=function(_InstrumentationBase){function ReactNativeInstrumentation(){(0,_classCallCheck2["default"])(this,ReactNativeInstrumentation);return _callSuper(this,ReactNativeInstrumentation,['react-native','1.0.0',{}]);}(0,_inherits2["default"])(ReactNativeInstrumentation,_InstrumentationBase);return(0,_createClass2["default"])(ReactNativeInstrumentation,[{key:"init",value:function init(){}},{key:"enable",value:function enable(){try{if(_asyncStorage["default"]){this._wrap(_asyncStorage["default"],'setItem',this._wrapAsyncStorage);}}catch(error){_utils.logger.warn('DEBUGGER_LIB','@react-native-async-storage/async-storage is not available. AsyncStorage instrumentation will be disabled.');}}},{key:"disable",value:function disable(){try{if(_asyncStorage["default"]){this._unwrap(_asyncStorage["default"],'setItem');}}catch(error){}}},{key:"_wrapAsyncStorage",value:function _wrapAsyncStorage(originalMethod){return function(){var _ref=(0,_asyncToGenerator2["default"])(_regenerator["default"].mark(function _callee(key,value){var startTime,result,span,_span,errorMessage,_t;return _regenerator["default"].wrap(function(_context){while(1)switch(_context.prev=_context.next){case 0:startTime=Date.now();_context.prev=1;_context.next=2;return originalMethod.call(this,key,value);case 2:result=_context.sent;span=_api.trace.getTracer('react-native').startSpan('AsyncStorage.setItem',{attributes:{'storage.operation':'setItem','storage.key':key,'storage.value_length':value.length,'storage.duration':Date.now()-startTime}});span.setStatus({code:_api.SpanStatusCode.OK});span.end();return _context.abrupt("return",result);case 3:_context.prev=3;_t=_context["catch"](1);_span=_api.trace.getTracer('react-native').startSpan('AsyncStorage.setItem',{attributes:{'storage.operation':'setItem','storage.key':key,'storage.error':true,'storage.duration':Date.now()-startTime}});errorMessage=_t instanceof Error?_t.message:String(_t);_span.setStatus({code:_api.SpanStatusCode.ERROR,message:errorMessage});if(_t instanceof Error){_span.recordException(_t);}_span.end();throw _t;case 4:case"end":return _context.stop();}},_callee,this,[[1,3]]);}));return function(_x,_x2){return _ref.apply(this,arguments);};}();}}]);}(_instrumentation.InstrumentationBase);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"reactNativeInstrumentation.js","sourceRoot":"","sources":["../../../src/otel/instrumentations/reactNativeInstrumentation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AACpC,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAA;AAC1D,OAAO,YAAY,MAAM,2CAA2C,CAAA;AAEpE,MAAM,OAAO,0BAA2B,SAAQ,mBAAmB;IACjE;QACE,KAAK,CAAC,cAAc,EAAE,OAAO,EAAE,EAAE,CAAC,CAAA;IACpC,CAAC;IAED,IAAI;QACF,iCAAiC;IACnC,CAAC;IAED,MAAM;QACJ,6CAA6C;QAC7C,IAAI,CAAC;YACH,IAAI,YAAY,EAAE,CAAC;gBACjB,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,SAAS,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAA;YAC7D,CAAC;QACH,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,MAAM,CAAC,IAAI,CAAC,cAAc,EAAE,4GAA4G,CAAC,CAAA;QAC3I,CAAC;IACH,CAAC;IAED,OAAO;QACL,+CAA+C;QAC/C,IAAI,CAAC;YACH,IAAI,YAAY,EAAE,CAAC;gBACjB,IAAI,CAAC,OAAO,CAAC,YAAY,EAAE,SAAS,CAAC,CAAA;YACvC,CAAC;QACH,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,oDAAoD;QACtD,CAAC;IACH,CAAC;IAEO,iBAAiB,CAAC,cAAmB;QAC3C,OAAO,KAAK,WAAsB,GAAW,EAAE,KAAa;YAC1D,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,EAAE,CAAA;YAC5B,IAAI,CAAC;gBACH,MAAM,MAAM,GAAG,MAAM,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAA;gBAE1D,MAAM,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,SAAS,CAAC,sBAAsB,EAAE;oBAC7E,UAAU,EAAE;wBACV,mBAAmB,EAAE,SAAS;wBAC9B,aAAa,EAAE,GAAG;wBAClB,sBAAsB,EAAE,KAAK,CAAC,MAAM;wBACpC,kBAAkB,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS;qBAC3C;iBACF,CAAC,CAAA;gBAEF,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,cAAc,CAAC,EAAE,EAAE,CAAC,CAAA;gBAC3C,IAAI,CAAC,GAAG,EAAE,CAAA;gBAEV,OAAO,MAAM,CAAA;YACf,CAAC;YAAC,OAAO,KAAK,EAAE,CAAC;gBACf,MAAM,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC,SAAS,CAAC,sBAAsB,EAAE;oBAC7E,UAAU,EAAE;wBACV,mBAAmB,EAAE,SAAS;wBAC9B,aAAa,EAAE,GAAG;wBAClB,eAAe,EAAE,IAAI;wBACrB,kBAAkB,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS;qBAC3C;iBACF,CAAC,CAAA;gBAEF,MAAM,YAAY,GAAG,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;gBAC3E,IAAI,CAAC,SAAS,CAAC,EAAE,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,YAAY,EAAE,CAAC,CAAA;gBACrE,IAAI,KAAK,YAAY,KAAK,EAAE,CAAC;oBAC3B,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,CAAA;gBAC7B,CAAC;gBACD,IAAI,CAAC,GAAG,EAAE,CAAA;gBAEV,MAAM,KAAK,CAAA;YACb,CAAC;QACH,CAAC,CAAA;IACH,CAAC;CACF"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { InstrumentationBase } from '@opentelemetry/instrumentation';
|
|
2
|
-
export declare class ReactNavigationInstrumentation extends InstrumentationBase {
|
|
3
|
-
private navigationRef;
|
|
4
|
-
constructor();
|
|
5
|
-
init(): void;
|
|
6
|
-
enable(): void;
|
|
7
|
-
setNavigationRef(ref: any): void;
|
|
8
|
-
private _setupNavigationListener;
|
|
9
|
-
private _recordNavigationEvent;
|
|
10
|
-
recordNavigate(routeName: string, params?: Record<string, any>): void;
|
|
11
|
-
recordGoBack(): void;
|
|
12
|
-
recordReset(routes: any[]): void;
|
|
13
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.ReactNavigationInstrumentation=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _get2=_interopRequireDefault(require("@babel/runtime/helpers/get"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _instrumentation=require("@opentelemetry/instrumentation");var _api=require("@opentelemetry/api");function _callSuper(t,o,e){return o=(0,_getPrototypeOf2["default"])(o),(0,_possibleConstructorReturn2["default"])(t,_isNativeReflectConstruct()?Reflect.construct(o,e||[],(0,_getPrototypeOf2["default"])(t).constructor):o.apply(t,e));}function _isNativeReflectConstruct(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(t){}return(_isNativeReflectConstruct=function _isNativeReflectConstruct(){return!!t;})();}function _superPropGet(t,o,e,r){var p=(0,_get2["default"])((0,_getPrototypeOf2["default"])(1&r?t.prototype:t),o,e);return 2&r&&"function"==typeof p?function(t){return p.apply(e,t);}:p;}var ReactNavigationInstrumentation=exports.ReactNavigationInstrumentation=function(_InstrumentationBase){function ReactNavigationInstrumentation(){var _this;(0,_classCallCheck2["default"])(this,ReactNavigationInstrumentation);_this=_callSuper(this,ReactNavigationInstrumentation,['react-navigation','1.0.0',{}]);_this.navigationRef=null;return _this;}(0,_inherits2["default"])(ReactNavigationInstrumentation,_InstrumentationBase);return(0,_createClass2["default"])(ReactNavigationInstrumentation,[{key:"init",value:function init(){}},{key:"enable",value:function enable(){_superPropGet(ReactNavigationInstrumentation,"enable",this,3)([]);}},{key:"setNavigationRef",value:function setNavigationRef(ref){this.navigationRef=ref;this._setupNavigationListener();}},{key:"_setupNavigationListener",value:function _setupNavigationListener(){var _this2=this;if(!this.navigationRef)return;this.navigationRef.addListener('state',function(e){_this2._recordNavigationEvent('state_change',e.data);});this.navigationRef.addListener('focus',function(e){_this2._recordNavigationEvent('focus',e.data);});this.navigationRef.addListener('blur',function(e){_this2._recordNavigationEvent('blur',e.data);});}},{key:"_recordNavigationEvent",value:function _recordNavigationEvent(eventType,data){var span=_api.trace.getTracer('navigation').startSpan("Navigation.".concat(eventType),{attributes:{'navigation.system':'ReactNavigation','navigation.operation':eventType,'navigation.type':eventType,'navigation.timestamp':Date.now()}});if(data){if(data.routeName){span.setAttribute('navigation.route_name',data.routeName);}if(data.params){span.setAttribute('navigation.params',JSON.stringify(data.params));}if(data.key){span.setAttribute('navigation.key',data.key);}}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordNavigate",value:function recordNavigate(routeName,params){var span=_api.trace.getTracer('navigation').startSpan('Navigation.navigate',{attributes:{'navigation.system':'ReactNavigation','navigation.operation':'navigate','navigation.route_name':routeName,'navigation.timestamp':Date.now()}});if(params){span.setAttribute('navigation.params',JSON.stringify(params));}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordGoBack",value:function recordGoBack(){var span=_api.trace.getTracer('navigation').startSpan('Navigation.goBack',{attributes:{'navigation.system':'ReactNavigation','navigation.operation':'goBack','navigation.timestamp':Date.now()}});span.setStatus({code:_api.SpanStatusCode.OK});span.end();}},{key:"recordReset",value:function recordReset(routes){var span=_api.trace.getTracer('navigation').startSpan('Navigation.reset',{attributes:{'navigation.system':'ReactNavigation','navigation.operation':'reset','navigation.routes_count':routes.length,'navigation.timestamp':Date.now()}});if(routes.length>0){span.setAttribute('navigation.initial_route',routes[0].name);}span.setStatus({code:_api.SpanStatusCode.OK});span.end();}}]);}(_instrumentation.InstrumentationBase);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"reactNavigationInstrumentation.js","sourceRoot":"","sources":["../../../src/otel/instrumentations/reactNavigationInstrumentation.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
|
-
import { SessionState } from '../types';
|
|
3
|
-
export interface GestureHandlerRecorderProps {
|
|
4
|
-
children: ReactNode;
|
|
5
|
-
sessionState: SessionState | null;
|
|
6
|
-
onGestureRecord: (gestureType: string, data: any) => void;
|
|
7
|
-
}
|
|
8
|
-
export declare class GestureHandlerRecorder {
|
|
9
|
-
private gestureInstrumentation;
|
|
10
|
-
private onGestureRecord?;
|
|
11
|
-
constructor();
|
|
12
|
-
setGestureCallback(callback: (gestureType: string, data: any) => void): void;
|
|
13
|
-
createTapGesture(): import("react-native-gesture-handler/lib/typescript/handlers/gestures/tapGesture").TapGesture;
|
|
14
|
-
createPanGesture(): import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture").PanGesture;
|
|
15
|
-
createPinchGesture(): import("react-native-gesture-handler/lib/typescript/handlers/gestures/pinchGesture").PinchGesture;
|
|
16
|
-
createLongPressGesture(): import("react-native-gesture-handler/lib/typescript/handlers/gestures/longPressGesture").LongPressGesture;
|
|
17
|
-
private recordGesture;
|
|
18
|
-
createGestureDetector(children: ReactNode, sessionState: SessionState | null): ReactNode;
|
|
19
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.GestureHandlerRecorder=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _reactNativeGestureHandler=require("react-native-gesture-handler");var _types=require("../types");var _gestureInstrumentation=require("../otel/instrumentations/gestureInstrumentation");var GestureHandlerRecorder=exports.GestureHandlerRecorder=function(){function GestureHandlerRecorder(){(0,_classCallCheck2["default"])(this,GestureHandlerRecorder);this.gestureInstrumentation=new _gestureInstrumentation.GestureInstrumentation();this.gestureInstrumentation.enable();}return(0,_createClass2["default"])(GestureHandlerRecorder,[{key:"setGestureCallback",value:function setGestureCallback(callback){this.onGestureRecord=callback;}},{key:"createTapGesture",value:function createTapGesture(){var _this=this;return _reactNativeGestureHandler.Gesture.Tap().onStart(function(event){_this.recordGesture('tap',{x:event.x,y:event.y,timestamp:Date.now()});});}},{key:"createPanGesture",value:function createPanGesture(){var _this2=this;return _reactNativeGestureHandler.Gesture.Pan().onStart(function(event){_this2.recordGesture('pan_start',{x:event.x,y:event.y,timestamp:Date.now()});}).onUpdate(function(event){_this2.recordGesture('pan_update',{x:event.x,y:event.y,translationX:event.translationX,translationY:event.translationY,velocityX:event.velocityX,velocityY:event.velocityY,timestamp:Date.now()});}).onEnd(function(event){_this2.recordGesture('pan_end',{x:event.x,y:event.y,translationX:event.translationX,translationY:event.translationY,velocityX:event.velocityX,velocityY:event.velocityY,timestamp:Date.now()});});}},{key:"createPinchGesture",value:function createPinchGesture(){var _this3=this;return _reactNativeGestureHandler.Gesture.Pinch().onStart(function(event){_this3.recordGesture('pinch_start',{scale:event.scale,focalX:event.focalX,focalY:event.focalY,timestamp:Date.now()});}).onUpdate(function(event){_this3.recordGesture('pinch_update',{scale:event.scale,focalX:event.focalX,focalY:event.focalY,timestamp:Date.now()});}).onEnd(function(event){_this3.recordGesture('pinch_end',{scale:event.scale,focalX:event.focalX,focalY:event.focalY,timestamp:Date.now()});});}},{key:"createLongPressGesture",value:function createLongPressGesture(){var _this4=this;return _reactNativeGestureHandler.Gesture.LongPress().minDuration(500).onStart(function(event){_this4.recordGesture('long_press',{x:event.x,y:event.y,duration:500,timestamp:Date.now()});});}},{key:"recordGesture",value:function recordGesture(gestureType,data){switch(gestureType){case'tap':this.gestureInstrumentation.recordTap(data.x,data.y);break;case'pan_start':case'pan_update':case'pan_end':this.gestureInstrumentation.recordPan(data.translationX||0,data.translationY||0);break;case'pinch_start':case'pinch_update':case'pinch_end':this.gestureInstrumentation.recordPinch(data.scale,undefined);break;case'long_press':this.gestureInstrumentation.recordLongPress(data.duration,undefined);break;}if(this.onGestureRecord){this.onGestureRecord(gestureType,data);}}},{key:"createGestureDetector",value:function createGestureDetector(children,sessionState){if(sessionState!==_types.SessionState.started){return children;}var tapGesture=this.createTapGesture();var panGesture=this.createPanGesture();var pinchGesture=this.createPinchGesture();var longPressGesture=this.createLongPressGesture();return children;}}]);}();
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"gestureHandlerRecorder.js","sourceRoot":"","sources":["../../src/recorder/gestureHandlerRecorder.ts"],"names":[],"mappings":"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"}
|