Getting started
What is Replay.io?

What is Replay.io?

Replay.io is a tool that allows you to record your application and then debug everything that happened during runtime. Think of the nastiest bug you have ever faced. You would be able to fix it in minutes with insights that Replay provides. Experience with replay consists of two main parts:

Replay Browser

Replay DevTools

  • Replay Browser has the ability to record everything that happens between browser and operation system. A recording created with this browser is called a "replay"
  • Replay DevTools lets you inspect the replay. It’s like Chrome DevTools, but with time travel. You can inspect Network requests, DOM elements, and even React components properties. You can add a console.log() to a replay and examine your application runtime at a perfect moment.

How to use Replay.io?

💡

This example shows the simplest use case. Once you get familiar with the basic principles of recording and debugging, we highly recommend you to check out our Test Suites documentation to learn how you can integrate Replay Browser into Cypress, Playwright, Selenium, Puppeteer or WebdriverIO and draw your test flakiness to zero.

Typically, you would use Replay to debug, or better understand your app. The journey with Replay.io would have three chapters:

Create a recording

You can create a recording manually:

or by integrating Replay.io to your Test Suite:

npx playwright test --project replay-chromium

Click here Learn more about how to integrate into Playwright

Replay the recording and debug your app

Fix the bug or get help

With a better understanding of data flows, state changes and other processes in your app, you can now fix your bug. And since Replay DevTools run in cloud, you can send a recording to your colleague and debug together.

Common use cases

  • Local debugging: developers use Replay to better understand how their application works and debug difficult bugs.
  • Bug reports: teams use Replay to record bug reports in their Support and QA workflows so that developers can debug the issues without having to reproduce it locally.
  • Flaky and failed tests: teams use Replay to record their end-to-end tests in CI so that developers can debug flaky and failed tests.
💡

Check out our case studies to see how companies like Tablecheck adopt Replay.

How does Replay.io compare to Session Replay tools?

Replay records the runtime so you can retroactively debug your application with print statements and Browser DevTools. Session Replay tools like Full story record the DOM so you can see how your users use your application.

For more context, checkout our full comparison here.

See Replay in action

If you’re a visual learner, you’ll enjoy Filip Hric’s video Time Travelling with Replay.io. In the video, he shares his initial impressions of Replay and walks through how Replay helps him debug his application locally and debug Cypress flakes in CI.

For more walk throughs, checkout Replay in action.