Capture the browser steps behind an issue. Replay the moment, inspect the affected element, and give your teammate the details to start investigating.
Free extension for desktop Chrome. Try it before signing up.
button#calculate“I added a third seat, but the quote still uses two.”
Start recording, reproduce the issue, then play it back. Follow the captured clicks and page changes to the moment you want to investigate.
Calculate renewal reveals the mismatch: three seats on screen, two in the quote.
Pause the replay and select an element. Review its captured details, then add a note about what you expected and what happened instead.
button#calculate#calculatePLAYWRIGHT LOCATOR CANDIDATEpage.getByRole('button', { name: 'Calculate renewal' })Check the target and uniqueness in your test’s page state.
“I added a third seat, but the quote still uses two.”
Inspect CSS, XPath, and locator candidates. Copy the format you need and validate it in your test.
Explore selector inspectionReview available attributes, computed styles, dimensions, and page context alongside the captured visual.
Tag the affected element and explain the mismatch, so your teammate knows where to look.
Use what you recorded as a starting point for a test or an AI-assisted investigation. Keep the review and verification in your hands.
Export a Playwright draft from the reproduction steps. Review the locators, add setup and assertions, then run it in your environment.
Explore the Playwright workflowConnect Claude Code, Codex, or a compatible MCP client to authorized recordings and element evidence. Review any proposed fix or test before using it.
See how the MCP connection worksCapture the browser flow you choose to reproduce.
Input values are masked by default. Other page content can still appear.
Check the recording’s access settings before sending its link.