基于headless Chrome的Jenkins UI测试视频录制方案咨询

Since you're already running headless Chrome for your Jenkins UI tests and want to add video recording without relying on XVFB, you’ve got two practical, Chrome-native approaches to implement this—either using the Chrome DevTools Protocol (CDP) directly or leveraging Java libraries that wrap CDP for smoother integration with your existing test setup. Let’s break them down:

1. Use Chrome DevTools Protocol (CDP) Directly #

Headless Chrome exposes CDP, which lets you control and capture the browser’s screen directly. The key here is using the Page.startScreencast command to capture frame data, then assembling those frames into a video file.

Step-by-Step Implementation (Java) #

First, launch headless Chrome with the CDP port enabled:

ChromeOptions options = new ChromeOptions();
options.addArguments("--headless=new");
options.addArguments("--remote-debugging-port=9222"); // Enable CDP port
WebDriver driver = new ChromeDriver(options);

Next, connect to the CDP session and start screencasting:

// Get DevTools session from Selenium 4+
DevTools devTools = ((ChromeDriver) driver).getDevTools();
devTools.createSession();

// Configure screencast settings (adjust frame rate, quality as needed)
devTools.send(Page.startScreencast(
    Optional.of("webp"),
    Optional.of(80), // Quality percentage
    Optional.of(10), // Frame rate (fps)
    Optional.empty(),
    Optional.empty()
));

// Capture frames and write to temporary files
devTools.addListener(Page.screencastFrame(), frame -> {
    // Base64 decode the frame data
    byte[] frameBytes = Base64.getDecoder().decode(frame.getData());
    // Write each frame to a numbered file (e.g., frame_001.webp)
    // Later, use FFmpeg to merge frames into an MP4:
    // ffmpeg -framerate 10 -i frame_%03d.webp -c:v libx264 test_video.mp4
});

// Run your UI test suite here...

// Clean up when tests finish
devTools.send(Page.stopScreencast());
driver.quit();

Jenkins-Specific Notes #

• Save the final video file to your Jenkins job’s workspace (e.g., target/test-videos/) so it’s accessible via the Jenkins UI post-test.
• Ensure FFmpeg is installed on your Jenkins agent to convert raw WebP frames into a standard, viewable format like MP4.

2. Use Java Libraries Wrapping CDP #

If you want to avoid low-level CDP boilerplate, use libraries that abstract this logic for you:

Selenium 4+ Built-in DevTools Support #

Selenium 4 has native CDP integration, so you can use the same DevTools API shown above without extra dependencies. It’s the most straightforward choice if you’re already using Selenium for your tests.

chrome-devtools-java-client #

This dedicated Java client for CDP provides a more structured API to handle screencasting with less manual setup:

ChromeDevToolsClient client = ChromeDevToolsClient.create("localhost", 9222);
PageClient pageClient = client.getPageClient();

// Start screencast with custom settings
pageClient.startScreencast(StartScreencastRequest.builder()
    .format("webp")
    .quality(80)
    .frameRate(10)
    .build());

// Listen for and process incoming frames
pageClient.addScreencastFrameListener(frame -> {
    // Handle frame data (write to files, etc.)
});

// Execute your tests...

// Cleanup
pageClient.stopScreencast();
client.close();

Key Advantages Over XVFB #

• No extra infrastructure: You don’t need to install or maintain XVFB on Jenkins agents—everything runs through Chrome’s native capabilities.
• Lightweight efficiency: CDP screencasting uses Chrome’s internal rendering pipeline, so it’s less resource-heavy than capturing a virtual display.
• Dynamic control: Adjust frame rate, quality, or even capture regions on-the-fly based on test requirements.

Important Considerations #

• Performance overhead: Video recording will add some CPU/memory load—test with your typical workload to ensure Jenkins agents can handle it.
• Failure cleanup: Always stop the screencast and close CDP sessions even if tests fail to avoid resource leaks.
• Video storage: Plan for disk space on Jenkins agents, as test videos can add up over time.

内容的提问来源于stack exchange，提问作者Homewrecker