Automated End-to-End Testing with Chrome DevTools Recorder and Cloud Run
Ensuring critical user journeys work consistently is crucial for web applications. I recently explored how to leverage Chrome DevTools Recorder and Google Cloud Run to automate end-to-end testing. In this post (and the accompanying video!), I'll walk you through how you can set this up.
Here's a video walkthrough:
The Goal
To provide web developers with a simple way to record user flows directly in Chrome and reliably replay them as automated tests running in the cloud on Google Cloud Run.
The Approach
The solution involves a custom Chrome Extension that integrates with the Chrome DevTools Recorder.
- Record: Use the standard Chrome DevTools Recorder to capture a user journey (e.g., signup, checkout).
- Execute in Cloud Run: My extension adds a button to the Recorder panel. Clicking this sends the recording to a Google Cloud Run job.
- Cloud Replay: The Cloud Run job uses a containerized headless Chrome instance to execute the recorded steps.
- Scheduling & Alerting: You can schedule these Cloud Run jobs to run automatically (e.g., daily) and set up alerts based on logs to get notified if a journey fails.
The Tech
- Chrome DevTools Recorder: Captures user interactions.
- Custom Chrome Extension: Upload the recording in JSON format to Google Cloud Storage, then creates a Cloud Run job with a pre-built container pointing at the recording. See code
- Google Cloud Run: Node.js code to execute the replay with headless Chrome, packaged into a container image that executes to completion.
Check it out!
- YouTube video
- Source code (Extension & Replayer Container): github.com/steren/cloud-run-replay