cocos-preview-qa

Launch a headless browser to capture Cocos preview screenshots and compare them against reference images.

3|Updated Mar 6, 2026
One-click install
npx skills add https://github.com/eaglhuang/cocos_new --skill cocos-preview-qa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: cocos-preview-qa
Source: https://github.com/eaglhuang/cocos_new/tree/main/.agents/skills/cocos-preview-qa
Command: npx skills add https://github.com/eaglhuang/cocos_new --skill cocos-preview-qa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill automates browser-based QA for Cocos previews by launching a headless browser, opening a locally hosted Preview, switching preview targets, capturing screenshots, and establishing visual checks against reference images. It enables screen-driven QA workflows when a Browser Review environment is prepared and can run at http://localhost:7456.

Core Features & Use Cases

  • Automates opening the built-in browser/headless browser (puppeteer-core) to load a Cocos Preview from the local Browser Review environment.
  • Supports switching preview targets and capturing multiple screenshots for batch visual comparison.
  • Compares captured screenshots against reference QA images to verify visual quality and regression.
  • Use Case: When a Browser Review environment is ready, run automated visual QA on various targets to confirm UI correctness before release or integration.

Quick Start

Open the Browser Review environment at http://localhost:7456, switch to the desired preview target, capture screenshots, and compare them with the reference images.

Frequently Asked Questions about cocos-preview-qa

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate visual regression testing for Cocos previews?

Automate visual regression testing for Cocos previews by launching a headless browser, navigating to the local Preview at http://localhost:7456, capturing screenshots, and comparing them against reference QA images.

Can I switch between multiple preview targets during automated browser QA?

Yes, you can switch between multiple preview targets during automated browser QA. The tool supports navigating across different targets and capturing multiple screenshots for batch visual comparison against reference images.

Do I need a Browser Review environment to run Cocos visual checks?

Yes, you need a Browser Review environment ready and running at http://localhost:7456 to run Cocos visual checks. The tool loads the local Cocos Preview from this environment to capture screenshots for comparison.

What are the limitations of using puppeteer-core for Cocos preview QA?

Puppeteer-core for Cocos preview QA is limited to browser-based visual checks only. It should not be used for Editor window screenshots, compiler error analysis, or pure log analysis, as these are explicitly outside its scope.

How does screenshot comparison work for validating Cocos UI rendering?

Screenshot comparison for validating Cocos UI rendering works by capturing screenshots from a headless browser loading the local Preview, then comparing those captured images against reference QA images to detect visual regressions.

When should I not use browser-based QA for Cocos previews?

You should not use browser-based QA for Cocos previews when you need Editor window screenshots, compiler error detection, or pure log analysis. The tool is scoped strictly to rendered UI validation in a browser environment.