Debugging failed automation tests can be time-consuming, especially when tests run in CI/CD pipelines or on remote environments.
Playwright makes debugging easier by providing built-in support for:
- Screenshots
- Video recording
- Execution traces
In this article, we'll learn how to capture screenshots and record videos in Playwright using Java.
Why Capture Screenshots and Videos?
Screenshots and videos help automation teams:
- Investigate failures quickly
- Share evidence with developers
- Improve defect reports
- Reduce debugging time
- Analyze intermittent issues
Many organizations automatically attach screenshots and videos to test reports.
Taking a Basic Screenshot
Capturing a screenshot in Playwright is straightforward.
page.screenshot(
new Page.ScreenshotOptions()
.setPath(Paths.get("homepage.png"))
);This captures the currently visible portion of the page.
Output:
homepage.pngCapturing a Full Page Screenshot
Sometimes the page extends beyond the visible browser window.
Playwright allows capturing the entire page.
page.screenshot(
new Page.ScreenshotOptions()
.setFullPage(true)
.setPath(Paths.get("fullpage.png"))
);This captures the complete page from top to bottom.
Capturing an Element Screenshot
You can capture screenshots of individual elements.
Example:
Locator loginButton = page.locator("#loginButton");
loginButton.screenshot(
new Locator.ScreenshotOptions()
.setPath(Paths.get("loginButton.png"))
);This is useful for:
- Logo verification
- UI validation
- Visual testing
Capturing Screenshots on Test Failure
A common framework practice is to capture screenshots only when tests fail.
Example:
try {
assertThat(page).hasTitle("Dashboard");
}
catch (Exception e) {
page.screenshot(
new Page.ScreenshotOptions()
.setPath(Paths.get("failure.png"))
);
throw e;
}This helps teams analyze failures quickly.
Recording Videos in Playwright
Playwright can automatically record browser sessions.
To enable video recording, configure the browser context.
BrowserContext context =
browser.newContext(
new Browser.NewContextOptions()
.setRecordVideoDir(
Paths.get("videos/")
)
);Playwright will save videos automatically after execution.
Creating Pages Using Video Enabled Context
Page page = context.newPage();
page.navigate(
"https://www.google.com"
);Once the test completes, the video file will be generated.
Example output:
videos/
└── 3c84b7d2.webmSaving Videos After Execution
Videos are saved after the browser context closes.
Example:
context.close();
browser.close();If the context is not closed properly, videos may not be generated.
Recording Videos Only for Failed Tests
In large frameworks, recording every test can consume significant storage.
Many teams use one of these approaches:
- Record videos only for failed tests.
- Delete videos for successful tests.
- Retain videos only in CI/CD environments.
Recommended Folder Structure
Example project structure:
project
├── screenshots
│ ├── login_failure.png
│ └── dashboard.png
│
├── videos
│ ├── test1.webm
│ └── test2.webm
│
└── srcKeeping artifacts organized simplifies debugging.
Complete Example
try (Playwright playwright = Playwright.create()) {
Browser browser =
playwright.chromium().launch(
new BrowserType.LaunchOptions()
.setHeadless(false)
);
BrowserContext context =
browser.newContext(
new Browser.NewContextOptions()
.setRecordVideoDir(
Paths.get("videos/")
)
);
Page page = context.newPage();
page.navigate("https://www.google.com");
page.screenshot(
new Page.ScreenshotOptions()
.setFullPage(true)
.setPath(Paths.get("google.png"))
);
context.close();
browser.close();
}This example records a video and captures a full-page screenshot.
Best Practices
Use descriptive filenames
Good examples:
LoginFailure_20260630.png
CheckoutPage.png
PaymentError.pngAvoid generic names like:
image1.png
test.pngCapture screenshots only when necessary
Excessive screenshots can increase storage usage.
Capture:
- Failures
- Important business checkpoints
- Critical workflows
Store artifacts in CI/CD pipelines
Screenshots and videos are especially useful in:
- Jenkins
- GitHub Actions
- Azure DevOps
- GitLab CI
Screenshot vs Video
| Feature | Screenshot | Video |
|---|---|---|
| Storage Usage | Low | High |
| Debugging Detail | Medium | High |
| Execution Impact | Minimal | Slight |
| Best Use Case | Failure Evidence | Complex Flow Analysis |
Conclusion
Screenshots and videos are essential tools for modern automation frameworks.
Playwright makes capturing these artifacts extremely simple through built-in APIs.
In this article, you learned:
- How to capture screenshots
- How to capture full-page screenshots
- How to capture element screenshots
- How to enable video recording
- Best practices for artifact management
These capabilities significantly improve debugging and make automation failures easier to analyze.
In the next article, we will explore how to handle alerts, confirmations, and browser popups in Playwright using Java.