Skip to content

Commit 79e8508

Browse files
cifcif
committed
feat: ✨ create published and releasable action
1 parent b8eba41 commit 79e8508

File tree

10 files changed

+794
-5
lines changed

10 files changed

+794
-5
lines changed

‎.github/workflows/release.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
name: Publish to NPM on Release
1+
name: Publish Package on Tag
22

33
on:
44
push:

‎.github/workflows/test-action.yml

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
name: Test Coverage Action
2+
3+
on:
4+
pull_request:
5+
branches: [main]
6+
7+
permissions:
8+
contents: read
9+
pull-requests: write
10+
11+
jobs:
12+
test-coverage:
13+
runs-on: ubuntu-latest
14+
steps:
15+
- uses: actions/checkout@v4
16+
17+
- name: Setup Node.js
18+
uses: actions/setup-node@v4
19+
with:
20+
node-version: "20"
21+
22+
- name: Install dependencies
23+
run: npm ci
24+
25+
- name: Run tests with coverage
26+
run: npm test
27+
28+
- name: Report Coverage
29+
uses: ./
30+
with:
31+
coverage-file: "coverage/coverage-summary.json"
32+
title: "🧪 Test Coverage Report"
33+
show-files: "true"
34+
coverage-threshold: "80"

‎.npmignore

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,9 @@ package-lock.json
3131
Thumbs.db
3232

3333
# Test files in dist
34-
dist/*.test.*
34+
dist/*.test.*
35+
36+
# GitHub Action files (keep these)
37+
# action.yml
38+
# dist/action.js
39+
# dist/action.d.ts

‎ACTION_README.md

Lines changed: 184 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,184 @@
1+
# Vitest Coverage Reporter GitHub Action
2+
3+
A GitHub Action that automatically creates beautiful coverage reports in pull requests using vitest coverage data.
4+
5+
## Features
6+
7+
- 📊 **Beautiful Coverage Reports**: Creates formatted markdown tables with coverage metrics
8+
- 🎯 **Configurable Thresholds**: Set minimum coverage requirements with visual indicators
9+
- 📁 **File-level Details**: Option to show individual file coverage breakdowns
10+
- 🔄 **Smart Updates**: Updates existing comments instead of creating duplicates
11+
- 🎨 **Visual Indicators**: Uses emojis to quickly identify coverage status
12+
- ⚡ **Lightweight**: Fast execution with minimal dependencies
13+
14+
## Usage
15+
16+
### Basic Usage
17+
18+
```yaml
19+
name: Coverage Report
20+
on:
21+
pull_request:
22+
branches: [main]
23+
24+
permissions:
25+
pull-requests: write
26+
27+
jobs:
28+
coverage:
29+
runs-on: ubuntu-latest
30+
steps:
31+
- uses: actions/checkout@v4
32+
33+
- name: Setup Node.js
34+
uses: actions/setup-node@v4
35+
with:
36+
node-version: "20"
37+
38+
- name: Install dependencies
39+
run: npm ci
40+
41+
- name: Run tests with coverage
42+
run: npm test
43+
44+
- name: Report Coverage
45+
uses: glideapps/vitest-coverage-tools@v1
46+
```
47+
48+
### Advanced Usage
49+
50+
```yaml
51+
name: Coverage Report
52+
on:
53+
pull_request:
54+
branches: [main]
55+
56+
permissions:
57+
pull-requests: write
58+
59+
jobs:
60+
coverage:
61+
runs-on: ubuntu-latest
62+
steps:
63+
- uses: actions/checkout@v4
64+
65+
- name: Setup Node.js
66+
uses: actions/setup-node@v4
67+
with:
68+
node-version: "20"
69+
70+
- name: Install dependencies
71+
run: npm ci
72+
73+
- name: Run tests with coverage
74+
run: npm test
75+
76+
- name: Report Coverage
77+
uses: glideapps/vitest-coverage-tools@v1
78+
with:
79+
coverage-file: "coverage/coverage-summary.json"
80+
title: "🧪 Test Coverage Report"
81+
show-files: "true"
82+
coverage-threshold: "90"
83+
```
84+
85+
## Inputs
86+
87+
| Input | Description | Required | Default |
88+
| -------------------- | ------------------------------------------------------- | -------- | -------------------------------- |
89+
| `coverage-file` | Path to the coverage summary JSON file | No | `coverage/coverage-summary.json` |
90+
| `token` | GitHub token for creating comments | No | `${{ github.token }}` |
91+
| `title` | Title for the coverage report comment | No | `📊 Coverage Report` |
92+
| `show-files` | Whether to show individual file coverage details | No | `true` |
93+
| `coverage-threshold` | Minimum coverage percentage to consider as good (0-100) | No | `80` |
94+
95+
## Coverage File Format
96+
97+
The action expects a JSON file with the following structure (generated by the vitest-v8-json-coverage-summary reporter):
98+
99+
```json
100+
{
101+
"summary": {
102+
"statements": 89.82,
103+
"branches": 94.29,
104+
"functions": 58.82,
105+
"lines": 89.82
106+
},
107+
"files": [
108+
{
109+
"file": "src/example.ts",
110+
"statements": 90.84,
111+
"branches": 91.89,
112+
"functions": 25,
113+
"lines": 90.84,
114+
"uncoveredLines": [39, 40, 45]
115+
}
116+
]
117+
}
118+
```
119+
120+
## Example Output
121+
122+
The action creates a comment like this:
123+
124+
```markdown
125+
## 📊 Coverage Report
126+
127+
### 📈 Coverage Summary
128+
129+
| Metric | Coverage | Status |
130+
| -------------- | -------- | ------ |
131+
| **Statements** | 89.8% | 🟢 |
132+
| **Branches** | 94.3% | 🟢 |
133+
| **Functions** | 58.8% | 🔴 |
134+
| **Lines** | 89.8% | 🟢 |
135+
136+
**Overall Coverage: 83.2% 🟡**
137+
138+
### 📁 File Details
139+
140+
| File | Statements | Branches | Functions | Lines |
141+
| ---------------- | ---------- | -------- | --------- | ----- |
142+
| `src/example.ts` | 90.8% | 91.9% | 25.0% | 90.8% |
143+
144+
---
145+
146+
_Generated by [@glideapps/vitest-coverage-tools](https://github.com/glideapps/vitest-coverage-tools)_
147+
```
148+
149+
## Status Indicators
150+
151+
- 🟢 **Green**: Coverage meets or exceeds the threshold
152+
- 🟡 **Yellow**: Coverage is at least 80% of the threshold
153+
- 🔴 **Red**: Coverage is below 80% of the threshold
154+
155+
## Setup with Vitest
156+
157+
1. Install the coverage reporter:
158+
159+
```bash
160+
npm install vitest-v8-json-coverage-summary
161+
```
162+
163+
2. Configure vitest to use the reporter:
164+
165+
```javascript
166+
// vitest.config.js
167+
export default {
168+
coverage: {
169+
provider: "v8",
170+
reporter: ["text", "json-summary"],
171+
reportsDirectory: "./coverage",
172+
},
173+
};
174+
```
175+
176+
3. Add the GitHub Action to your workflow as shown above.
177+
178+
## Contributing
179+
180+
Contributions are welcome! Please feel free to submit a Pull Request.
181+
182+
## License
183+
184+
MIT License - see the [LICENSE](LICENSE) file for details.

‎README.md

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,44 @@ A plugin for [Vitest](https://vitest.dev/) that generates a structured JSON cove
99
- ✅ Includes file-level and overall coverage statistics
1010
- ✅ Tracks uncovered lines for detailed analysis
1111
- ✅ Compatible with Vitest 3.0+
12+
- 🚀 **NEW**: GitHub Action for automatic PR coverage reporting
1213

1314
## Installation
1415

1516
```bash
1617
npm install --save-dev vitest-v8-json-coverage-summary
1718
```
1819

20+
## GitHub Action
21+
22+
This package also includes a GitHub Action that automatically creates beautiful coverage reports in pull requests.
23+
24+
### Quick Start
25+
26+
```yaml
27+
name: Coverage Report
28+
on:
29+
pull_request:
30+
branches: [main]
31+
32+
permissions:
33+
pull-requests: write
34+
35+
jobs:
36+
coverage:
37+
runs-on: ubuntu-latest
38+
steps:
39+
- uses: actions/checkout@v4
40+
- uses: actions/setup-node@v4
41+
with:
42+
node-version: "20"
43+
- run: npm ci
44+
- run: npm test
45+
- uses: glideapps/vitest-coverage-tools@v1
46+
```
47+
48+
For detailed documentation, see [ACTION_README.md](ACTION_README.md).
49+
1950
## Usage
2051
2152
### Basic Setup

‎action.yml

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
name: "Vitest Coverage Reporter"
2+
description: "Creates a coverage report comment in pull requests using vitest coverage data"
3+
author: "Glide Apps"
4+
branding:
5+
icon: "bar-chart"
6+
color: "blue"
7+
8+
inputs:
9+
coverage-file:
10+
description: "Path to the coverage summary JSON file"
11+
required: false
12+
default: "coverage/coverage-summary.json"
13+
token:
14+
description: "GitHub token for creating comments"
15+
required: false
16+
default: "${{ github.token }}"
17+
title:
18+
description: "Title for the coverage report comment"
19+
required: false
20+
default: "📊 Coverage Report"
21+
show-files:
22+
description: "Whether to show individual file coverage details"
23+
required: false
24+
default: "true"
25+
coverage-threshold:
26+
description: "Minimum coverage percentage to consider as good (0-100)"
27+
required: false
28+
default: "80"
29+
30+
runs:
31+
using: "node20"
32+
main: "dist/action.js"

‎example-workflow.yml

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
name: Coverage Report
2+
3+
on:
4+
pull_request:
5+
branches: [main, develop]
6+
7+
permissions:
8+
contents: read
9+
pull-requests: write
10+
11+
jobs:
12+
test-and-coverage:
13+
runs-on: ubuntu-latest
14+
steps:
15+
- name: Checkout code
16+
uses: actions/checkout@v4
17+
18+
- name: Setup Node.js
19+
uses: actions/setup-node@v4
20+
with:
21+
node-version: "20"
22+
cache: "npm"
23+
24+
- name: Install dependencies
25+
run: npm ci
26+
27+
- name: Run tests with coverage
28+
run: npm test
29+
30+
- name: Report Coverage
31+
uses: glideapps/vitest-coverage-tools@v1
32+
with:
33+
coverage-file: "coverage/coverage-summary.json"
34+
title: "🧪 Test Coverage Report"
35+
show-files: "true"
36+
coverage-threshold: "80"

0 commit comments

Comments
 (0)