feat: ✨ upload badges to github pages

Author: cif

ACTION_README.md

@@ -10,6 +10,7 @@ A GitHub Action that automatically creates beautiful coverage reports in pull re
 - 🔄 **Smart Updates**: Updates existing comments instead of creating duplicates
 - 🎨 **Visual Indicators**: Uses emojis to quickly identify coverage status
 - 🏷️ **Coverage Badges**: Generates shields.io compatible badges for GitHub Pages
+- 🚀 **Automatic GitHub Pages Upload**: Automatically uploads badges to GitHub Pages
 - ⚡ **Lightweight**: Fast execution with minimal dependencies
 
 ## Usage
@@ -56,6 +57,7 @@ on:
 
 permissions:
   pull-requests: write
+  contents: write # Required for GitHub Pages upload
 
 jobs:
   coverage:
@@ -82,18 +84,24 @@ jobs:
           show-files: "true"
           coverage-threshold: "90"
           make-badges: "true"
+          upload-badges-to-pages: "true"
+          pages-branch: "gh-pages"
+          pages-badges-dir: "badges"
 ```
 
 ## Inputs
 
-| Input                | Description                                               | Required | Default                          |
-| -------------------- | --------------------------------------------------------- | -------- | -------------------------------- |
-| `coverage-file`      | Path to the coverage summary JSON file                    | No       | `coverage/coverage-summary.json` |
-| `token`              | GitHub token for creating comments                        | No       | `${{ github.token }}`            |
-| `title`              | Title for the coverage report comment                     | No       | `📊 Coverage Report`             |
-| `show-files`         | Whether to show individual file coverage details          | No       | `true`                           |
-| `coverage-threshold` | Minimum coverage percentage to consider as good (0-100)   | No       | `80`                             |
-| `make-badges`        | Whether to generate coverage badges in a badges directory | No       | `true`                           |
+| Input                    | Description                                               | Required | Default                          |
+| ------------------------ | --------------------------------------------------------- | -------- | -------------------------------- |
+| `coverage-file`          | Path to the coverage summary JSON file                    | No       | `coverage/coverage-summary.json` |
+| `token`                  | GitHub token for creating comments                        | No       | `${{ github.token }}`            |
+| `title`                  | Title for the coverage report comment                     | No       | `📊 Coverage Report`             |
+| `show-files`             | Whether to show individual file coverage details          | No       | `true`                           |
+| `coverage-threshold`     | Minimum coverage percentage to consider as good (0-100)   | No       | `80`                             |
+| `make-badges`            | Whether to generate coverage badges in a badges directory | No       | `true`                           |
+| `upload-badges-to-pages` | Whether to automatically upload badges to GitHub Pages    | No       | `true`                           |
+| `pages-branch`           | Branch to upload badges to for GitHub Pages               | No       | `gh-pages`                       |
+| `pages-badges-dir`       | Directory within the pages branch to store badges         | No       | `badges`                         |
 
 ## Coverage File Format
 
@@ -208,26 +216,44 @@ When `make-badges` is enabled (default: `true`), the action creates a `badges` d
 
 ### Using Badges with GitHub Pages
 
-1. Enable GitHub Pages in your repository settings
-2. Set the source to "Deploy from a branch" and select your main branch
-3. The badges will be available at:
+The action automatically uploads badges to your GitHub Pages branch when `upload-badges-to-pages` is enabled (default: `true`).
+
+1. **Automatic Setup**: The action will:
+
+   - Create the `gh-pages` branch if it doesn't exist
+   - Upload badges to the specified directory
+   - Commit and push changes automatically
+
+2. **Enable GitHub Pages** in your repository settings:
+
+   - Go to Settings → Pages
+   - Set source to "Deploy from a branch"
+   - Select your `gh-pages` branch (or the branch specified in `pages-branch`)
+   - Set folder to `/ (root)` or `/badges` depending on your preference
+
+3. **Badge URLs** will be available at:
 
    ```
    https://yourusername.github.io/yourrepo/badges/coverage.json
+   https://yourusername.github.io/yourrepo/badges/statements.json
+   https://yourusername.github.io/yourrepo/badges/branches.json
+   https://yourusername.github.io/yourrepo/badges/functions.json
+   https://yourusername.github.io/yourrepo/badges/lines.json
    ```
 
-4. Use in your README.md:
+4. **Use in your README.md**:
    ```markdown
    ![Coverage](https://yourusername.github.io/yourrepo/badges/coverage.json)
+   ![Statements](https://yourusername.github.io/yourrepo/badges/statements.json)
+   ![Branches](https://yourusername.github.io/yourrepo/badges/branches.json)
    ```
 
-### Example Badge JSON
+### Required Permissions
 
-```json
-{
-  "schemaVersion": 1,
-  "label": "coverage",
-  "message": "89.8%",
-  "color": "green"
-}
+For automatic GitHub Pages upload, your workflow needs:
+
+```yaml
+permissions:
+  pull-requests: write
+  contents: write # Required for uploading to GitHub Pages
 ```

README.md

@@ -11,6 +11,7 @@ A plugin for [Vitest](https://vitest.dev/) that generates a structured JSON cove
 - ✅ Compatible with Vitest 3.0+
 - 🚀 **NEW**: GitHub Action for automatic PR coverage reporting
 - 🏷️ **NEW**: Automatic coverage badge generation for GitHub Pages
+- 🚀 **NEW**: Automatic upload of badges to GitHub Pages
 
 ## Installation
 
@@ -20,7 +21,7 @@ npm install --save-dev vitest-v8-json-coverage-summary
 
 ## GitHub Action
 
-This package also includes a GitHub Action that automatically creates beautiful coverage reports in pull requests.
+This package also includes a GitHub Action that automatically creates beautiful coverage reports in pull requests and uploads coverage badges to GitHub Pages.
 
 ### Quick Start
 
@@ -32,6 +33,7 @@ on:
 
 permissions:
   pull-requests: write
+  contents: write # Required for GitHub Pages upload
 
 jobs:
   coverage:
@@ -44,8 +46,17 @@ jobs:
       - run: npm ci
       - run: npm test
       - uses: glideapps/vitest-v8-json-coverage-summary@v1
+        with:
+          make-badges: "true"
+          upload-badges-to-pages: "true"
 ```
 
+The action will automatically:
+
+- Create coverage reports in pull request comments
+- Generate coverage badges
+- Upload badges to the `gh-pages` branch for GitHub Pages
+
 For detailed documentation, see [ACTION_README.md](ACTION_README.md).
 
 ## Usage

action.yml

@@ -30,6 +30,18 @@ inputs:
     description: "Whether to generate coverage badges in a badges directory"
     required: false
     default: "true"
+  upload-badges-to-pages:
+    description: "Whether to automatically upload badges to GitHub Pages branch"
+    required: false
+    default: "true"
+  pages-branch:
+    description: "Branch to upload badges to for GitHub Pages"
+    required: false
+    default: "gh-pages"
+  pages-badges-dir:
+    description: "Directory within the pages branch to store badges"
+    required: false
+    default: "badges"
 
 runs:
   using: "node20"

example-workflow-with-badges.yml

@@ -1,12 +1,12 @@
-name: Coverage Report with Badges
+name: Coverage Report with Automatic Badge Upload
 
 on:
   pull_request:
     branches: [main, develop]
 
 permissions:
-  contents: read
   pull-requests: write
+  contents: write # Required for GitHub Pages upload
 
 jobs:
   test-and-coverage:
@@ -27,38 +27,14 @@ jobs:
       - name: Run tests with coverage
         run: npm test
 
-      - name: Report Coverage
+      - name: Report Coverage and Upload Badges
         uses: glideapps/vitest-v8-json-coverage-summary@v1
         with:
           coverage-file: "coverage/coverage-summary.json"
           title: "🧪 Test Coverage Report"
           show-files: "true"
           coverage-threshold: "80"
           make-badges: "true"
-
-      - name: Commit badges (if on main branch)
-        if: github.ref == 'refs/heads/main'
-        run: |
-          git config --local user.email "[email protected]"
-          git config --local user.name "GitHub Action"
-          git add badges/
-          git diff --quiet && git diff --staged --quiet || git commit -m "Update coverage badges"
-          git push
-
-  # Optional: Deploy badges to GitHub Pages
-  deploy-badges:
-    if: github.ref == 'refs/heads/main'
-    needs: test-and-coverage
-    runs-on: ubuntu-latest
-    permissions:
-      contents: write
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - name: Deploy to GitHub Pages
-        uses: peaceiris/actions-gh-pages@v3
-        with:
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          publish_dir: ./badges
-          destination_dir: badges
+          upload-badges-to-pages: "true"
+          pages-branch: "gh-pages"
+          pages-badges-dir: "badges"

example-workflow.yml

@@ -5,8 +5,8 @@ on:
     branches: [main, develop]
 
 permissions:
-  contents: read
   pull-requests: write
+  contents: write # Required for GitHub Pages upload
 
 jobs:
   test-and-coverage:
@@ -35,3 +35,4 @@ jobs:
           show-files: "true"
           coverage-threshold: "80"
           make-badges: "true"
+          upload-badges-to-pages: "true"