chore: add new workfow

Author: timeowilliams

.github/workflows/package-size-test.yml

@@ -31,7 +31,7 @@ jobs:
         run: ls -R build/static/js/
 
       - name: Run Package Size Badge Action
-        uses: ./ # This will use the local action in the current repo
+        uses: ./
         with:
           path: "build/static/js/*.js"
           preset: "app"

.github/workflows/test.yml

@@ -1,12 +1,13 @@
-name: "Run Size Limit Test"
+name: "Package Size Badge"
 
 on:
   push:
     branches:
       - main
+  pull_request:
 
 jobs:
-  run-size-limit:
+  build:
     runs-on: ubuntu-latest
 
     steps:
@@ -18,16 +19,28 @@ jobs:
         with:
           node-version: "20"
 
-      - name: Clean npm cache
-        run: npm cache clean --force
-
       - name: Install dependencies
         run: npm ci
 
-      - name: List files in build directory
-        run: ls -R build/static/js/
-
-      - name: Run size-limit
-        run: npx size-limit --json || node size-limit.js
-
-    timeout-minutes: 10
+      - name: Run size-limit to calculate bundle size
+        id: size-limit # We capture the size-limit output here
+        run: |
+          npx size-limit --json > size-report.json
+          size=$(cat size-report.json | jq '.[0].size' | xargs -I {} echo "{}/1024" | bc)
+          echo "size=${size}" >> $GITHUB_ENV
+        # jq is used to extract the size from the JSON report
+        # The size is divided by 1024 to convert bytes to KB and stored in the environment variable
+
+      - name: Generate badge URL
+        id: generate-badge
+        run: |
+          size=${{ env.size }}
+          echo "Badge URL: https://img.shields.io/badge/Bundle_Size-${size}KB-green"
+          echo "badge-url=https://img.shields.io/badge/Bundle_Size-${size}KB-green" >> $GITHUB_ENV
+          echo "Badge URL: https://img.shields.io/badge/Bundle_Size-${size}KB-green" > badge-url.txt
+
+      - name: Upload badge URL artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: bundle-size-badge
+          path: badge-url.txt

size-limit.js

@@ -1,6 +1,6 @@
 import { execSync } from "child_process";
 import fs from "fs";
-import core from "@actions/core";
+import * as core from "@actions/core";
 
 (async function run() {
   try {
@@ -12,18 +12,18 @@ import core from "@actions/core";
 
     // Step 2: Ensure size-limit config is written to package.json
     const packageJsonPath = "./package.json";
-    const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf8"));
+    // const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, "utf8"));
 
-    // Update size-limit config if it doesn't exist
-    packageJson["size-limit"] = [
-      {
-        path: path,
-        limit: limit,
-      },
-    ];
+    // // Update size-limit config if it doesn't exist
+    // packageJson["size-limit"] = [
+    //   {
+    //     path: path,
+    //     limit: limit,
+    //   },
+    // ];
 
-    // Write updated config to package.json
-    fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
+    // // Write updated config to package.json
+    // fs.writeFileSync(packageJsonPath, JSON.stringify(packageJson, null, 2));
     console.log("Updated size-limit config in package.json");
 
     // Step 3: Run size-limit to generate the report

size-report.json

@@ -4,7 +4,7 @@
     "passed": true,
     "size": 88048,
     "sizeLimit": 500000,
-    "running": 2.1483,
+    "running": 2.1714,
     "loading": 1.7196875
   }
 ]