Fighting test flakiness with time machines

A flaky app will lead to flaky tests. Learn how time-travel debugging can reveal the root cause of instability, not just patch the symptoms.

#1about 3 minutes

The high cost of debugging flaky tests

Test flakiness is a major time sink in development, with debugging often taking longer than writing the tests themselves.

#2about 6 minutes

Debugging a race condition with the Cypress timeline

Use the Cypress timeline to inspect the DOM state at different points in time and diagnose a flaky test caused by a race condition.

#3about 6 minutes

Using Playwright's Trace Viewer for similar insights

Playwright's Trace Viewer provides a time-travel debugging experience similar to Cypress, which is especially valuable for analyzing test failures in CI environments.

#4about 2 minutes

Shifting focus from fixing the test to fixing the app

Testers often instinctively try to fix a flaky test with waits or retries, but the more robust solution is often to fix the underlying instability in the application itself.

#5about 3 minutes

Introducing Replay.io with a manual recording demo

Replay.io is a browser that records everything, allowing you to retroactively add print statements and use a time-travel debugger to inspect application state.

#6about 13 minutes

Integrating Replay.io with Cypress to debug an API race condition

By integrating Replay.io into a Cypress test suite, you can analyze the full application runtime, including internal state and network calls, to find the root cause of flakiness.

#7about 4 minutes

Fixing the application to resolve test flakiness

Fixing an API race condition by disabling a UI element until the necessary data has loaded makes the application more stable and eliminates the need for artificial waits in the test.

#8about 13 minutes

Q&A on Replay.io architecture, adoption, and CI/CD

The speaker answers questions about Replay.io's technical foundation, its integration with CI/CD pipelines, and strategies for handling sensitive data during recordings.