Charon/.github/skills/test-frontend-coverage.SKILL.md

name, version, description, author, license, tags, compatibility, requirements, environment_variables, parameters, outputs, metadata

name	version	description	author	license	tags	compatibility	requirements	environment_variables	parameters	outputs	metadata
test-frontend-coverage	1.0.0	Run frontend tests with coverage analysis and threshold validation (minimum 85%)	Charon Project	MIT	testing coverage frontend vitest validation	os shells linux darwin bash	name version optional node >=18.0 false name version optional npm >=9.0 false name version optional python3 >=3.8 false	name description default required CHARON_MIN_COVERAGE Minimum coverage percentage required (overrides default) 85 false name description default required CPM_MIN_COVERAGE Alternative name for minimum coverage threshold (legacy) 85 false	name type description default required verbose boolean Enable verbose test output false false	name type description path coverage-summary.json file JSON coverage summary generated by Vitest frontend/coverage/coverage-summary.json name type description coverage_summary stdout Summary of coverage statistics and validation result	category subcategory execution_time risk_level ci_cd_safe requires_network idempotent test coverage medium low true false true

Test Frontend Coverage

Overview

Executes the frontend test suite using Vitest with coverage enabled, generates a JSON coverage summary, and validates that the total statements coverage meets or exceeds the configured threshold (default: 85%).

This skill is designed for continuous integration and pre-commit hooks to ensure code quality standards are maintained.

Prerequisites

• Node.js 18.0 or higher installed and in PATH
• npm 9.0 or higher installed and in PATH
• Python 3.8 or higher installed and in PATH
• Frontend dependencies installed (cd frontend && npm install)
• Write permissions in frontend/coverage/ directory

Usage

Basic Usage

Run with default settings (85% minimum coverage):

cd /path/to/charon
.github/skills/scripts/skill-runner.sh test-frontend-coverage

Custom Coverage Threshold

Set a custom minimum coverage percentage:

export CHARON_MIN_COVERAGE=90
.github/skills/scripts/skill-runner.sh test-frontend-coverage

CI/CD Integration

For use in GitHub Actions or other CI/CD pipelines:

- name: Run Frontend Tests with Coverage
  run: .github/skills/scripts/skill-runner.sh test-frontend-coverage
  env:
    CHARON_MIN_COVERAGE: 85

Parameters

Parameter	Type	Required	Default	Description
verbose	boolean	No	false	Enable verbose test output

Environment Variables

Variable	Required	Default	Description
CHARON_MIN_COVERAGE	No	85	Minimum coverage percentage required for success
CPM_MIN_COVERAGE	No	85	Legacy name for minimum coverage (fallback)

Outputs

Success Exit Code

• 0: All tests passed and coverage meets threshold

Error Exit Codes

• 1: Coverage below threshold or coverage file generation failed
• Non-zero: Tests failed or other error occurred

Output Files

• frontend/coverage/coverage-summary.json: Vitest coverage summary (JSON format)
• frontend/coverage/index.html: HTML coverage report (viewable in browser)

Console Output

Example output:

Computed frontend coverage: 87.5% (minimum required 85%)
Frontend coverage requirement met

Examples

Example 1: Basic Execution

.github/skills/scripts/skill-runner.sh test-frontend-coverage

Example 2: Higher Coverage Threshold

export CHARON_MIN_COVERAGE=90
.github/skills/scripts/skill-runner.sh test-frontend-coverage

Example 3: View HTML Coverage Report

.github/skills/scripts/skill-runner.sh test-frontend-coverage
open frontend/coverage/index.html  # macOS
xdg-open frontend/coverage/index.html  # Linux

Error Handling

Common Errors

Error: Coverage summary file not found

Solution: Check that Vitest is configured with --coverage and --reporter=json-summary

Error: Frontend coverage X% is below required Y%

Solution: Add tests for uncovered components or adjust threshold

Error: npm ci failed

Solution: Clear node_modules and package-lock.json, then reinstall dependencies

Related Skills

• test-frontend-unit - Fast unit tests without coverage
• test-backend-coverage - Backend Go coverage tests
• utility-cache-clear-go - Clear build caches

Notes

• Vitest Configuration: Uses istanbul coverage provider for JSON summary reports
• Coverage Directory: Coverage artifacts are written to frontend/coverage/
• Python Dependency: Uses Python for decimal-precision coverage comparison
• Idempotency: Safe to run multiple times; cleans up old coverage files
• CI Mode: Runs npm ci in CI environments to ensure clean installs

---

Last Updated: 2025-12-20 Maintained by: Charon Project Team Source: scripts/frontend-test-coverage.sh