Skip to content
Merged
Show file tree
Hide file tree
Changes from all 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
2 changes: 0 additions & 2 deletions .github/workflows/lint.yml
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,6 @@ jobs:
steps:
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
with:
version: 8
- uses: volta-cli/action@v4
with:
node-version: 20.12.0
Expand Down
24 changes: 7 additions & 17 deletions .github/workflows/playwright.yml
Original file line number Diff line number Diff line change
Expand Up @@ -2,36 +2,26 @@ name: Playwright Tests
on: [pull_request]

jobs:
wait-for-vercel:
name: Wait for vercel
runs-on: ubuntu-latest
steps:
- name: Wait for Vercel preview deployment to be ready
uses: patrickedqvist/wait-for-vercel-preview@v1.3.1
id: wait
with:
token: ${{ secrets.GITHUB_TOKEN }}
max_timeout: 120
outputs:
preview_url: ${{ steps.wait.outputs.url }}
test:
timeout-minutes: 60
runs-on: ubuntu-latest
needs: [wait-for-vercel]
steps:
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
with:
version: 8
- uses: actions/setup-node@v4
with:
node-version: lts/*
node-version: 20.12.0
cache: pnpm
- name: Install dependencies
run: pnpm i
- name: Build site
run: pnpm run build
env:
NEXT_PUBLIC_SITE_URL: 'https://docs.replay.io'
- name: Install Replay Chromium
run: pnpx replayio install
- name: Run Playwright tests
run: pnpm test
env:
BASE_URL: ${{ needs.wait-for-vercel.outputs.preview_url }}
BASE_URL: http://127.0.0.1:3000
REPLAY_API_KEY: ${{ secrets.REPLAY_API_KEY }}
4 changes: 3 additions & 1 deletion mdx-components.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,9 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
const fileName = codeProps.fileName as string | undefined
const lineNumbers = codeProps.lineNumbers as boolean | undefined
const rawHighlight = codeProps.highlight as
string | string[] | undefined
| string
| string[]
| undefined
const highlight =
typeof rawHighlight === 'string'
? (JSON.parse(rawHighlight) as string[])
Expand Down
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -79,5 +79,6 @@
"volta": {
"node": "20.12.0",
"bun": "1.1.1"
}
},
"packageManager": "pnpm@9.15.4"
}
14 changes: 13 additions & 1 deletion playwright.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,22 @@ import { devices as replayDevices, replayReporter } from '@replayio/playwright'
import dotenv from 'dotenv'
dotenv.config()

const baseURL =
process.env.BASE_URL ||
(process.env.CI ? 'http://127.0.0.1:3000' : 'http://localhost:3000')

const config: PlaywrightTestConfig = {
use: {
baseURL: process.env.CI ? process.env.BASE_URL : 'http://localhost:3000',
baseURL,
},
webServer: process.env.CI
? {
command: 'pnpm start',
url: baseURL,
reuseExistingServer: false,
timeout: 120_000,
}
: undefined,
reporter: [
replayReporter({
apiKey: process.env.REPLAY_API_KEY,
Expand Down
45 changes: 7 additions & 38 deletions public/agent/basics.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,44 +2,13 @@

Canonical URL: https://docs.replay.io/basics

The Basics section covers everything you need to start recording and
debugging with Replay.
The Basics section currently highlights **Replay QA** — an autonomous app
testing tool built on Replay's time-travel debugging engine.

## Getting Started
## Replay QA

- [How to record](https://docs.replay.io/basics/getting-started/record-your-app)
- [Record your Playwright tests](https://docs.replay.io/basics/getting-started/record-your-playwright-tests)
- [Overview](https://docs.replay.io/basics/replay-qa/overview)
- [CI integration with FRPC](https://docs.replay.io/basics/replay-qa/frpc-ci)
- [Publishing with source maps](https://docs.replay.io/basics/replay-qa/source-maps)

## Time Travel

- [Why time travel?](https://docs.replay.io/basics/time-travel/why-time-travel)
- [How does time travel work?](https://docs.replay.io/basics/time-travel/how-does-time-travel-work)

## Replay DevTools

- [Overview](https://docs.replay.io/basics/replay-devtools/overview)
- Time Travel DevTools
- Framework DevTools
- Browser DevTools

## Replay Chrome Extension

- [Getting started](https://docs.replay.io/basics/replay-chrome-extension/getting-started)

## Replay MCP

The Replay MCP server lets AI agents inspect the contents of recordings on
https://replay.io.

- [Overview](https://docs.replay.io/basics/replay-mcp/overview)
- [Quickstart](https://docs.replay.io/basics/replay-mcp/quickstart)
- [Tools reference](https://docs.replay.io/basics/replay-mcp/tools-reference)
- Public MCP endpoint: https://mcp.replay.io
- Server card: https://docs.replay.io/.well-known/mcp/server-card.json

## Test Suite Dashboard

- [Overview](https://docs.replay.io/basics/test-suites/overview)
- [Recent runs](https://docs.replay.io/basics/test-suites/recent-runs)
- [Top failing and flaky tests](https://docs.replay.io/basics/test-suites/top-failing-and-flaky-tests)
- [PR comments](https://docs.replay.io/basics/test-suites/pr-comments)
Launch Replay QA: https://qa.replay.io
34 changes: 14 additions & 20 deletions public/agent/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,25 +2,18 @@

Canonical URL: https://docs.replay.io/

Replay is the first deterministic browser. Once a bug or flaky test is captured,
anyone can inspect it with browser DevTools without having to reproduce it
locally.

The docs homepage prioritizes **CI/CD** (Playwright in GitHub Actions and other
providers), **Replay MCP** (agents inspecting recordings), and the **Chrome
extension**, in that order. Time-travel **DevTools** remain the inspection layer
for any recording—they are not the primary narrative.

This documentation site is the canonical reference for using Replay. The
top-level sections are:

- [Basics](https://docs.replay.io/basics) — getting started, recording your
app, recording Playwright test suites, time-travel debugging, Replay
DevTools, and the Test Suite Dashboard.
- [Learn](https://docs.replay.io/learn) — guided tutorials, framework-specific
examples, and conceptual deep-dives on how Replay works.
- [Reference](https://docs.replay.io/reference) — exhaustive reference for the
Replay APIs, the Replay Protocol, the Replay CLI, and supported test runners.
Replay QA is an autonomous app testing tool built on Replay's time-travel
debugging engine. Point it at a web app and it explores the application,
discovers user journeys, writes Playwright tests, executes them while capturing
full runtime recordings, and delivers root cause analysis and suggested fixes
for every bug it finds.

This documentation site is the canonical reference for Replay QA. Start here:

- [Replay QA overview](https://docs.replay.io/basics/replay-qa/overview)
- [CI integration with FRPC](https://docs.replay.io/basics/replay-qa/frpc-ci)
- [Publishing with source maps](https://docs.replay.io/basics/replay-qa/source-maps)
- [Basics section index](https://docs.replay.io/basics)

## Machine-readable surfaces

Expand All @@ -30,7 +23,7 @@ top-level sections are:
Playwright, MCP)
- `/.well-known/openid-configuration` — OAuth/OIDC discovery for the Replay
authentication tenant
- `/sitemap.xml` — full URL inventory
- `/sitemap.xml` — URL inventory for public Replay QA documentation
- `/robots.txt` — crawl + AI-bot policy with `Content-Signal`

## Content usage
Expand All @@ -42,6 +35,7 @@ not be ingested into model training corpora.
## Contact

- Product site: https://www.replay.io
- Replay QA: https://qa.replay.io
- App: https://app.replay.io
- Discord: https://replay.io/discord
- GitHub: https://github.com/replayio
27 changes: 0 additions & 27 deletions public/agent/learn.md

This file was deleted.

37 changes: 0 additions & 37 deletions public/agent/reference.md

This file was deleted.

18 changes: 1 addition & 17 deletions src/app/basics/replay-qa/source-maps/page.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -66,22 +66,6 @@ module.exports = {

Deploy with these settings and Replay QA will pick up the source maps on its own.

### Private source maps — for apps that don't expose source to end users

If you want source maps available to Replay but don't want to expose them publicly (a common production concern), upload them to Replay ahead of time:

1. Configure your build to emit source maps (same settings above)
2. Upload them to Replay using the CLI after the build:

```sh
npm run build
npx replayio upload-source-maps --group <version-or-sha> <buildOutputDir>
```

3. Strip or omit the `sourceMappingURL` comment from your build output so the maps aren't publicly reachable

Set `REPLAY_API_KEY` in your environment so the CLI can authenticate. API keys are available in [Team Settings](/reference/ci-workflows/generate-api-key). For Webpack, the [`@replayio/sourcemap-upload-webpack-plugin`](https://www.npmjs.com/package/@replayio/sourcemap-upload-webpack-plugin) handles upload automatically as part of the build. See the [Uploading source maps reference](/reference/replay-cli/source-maps) for full details.

### React 18.3 — extra step required

React 19 ships unminified production artifacts, so standard source maps work. React 18 shipped pre-minified builds with no source maps, which means Replay cannot read the internal function names it needs for React analysis.
Expand All @@ -100,7 +84,7 @@ Check which bundler or framework is in use (Next.js, Vite, Webpack, etc.) and ap
- Vite: set `build.sourcemap: true` in vite.config.js
- Webpack: set `devtool: 'source-map'` in webpack.config.js

Replay QA discovers publicly served source maps automatically — no upload step is needed unless we specifically want to keep source maps private.
Replay QA discovers publicly served source maps automatically — no upload step is needed.

If the project uses React 18.3 (not React 19), also install @acemarke/react-prod-sourcemaps and configure it per the package README, so Replay can instrument React internals for component analysis.

Expand Down
Loading
Loading