Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update session-replay.mdx #19243

Merged
merged 4 commits into from
Nov 20, 2024
Merged
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
---
title: "Session replay"
metaDescription: "Play back user interactions to debug faster and improve page performance."
freshnessValidatedDate: 2024-04-23
freshnessValidatedDate: 2024-11-11
---

Session replay plays back user interactions on your web app and maps other telemetry data to help you understand your user's journeys. Session replay can be used for troubleshooting and improving the end-user experience, such as:
Session replay captures interactions on your web app and maps other telemetry data to help you understand your user's journeys. Session replay can be used for troubleshooting and improving the end-user experience, such as:

Check warning on line 7 in src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay.mdx

View workflow job for this annotation

GitHub Actions / vale-linter

[vale] reported by reviewdog 🐶 [Microsoft.Passive] 'be used' looks like passive voice. Raw Output: {"message": "[Microsoft.Passive] 'be used' looks like passive voice.", "location": {"path": "src/content/docs/browser/browser-monitoring/browser-pro-features/session-replay.mdx", "range": {"start": {"line": 7, "column": 148}}}, "severity": "INFO"}

* **Troubleshooting JavaScript errors**: Troubleshoot the cause of an error by seeing what the user was doing when the error occurred. For example, if an end user receives an error while trying to complete an ecommerce transaction, you can use session replay to see which steps they took and what data they entered before the error occurred. This can help you quickly identify and fix the root cause of the problem.
* **Improving the user experience**: Discover areas of your web app that are causing users frustration. For example, you might see that users are getting lost in your navigation or clicking on buttons that don't do anything.
Expand Down Expand Up @@ -249,6 +249,30 @@
<link rel="stylesheet" href="assets.yoursite.com/styles.css" crossorigin="anonymous">
```
</Collapser>
<Collapser
id="Troubleshoot-iframe-content"
title="Not seeing replays in your iframes"
>
### Problem

Session replay feature is enabled, but you're not seeing 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.

</Collapser>
</CollapserGroup>

## Manually record session replays [#manual-replays]
Expand Down
Loading