Skip to main content
Question

Session Replay Wrapper for Segment - white screen recorded when deployed

  • 2 September 2024
  • 0 replies
  • 14 views

I'm using the session replay wrapper for Segment https://amplitude.com/docs/session-replay/session-replay-wrapper-for-segment

I have an amplitude actions destination setup in Segment and it's connected to my source. When I run it locally I can view my session replays in Amplitude together with my events and everything looks fine.


But when deployed I just receive a recording of a white screen. API keys and everything is the same. I have `debugMode: true` and the logs looks good in the deployed version:


```
Amplitude Logger [Debug]: {
  "name": "session replay joined privacy config",
  "privacyConfig": {
    "defaultMaskLevel": "conservative",
    "blockSelector": t],
    "maskSelector": e],
    "unmaskSelector": e]
  }
}
console.js:36 Amplitude Logger uLog]: Installing @amplitude/session-replay-browser.
console.js:36 Amplitude Logger uDebug]: {
  "type": "invoke public method",
  "name": "getSessionId",
  "args": ],
  "stacktrace":
    "at https://mypage.com/static/index-5e624d2d.js:179:90865",
    "at ro (https://mypage.com/static/index-5e624d2d.js:147:74748)",
    "at Object.next (https://mypage.com/static/index-5e624d2d.js:147:73950)",
    "at to (https://mypage.com/static/index-5e624d2d.js:147:73475)"
  ],
  "time": {
    "start": "2024-08-29T14:47:38.307Z",
    "end": "2024-08-29T14:47:38.307Z"
  },
  "states": {}
}
console.js:36 Amplitude Logger cDebug]: {
  "type": "invoke public method",
  "name": "getSessionReplayProperties",
  "args": e],
  "stacktrace":
    "at https://mypage.com/static/index-5e624d2d.js:179:89434",
    "at ro (https://mypage.com/static/index-5e624d2d.js:147:74748)",
    "at Object.next (https://mypage.com/static/index-5e624d2d.js:147:73950)",
    "at https://mypage.com/static/index-5e624d2d.js:147:73648",
    "at new Promise (<anonymous>)",
    "at __awaiter$1 (https://mypage.com/static/index-5e624d2d.js:147:73411)",
    "at updateSessionIdAndAddProperties (https://mypage.com/static/index-5e624d2d.js:179:89017)",
    "at https://mypage.com/static/index-5e624d2d.js:179:90351",
    "at ro (https://mypage.com/static/index-5e624d2d.js:147:74748)",
    "at Object.next (https://mypage.com/static/index-5e624d2d.js:147:73950)",
    "at to (https://mypage.com/static/index-5e624d2d.js:147:73475)"
  ],
  "time": {
    "start": "2024-08-29T14:47:38.309Z",
    "end": "2024-08-29T14:47:38.309Z"
  },
  "states": {}
}
console.js:36 Amplitude Logger   "type": "invoke public method",
  "name": "setSessionId",
  "args": o
    1724942821920,
    "user"
  ],
  "stacktrace": /
    "at https://mypage.com/static/index-5e624d2d.js:179:90892",
    "at ro (https://mypage.com/static/index-5e624d2d.js:147:74748)",
    "at Object.next (https://mypage.com/static/index-5e624d2d.js:147:73950)",
    "at to (https://mypage.com/static/index-5e624d2d.js:147:73475)"
  ],
  "time": {
    "start": "2024-08-29T14:47:38.308Z",
    "end": "2024-08-29T14:47:38.432Z"
  },
  "states": {}
}
console.js:36 Amplitude Logger 1Log]: Session replay event batch tracked successfully for session id 1724930569462
3console.js:36 Amplitude Logger cLog]: Session replay event batch tracked successfully for session id 1724942821920
```


I can see the replay in Amplitude but the just show a white screen. I'm running a React app and I have tried putting the `setupAmpSRSegmentWrapper` in both index.tsx and App.tsx files but same results. Anyone have experienced similar issues? 

Be the first to reply!

Reply