From deb13f0877b980ffa9bef5ed796415a812299b35 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 24 Aug 2026 15:01:40 -0400 Subject: [PATCH 01/12] Hide old product docs --- package.json | 3 +- public/agent/basics.md | 45 +------ public/agent/index.md | 34 ++--- public/agent/learn.md | 27 ---- public/agent/reference.md | 37 ----- src/app/basics/replay-qa/source-maps/page.mdx | 18 +-- src/app/page.tsx | 86 +++++------- src/app/robots.txt/route.ts | 8 ++ src/app/sitemap.ts | 2 + src/components/Hero.tsx | 25 ++-- src/components/HiddenPagesToggle.tsx | 127 ++++++++++++++++++ src/components/Layout.tsx | 35 +++-- src/components/MobileNavigation.tsx | 34 +++-- src/components/Navigation.tsx | 8 +- src/components/PrevNextLinks.tsx | 15 ++- src/generated/agent-skills.json | 2 +- src/lib/agent-bots.mjs | 45 +++++++ src/lib/agentReadiness.ts | 6 +- src/lib/search.mjs | 18 +-- src/lib/visibility-paths.mjs | 39 ++++++ src/lib/visibility.ts | 36 +++++ src/middleware.ts | 32 ++++- tests/navigation.spec.ts | 43 +++++- 23 files changed, 459 insertions(+), 266 deletions(-) delete mode 100644 public/agent/learn.md delete mode 100644 public/agent/reference.md create mode 100644 src/components/HiddenPagesToggle.tsx create mode 100644 src/lib/agent-bots.mjs create mode 100644 src/lib/visibility-paths.mjs create mode 100644 src/lib/visibility.ts diff --git a/package.json b/package.json index ac3c9a46..30d1ab43 100644 --- a/package.json +++ b/package.json @@ -79,5 +79,6 @@ "volta": { "node": "20.12.0", "bun": "1.1.1" - } + }, + "packageManager": "pnpm@11.7.0+sha512.19cc852c120c7125760f2443ee6be0ca5b40f9f50598de1a09a1f177503e010e57c23c77646e01e761de59bf874fb22a3398c33ab9691fc13eb946b6f0f4d620" } diff --git a/public/agent/basics.md b/public/agent/basics.md index 22440413..73e2ae28 100644 --- a/public/agent/basics.md +++ b/public/agent/basics.md @@ -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 diff --git a/public/agent/index.md b/public/agent/index.md index 2b80facd..d2a5fb8a 100644 --- a/public/agent/index.md +++ b/public/agent/index.md @@ -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 @@ -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 @@ -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 diff --git a/public/agent/learn.md b/public/agent/learn.md deleted file mode 100644 index f7da94db..00000000 --- a/public/agent/learn.md +++ /dev/null @@ -1,27 +0,0 @@ -# Replay Docs — Learn - -Canonical URL: https://docs.replay.io/learn - -The Learn section contains guided tutorials and framework-specific examples -for working with Replay. - -## Replay Course - -- [Replay Course](https://docs.replay.io/learn/replay-course) - -## Examples - -Framework-specific recipes for adding Replay to a real codebase: - -- [Next.js](https://docs.replay.io/learn/examples/nextjs) -- [Vite](https://docs.replay.io/learn/examples/vite) -- [Create React App](https://docs.replay.io/learn/examples/cra) -- [Storybook](https://docs.replay.io/learn/examples/storybook) - -## Comparisons - -How Replay relates to existing browser/debugger tooling: - -- [Chrome Recorder](https://docs.replay.io/learn/comparisons/chrome) -- [Loom](https://docs.replay.io/learn/comparisons/loom) -- [Browser DevTools](https://docs.replay.io/learn/comparisons/devtools) diff --git a/public/agent/reference.md b/public/agent/reference.md deleted file mode 100644 index cd5b98e0..00000000 --- a/public/agent/reference.md +++ /dev/null @@ -1,37 +0,0 @@ -# Replay Docs — Reference - -Canonical URL: https://docs.replay.io/reference - -The Reference section is the complete, exhaustive reference for the Replay -platform. - -## Test Runners - -Replay's first-party test-runner integrations: - -- [Overview](https://docs.replay.io/reference/test-runners/overview) -- [Playwright](https://docs.replay.io/basics/getting-started/record-your-playwright-tests) -- [GitHub Actions setup (Playwright)](https://docs.replay.io/reference/test-runners/playwright/github-actions) - -## Integrations / APIs - -- [Replay Protocol](https://docs.replay.io/reference/integrations/replay-apis/replay-protocol) -- Protocol docs: https://static.replay.io/protocol/tot/ -- GraphQL API: https://api.replay.io/v1/graphql - -## Replay CLI - -The `replayio` CLI installs the Replay browser, records sessions, and uploads -them. See https://github.com/replayio/replay-cli/tree/main/packages/replayio. - -## Replay MCP server - -- Public endpoint: https://mcp.replay.io -- Server card: https://docs.replay.io/.well-known/mcp/server-card.json - -## Authentication - -Replay uses OAuth 2.0 / OIDC for API access. Discovery metadata: - -- OIDC: https://docs.replay.io/.well-known/openid-configuration -- OAuth Protected Resource: https://docs.replay.io/.well-known/oauth-protected-resource diff --git a/src/app/basics/replay-qa/source-maps/page.mdx b/src/app/basics/replay-qa/source-maps/page.mdx index 0e69bbdd..0f56a0ff 100644 --- a/src/app/basics/replay-qa/source-maps/page.mdx +++ b/src/app/basics/replay-qa/source-maps/page.mdx @@ -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 -``` - -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. @@ -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. diff --git a/src/app/page.tsx b/src/app/page.tsx index 97fa4c5b..30db4e5a 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -3,77 +3,51 @@ import MiniCard from '@/components/MiniCard' import { Hero } from '@/components/Hero' import Link from 'next/link' -/** Primary paths: CI/CD (Playwright, GitHub, dashboards), then MCP, then Chrome. */ const cards: CardAttributes[] = [ { - icon: 'playwrightsimple', - title: 'Playwright in CI', - content: - 'Run tests in Replay Browser and upload recordings from GitHub Actions—or wire up other CI providers.', - href: '/basics/getting-started/record-your-playwright-tests/github-actions', - }, - { - icon: 'analytics', - title: 'Test suite dashboard', - content: - 'Recent runs, top failing and flaky tests, and PR comments—visibility across your pipeline.', - href: '/basics/test-suites/overview', - }, - { - icon: 'link', - title: 'Replay MCP', + icon: 'replay', + title: 'Replay QA overview', content: - 'Connect recordings to Cursor, Claude Code, and other MCP clients so agents can inspect real runtime.', - href: '/basics/replay-mcp/overview', + 'Autonomous app testing that explores your web app, writes Playwright tests, captures recordings, and delivers root cause analysis.', + href: '/basics/replay-qa/overview', }, { - icon: 'replay', - title: 'Replay Chrome extension', + icon: 'github', + title: 'CI integration with FRPC', content: - 'One-click recording from the browser when you are not driving everything from CI.', - href: '/basics/replay-chrome-extension/getting-started', + 'Run Replay QA against every change in your pipeline with the FRPC CI integration.', + href: '/basics/replay-qa/frpc-ci', }, { icon: 'uploadicon', - title: 'Other CI providers', + title: 'Publishing with source maps', content: - 'Not on GitHub Actions? Adapt the same install, env, and upload flow to your stack.', - href: '/basics/getting-started/record-your-playwright-tests/other-ci-providers', + 'Publish your app with source maps so Replay QA traces failures back to your original source code.', + href: '/basics/replay-qa/source-maps', }, ] const miniCards: CardAttributes[] = [ { - icon: 'playwrightsimple', - title: 'Playwright guide', - content: 'Full setup: Replay browser, reporter, debugging, and FAQs.', - href: '/basics/getting-started/record-your-playwright-tests', - }, - { - icon: 'pullrequest', - title: 'PR comments', - content: 'Root cause and context on the pull request when tests fail.', - href: '/basics/test-suites/pr-comments', - }, - { - icon: 'analytics', - title: 'Top failing & flaky tests', + icon: 'replay', + title: 'Launch Replay QA', content: - 'Prioritize what breaks most often so agents and humans fix the right things.', - href: '/basics/test-suites/top-failing-and-flaky-tests', + 'Give Replay QA a URL and let it autonomously navigate, test, and report bugs.', + href: '/basics/replay-qa/overview', }, { - icon: 'link', - title: 'MCP quickstart', - content: 'Wire the server into your editor and start querying recordings.', - href: '/basics/replay-mcp/quickstart', + icon: 'github', + title: 'Connect a GitHub repo', + content: + 'Install the GitHub App and test every change as it lands—no CI configuration required.', + href: '/basics/replay-qa/overview', }, { - icon: 'inspect', - title: 'Replay DevTools overview', + icon: 'uploadicon', + title: 'Source maps guide', content: - 'Time-travel panels for console, network, sources—still the foundation under CI and MCP.', - href: '/basics/replay-devtools/overview', + 'Get root cause analyses that reference the right files and line numbers.', + href: '/basics/replay-qa/source-maps', }, ] @@ -85,7 +59,7 @@ export default function Page() { >

- Tool setup guides + Replay QA guides

{cards.map(({ href, content, icon, title }) => ( @@ -98,11 +72,11 @@ export default function Page() { /> ))}
-

Learn the basics

+

Get started

{miniCards.map(({ href, content, icon, title }) => (

- Curious how time travel fits in?{' '} + Ready to try Replay QA?{' '} - Why time travel? + Launch Replay QA

diff --git a/src/app/robots.txt/route.ts b/src/app/robots.txt/route.ts index a8d9bd76..40df3121 100644 --- a/src/app/robots.txt/route.ts +++ b/src/app/robots.txt/route.ts @@ -60,6 +60,10 @@ export function GET() { // Default rules apply to every UA that doesn't match a more specific block. lines.push('User-agent: *') lines.push('Allow: /') + lines.push('Allow: /basics/replay-qa/') + lines.push('Disallow: /basics/') + lines.push('Disallow: /learn/') + lines.push('Disallow: /reference/') lines.push('Disallow: /api/') lines.push('Disallow: /_next/') lines.push('Disallow: /agent/') // markdown mirrors are reached via Accept-negotiation @@ -69,6 +73,10 @@ export function GET() { for (const bot of allowedBots) { lines.push(`User-agent: ${bot}`) lines.push('Allow: /') + lines.push('Allow: /basics/replay-qa/') + lines.push('Disallow: /basics/') + lines.push('Disallow: /learn/') + lines.push('Disallow: /reference/') lines.push('Disallow: /api/') lines.push('Disallow: /_next/') lines.push('') diff --git a/src/app/sitemap.ts b/src/app/sitemap.ts index 9b3cfaa2..74c026fa 100644 --- a/src/app/sitemap.ts +++ b/src/app/sitemap.ts @@ -2,6 +2,7 @@ import type { MetadataRoute } from 'next' import { flatNavigation, NavigationItem } from '@/lib/navigation' import { getSiteOrigin } from '@/lib/agentReadiness' +import { isVisibleNavItem } from '@/lib/visibility' /** * /sitemap.xml @@ -16,6 +17,7 @@ export default function sitemap(): MetadataRoute.Sitemap { const urls: MetadataRoute.Sitemap = [] function visit(item: NavigationItem) { + if (!isVisibleNavItem(item)) return if (item.href && !seen.has(item.href)) { seen.add(item.href) urls.push({ diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx index 677c6585..97a5a165 100644 --- a/src/components/Hero.tsx +++ b/src/components/Hero.tsx @@ -18,38 +18,37 @@ export function Hero() { /> )}

- Replay documentation + Replay QA documentation

- CI & agents first + Autonomous app testing

- Record Playwright runs in CI, close the loop on failures from - the PR, and give your coding agent full runtime context through - Replay MCP. Everything here is built on the same deterministic, - time-travel recordings that power Replay DevTools—we are - doubling down on agentic workflows and less manual digging. + Replay QA explores your web app, discovers user journeys, writes + Playwright tests, and delivers root cause analysis for every bug + it finds — all powered by Replay's time-travel debugging + engine.

- Playwright + GitHub Actions + Replay QA overview - Replay MCP + Launch Replay QA

- Quickstart: record your app in the Replay browser + CI integration with FRPC

diff --git a/src/components/HiddenPagesToggle.tsx b/src/components/HiddenPagesToggle.tsx new file mode 100644 index 00000000..b0703dd3 --- /dev/null +++ b/src/components/HiddenPagesToggle.tsx @@ -0,0 +1,127 @@ +'use client' + +import { useSyncExternalStore } from 'react' +import clsx from 'clsx' + +const STORAGE_KEY = 'replay-docs:showHidden' + +function readShowHidden(): boolean { + if (typeof window === 'undefined') return false + return window.localStorage.getItem(STORAGE_KEY) === '1' +} + +function subscribe(onStoreChange: () => void) { + const handler = (event: StorageEvent) => { + if (event.key === STORAGE_KEY || event.key === null) { + onStoreChange() + } + } + window.addEventListener('storage', handler) + window.addEventListener('replay-docs:showHidden', onStoreChange) + return () => { + window.removeEventListener('storage', handler) + window.removeEventListener('replay-docs:showHidden', onStoreChange) + } +} + +export function useShowHidden(): [boolean, (next: boolean) => void] { + const showHidden = useSyncExternalStore( + subscribe, + readShowHidden, + () => false, + ) + + const setShowHidden = (next: boolean) => { + if (typeof window === 'undefined') return + if (next) { + window.localStorage.setItem(STORAGE_KEY, '1') + } else { + window.localStorage.removeItem(STORAGE_KEY) + } + window.dispatchEvent(new Event('replay-docs:showHidden')) + } + + return [showHidden, setShowHidden] +} + +function EyeIcon({ className }: { className?: string }) { + return ( + + ) +} + +function EyeOffIcon({ className }: { className?: string }) { + return ( + + ) +} + +export function HiddenPagesToggle({ className }: { className?: string }) { + const [showHidden, setShowHidden] = useShowHidden() + + return ( +
+ +
+ ) +} diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index 5548b199..a1d2465c 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -6,7 +6,9 @@ import { usePathname } from 'next/navigation' import clsx from 'clsx' import { Logo, Logomark } from '@/components/Logo' +import { useShowHidden } from '@/components/HiddenPagesToggle' import { MobileNavigation } from '@/components/MobileNavigation' +import { HiddenPagesToggle } from '@/components/HiddenPagesToggle' import { Navigation } from '@/components/Navigation' import { Search } from '@/components/Search' import { ThemeSelector } from '@/components/ThemeSelector' @@ -115,6 +117,8 @@ function SubheaderNavigationLink({ } function SubheaderNavigation() { + const [showHidden] = useShowHidden() + return (
@@ -123,18 +127,15 @@ function SubheaderNavigation() { name={'Basics'} isDefault={true} baseHref={'/basics'} - href={'/basics/time-travel/why-time-travel'} - /> - {/* */} - + {showHidden && ( + + )}
@@ -199,8 +200,16 @@ export function Layout({ children }: { children: React.ReactNode }) { {/* Sidebar — flush against the left edge, wide enough to keep nav items on a single line without wrapping. */} diff --git a/src/components/MobileNavigation.tsx b/src/components/MobileNavigation.tsx index 91833a48..4a0943c6 100644 --- a/src/components/MobileNavigation.tsx +++ b/src/components/MobileNavigation.tsx @@ -6,6 +6,7 @@ import { usePathname, useSearchParams } from 'next/navigation' import { Dialog } from '@headlessui/react' import { Logomark } from '@/components/Logo' +import { HiddenPagesToggle } from '@/components/HiddenPagesToggle' import { Navigation } from '@/components/Navigation' function MenuIcon(props: React.ComponentPropsWithoutRef<'svg'>) { @@ -82,20 +83,27 @@ export function MobileNavigation() { className="fixed inset-0 z-50 flex items-start overflow-y-auto bg-gray-900/50 pr-10 backdrop-blur lg:hidden" aria-label="Navigation" > - -
- - - - + +
+
+ + + + +
+
+
+ +
+
+
- diff --git a/src/components/Navigation.tsx b/src/components/Navigation.tsx index 3645c860..080b8f66 100644 --- a/src/components/Navigation.tsx +++ b/src/components/Navigation.tsx @@ -4,7 +4,9 @@ import { usePathname } from 'next/navigation' import clsx from 'clsx' import { navigation, NavigationItem } from '@/lib/navigation' +import { filterNavigation } from '@/lib/visibility' import { Disclosure } from '@headlessui/react' +import { useShowHidden } from './HiddenPagesToggle' import { Icon } from './Icon' import { NavIcon } from './NavIcon' import styles from './Navigation.module.css' @@ -187,7 +189,11 @@ export function Navigation({ initialRoute = 'basics' } - const localizedNavigation = navigation[initialRoute] ?? [] + const [showHidden] = useShowHidden() + const localizedNavigation = filterNavigation( + navigation[initialRoute] ?? [], + showHidden, + ) return (
) diff --git a/src/lib/visibility-paths.mjs b/src/lib/visibility-paths.mjs index ae86c391..736a650b 100644 --- a/src/lib/visibility-paths.mjs +++ b/src/lib/visibility-paths.mjs @@ -31,7 +31,8 @@ export function isHiddenPath(pathname) { if (!normalized) return false const inDocSection = DOC_SECTION_PREFIXES.some( - (prefix) => normalized === prefix.slice(0, -1) || normalized.startsWith(prefix), + (prefix) => + normalized === prefix.slice(0, -1) || normalized.startsWith(prefix), ) if (!inDocSection) return false diff --git a/tests/navigation.spec.ts b/tests/navigation.spec.ts index d9f111ea..43a3059d 100644 --- a/tests/navigation.spec.ts +++ b/tests/navigation.spec.ts @@ -5,7 +5,9 @@ test('navigation shows Replay QA pages by default', async ({ page }) => { const nav = page.locator('nav') await expect(nav.getByText('Replay QA', { exact: true })).toBeVisible() await expect(nav.getByText('Overview', { exact: true })).toBeVisible() - await expect(nav.getByText('CI integration with FRPC', { exact: true })).toBeVisible() + await expect( + nav.getByText('CI integration with FRPC', { exact: true }), + ).toBeVisible() }) async function clickHiddenPagesToggle(page: import('@playwright/test').Page) { @@ -13,29 +15,41 @@ async function clickHiddenPagesToggle(page: import('@playwright/test').Page) { await page.getByTestId('hidden-pages-toggle').click() } -test('show internal pages toggle reveals hidden navigation', async ({ page }) => { +test('show internal pages toggle reveals hidden navigation', async ({ + page, +}) => { await page.goto('/basics/replay-qa/overview') const nav = page.locator('nav') - await expect(nav.getByText('Replay DevTools', { exact: true })).not.toBeVisible() + await expect( + nav.getByText('Replay DevTools', { exact: true }), + ).not.toBeVisible() await clickHiddenPagesToggle(page) await expect(nav.getByText('Replay DevTools', { exact: true })).toBeVisible() await clickHiddenPagesToggle(page) - await expect(nav.getByText('Replay DevTools', { exact: true })).not.toBeVisible() + await expect( + nav.getByText('Replay DevTools', { exact: true }), + ).not.toBeVisible() }) -test('navigation expanding works for internal pages when enabled', async ({ page }) => { +test('navigation expanding works for internal pages when enabled', async ({ + page, +}) => { await page.goto('/basics/replay-qa/overview') const nav = page.locator('nav') await clickHiddenPagesToggle(page) await nav.getByText('Time Travel DevTools').click() - await expect(nav.getByText('Live Console logs', { exact: true })).toBeVisible() + await expect( + nav.getByText('Live Console logs', { exact: true }), + ).toBeVisible() }) -test('navigation collapsing works for internal pages when enabled', async ({ page }) => { +test('navigation collapsing works for internal pages when enabled', async ({ + page, +}) => { await page.goto('/basics/test-suites/pr-comments') const nav = page.locator('nav') From fbb8bf256944faeb2246baa7af8044f2741da488 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 24 Aug 2026 16:31:06 -0400 Subject: [PATCH 06/12] Fix broken playwright test --- tests/quickstart.spec.ts | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/tests/quickstart.spec.ts b/tests/quickstart.spec.ts index 2b63d392..b302b663 100644 --- a/tests/quickstart.spec.ts +++ b/tests/quickstart.spec.ts @@ -1,13 +1,9 @@ import { test, expect } from '@playwright/test' -test('home page links to record-your-app quickstart', async ({ page }) => { +test('home page links to Replay QA overview', async ({ page }) => { await page.goto('/') - await page - .getByRole('link', { - name: 'Quickstart: record your app in the Replay browser', - }) - .click() - await expect(page).toHaveURL(/.*\/getting-started/) - const heading = page.getByRole('heading', { name: 'How to record' }) + await page.getByRole('link', { name: 'Replay QA overview' }).click() + await expect(page).toHaveURL(/.*\/basics\/replay-qa\/overview/) + const heading = page.getByRole('heading', { name: 'Replay QA Overview' }) await expect(heading).toBeVisible() }) From 83a4255f88771273848decb33f44145610cbae10 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 24 Aug 2026 16:32:46 -0400 Subject: [PATCH 07/12] Change login endpoint --- src/components/Layout.tsx | 2 +- src/generated/agent-skills.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index a1d2465c..d75778fa 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -69,7 +69,7 @@ function Header() { diff --git a/src/generated/agent-skills.json b/src/generated/agent-skills.json index b46d3284..1caa3f06 100644 --- a/src/generated/agent-skills.json +++ b/src/generated/agent-skills.json @@ -2,7 +2,7 @@ "$schema": "https://raw.githubusercontent.com/cloudflare/agent-skills-discovery-rfc/main/schema/index.schema.json", "version": "0.2.0", "site": "https://docs.replay.io", - "generatedAt": "2026-08-24T18:59:46.660Z", + "generatedAt": "2026-08-24T20:32:03.932Z", "skills": [ { "name": "replay-cli", From 230897cd1a711ea58c69e02a3848616dd5e81840 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 24 Aug 2026 16:52:36 -0400 Subject: [PATCH 08/12] Fix test --- tests/quickstart.spec.ts | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/tests/quickstart.spec.ts b/tests/quickstart.spec.ts index b302b663..8b8103d5 100644 --- a/tests/quickstart.spec.ts +++ b/tests/quickstart.spec.ts @@ -2,8 +2,11 @@ import { test, expect } from '@playwright/test' test('home page links to Replay QA overview', async ({ page }) => { await page.goto('/') - await page.getByRole('link', { name: 'Replay QA overview' }).click() + // Use the guide card link — the hero CTA sits under the sticky header and + // isn't reliably clickable in automated tests. + await page.locator('a.group[href="/basics/replay-qa/overview"]').click() await expect(page).toHaveURL(/.*\/basics\/replay-qa\/overview/) - const heading = page.getByRole('heading', { name: 'Replay QA Overview' }) - await expect(heading).toBeVisible() + await expect( + page.getByRole('heading', { name: 'Replay QA Overview' }), + ).toBeVisible() }) From de0659b8babe35f637a38727541ac5ff0e494fa9 Mon Sep 17 00:00:00 2001 From: Strider Wilson Date: Mon, 24 Aug 2026 16:59:07 -0400 Subject: [PATCH 09/12] Fix scroll issue --- src/components/Layout.tsx | 8 ++++---- src/components/MobileNavigation.tsx | 6 +++--- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx index d75778fa..7c7423e4 100644 --- a/src/components/Layout.tsx +++ b/src/components/Layout.tsx @@ -199,13 +199,13 @@ export function Layout({ children }: { children: React.ReactNode }) {
{/* Sidebar — flush against the left edge, wide enough to keep nav items on a single line without wrapping. */} -