ctrf-html-reporter

Report test result of CTRF (Common Test Report Format) as HTML.


About

ctrf-html-reporter is a tool that converts test reports in CTRF (Common Test Report Format) format into beautiful HTML reports. It uses VitePress to generate interactive and easy-to-read test reports.

!Image

see movie: https://github.com/user-attachments/assets/89b4976d-c8a2-499d-92aa-cb515e11a581

Features

- Convert CTRF format test reports to HTML
- Beautiful and readable report UI
- Visualization and insights of test results
- Simple command-line interface

Usage

$3

You can also run it directly without installation:

``bash
npx ctrf-html-reporter path/to/report.ctrf.json
`

$3

Generate an HTML report from a CTRF report file:

`bash
ctrf-html-reporter path/to/report.ctrf.json
`

By default, the report is generated in the .ctrf/report directory.

$3

To specify the output destination:

`bash
ctrf-html-reporter path/to/report.ctrf.json --output-path ./html-report
`

Installation

Choose your package manager to install:

npm

`bash
npm install ctrf-html-reporter
`


yarn

`bash
yarn add ctrf-html-reporter
`


pnpm

`bash
pnpm add ctrf-html-reporter
`


Report Features

The generated HTML report provides multiple views to help you analyze your test results:

$3

The Overview page displays a comprehensive summary of your test results. Here you can see:
- Tool Information
- Test Environment
- Overall test statistics (passed, failed, skipped)
- Test execution summary

$3

The Suites view organizes test results by suite with powerful analysis features:
- Filter tests by status, tags, and flaky tests to find what matters
- Visualize suite performance with interactive charts to identify bottlenecks
- Navigate hierarchical test structure and view detailed test information
- Analyze problem areas with failure and flaky test correlation charts

$3

The Insights view provides comparison with previous test results and baseline. This feature helps you:
- Compare current results against previous and baseline reports
- Easily identify changes in overall report metrics
- Track test case status changes (new failures, fixed tests, etc.)
- Understand test result trends over time
- Sort and filter tests by metrics or changes to focus on problem areas

To enable insights comparison, specify previous reports. The baseline report is identified from the previous reports by its start time:

`bash


Compare with previous reports (can be a file, glob pattern, or directory)

ctrf-html-reporter path/to/report.ctrf.json --previous-report-path path/to/previous.ctrf.json

Compare with multiple previous reports using glob pattern

ctrf-html-reporter path/to/report.ctrf.json --previous-report-path "reports/*.ctrf.json"

Specify which report to use as baseline (identified by start time)

ctrf-html-reporter path/to/report.ctrf.json \
--previous-report-path path/to/reports/ \
--baseline-report-path path/to/baseline.ctrf.json
`

Note: The baseline report must be included in the previous reports. When specified, it is identified by matching the start time (value of { results.summary.start }) of the test execution.

$3

The Timeline view displays test execution in chronological order. This visualization helps you:
- See start and stop times for each test case
- Identify long-running tests at a glance
- Understand test execution patterns
- Optimize test execution time by finding bottlenecks

$3

The AI Insights view displays AI-powered analysis of your test results. This feature helps you:
- Get AI-generated insights about overall test results
- View AI analysis for failed tests to quickly understand root causes
- Access intelligent suggestions for fixing test failures

To enable AI insights, use ai-ctrf to add AI analysis to your CTRF report before generating the HTML report.

Command Line Options

| Option | Alias | Description | Default |
|--------|-------|-------------|---------|
| | - | Path to the CTRF report file (required) | - |
| --output-path | -o | Output directory for the HTML report | .ctrf/report |
| --previous-report-path | -p | Path to previous CTRF report file(s) or directory for comparison | - |
| --baseline-report-path | -b | Path to the baseline CTRF report file (must be included in previous reports, identified by start time) | - |
| --version | -V | Output the version number | - |
| --help | -h` | Display help information | - |

Requirements

- Node.js >= 20.19.0

License

MIT License - see the LICENSE file for details

Acknowledgments

This project uses VitePress and CTRF.

---

If you have any problems or questions, please feel free to create an Issue!