This is the first step in diagnosing your New Relic Session replays problem yourself.
If you don't find your problem listed here, you can always reach out to New Relic Support.
Replays not visible in the UI
Problem
Session replay feature is enabled, but you're not able to view any replays.
Solution
Here are some possible fixes:
- Check your sampling rates. There is sampling for both replays and errors.
- Ensure you have permission to view replays.
- Make sure you're using the Pro or Pro+SPA version of the browser agent. Session replay does not work with the Lite browser agent.
- Make sure your browser agent meets these requirements:
- Agent version v1.260.0 or later. We recommend upgrading to the latest agent version as we continue making improvements.
- Agent type: Pro or Pro+SPA. Session replay does not work with the Lite browser agent.
- Session tracing is enabled.
- Your end-user's browser supports the browser-level APIs needed to record a session replay (verify compatibility at MutationObserver).
- In Errors inbox, filter your views so that you always a replay. By default, browser event data is stored 8 days, but actual data retention depends on your account.
- If you're using the copy/paste deployment method, make sure you updated your agent code.
- If you use the APM deployment method, you may need to wait for session replay to enable automatically. If data is still not visible, try restarting the agent.
- If you're dropping PageView event data, Session Replays may not appear in the UI.
Replays not appearing correctly
Problem
You can view replays, but they're not appearing correctly.
This may be because your CSS files are hosted on a separate domain and Cross-Origin Resource Sharing (CORS) security measures are preventing our agent from accessing the CSS files. This can result in incomplete or inaccurate replays, as essential styling information may be missing.
Here's what's happening behind the scenes:
Session replay rebuilds the user's DOM, capturing your website's structure and visual elements. To achieve this, our agent accesses your CSS files to accurately capture styling information. These styles are then embedded directly into the replay recording, removing the need to reference the original CSS files during playback.
If your CSS files are hosted on a separate domain, CORS may prevent our agent from accessing them.
Solution
To ensure your CSS files are accessible, add the crossorigin="anonymous"
attribute to your <link rel="stylesheet">
elements within your HTML code. This attribute instructs the browser to allow cross-origin access for those specific CSS files, allowing our browser agent to record and integrate the styling information.
Here's an example of adding the crossorigin="anonymous"
attribute:
<link rel="stylesheet" href="assets.yoursite.com/styles.css" crossorigin="anonymous">
Replays not visible in your iframes
Problem
Session replay feature is enabled, but you're not able to view replay data for iframe content.
Solution
The behavior of session replay in iframe scenarios depends on the origin of the iframe and the placement of the browser agent.
Assuming a web page consists of a top-level window with a child iframe, here are some possible fixes:
Same-origin iframes:
- If you place the browser agent in the top-level window, session replay captures both the window and the iframe.
- If you place the browser agent in the iframe, session replay only captures what's in the iframe.
- If you place the browser agent in both the top-level window and iframe, session replay captures what's happening independently in both the window and iframe, resulting in two separate sessions.
Cross-origin iframes:
- If you place the browser agent in the top-level window, session replay only captures what's in the window. The iframe will appear blank in session replay.
- If you place the browser agent in the top-level iframe, session replay only captures what's in the iframe.
Session replay is not compatible with
<frame>
elements.