Inspect your replay

Once your recording is uploaded, you're able to inspect it with Replay DevTools.

Inspect your replay
1

View the timeline

By default, you're set to "Viewer" mode. You can change the view to "DevTools" mode either by pressing the toggle in the top-right corner or by selecting an "Event" and pressing "Jump to code"

2

Jump to an event

Let's jump to the last "Click" before the recording hit an error and see the code related to it:

3

Inspect network calls

It looks like we're making a "POST" to an endpoint of "/api/purchase". Let's open our network panel and see what the request looks like:

The network tab in the DevTools panel which shows a 400 error on the purchase

Selecting the 400 error in the network panel allows us to look at the request and reply. Here, the request is indicating that "Color is not found, recieved: undefined" was the response from our backend:

The request subtab on the network request panel showing the request body with "{color: blue}"

But looking at the request body, it looks like we're sending the color along just fine:

The request subtab on the network request panel showing the request body with "{color: blue}"

With this information, we can go to our backend team more informed with how to report a ticket to solve this.