upgrade ci

.github/workflows/chromatic.yml

@@ -0,0 +1,31 @@
+# .github/workflows/chromatic.yml
+
+# Workflow name
+name: "Chromatic Publish"
+
+# Event for the workflow
+on: push
+
+# List of jobs
+jobs:
+  test:
+    name: Publish Storybook to Chromatic
+    # Operating System
+    runs-on: ubuntu-latest
+    # Job steps
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: "npm"
+      - run: npm ci
+      #👇 Adds Chromatic as a step in the workflow
+      - uses: chromaui/action@v1
+        # Options required for Chromatic's GitHub Action
+        with:
+          #👇 Chromatic projectToken,
+          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}

.github/workflows/node.js.yml

@@ -1,31 +1,32 @@
 # This workflow will do a clean installation of node dependencies, cache/restore them, build the source code and run tests across different versions of node
-# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
-
-name: Build & Test
+# For more information see: https://docs.github.com/en/actions/automating-builds-and-tests/building-and-testing-nodejs
 
 on:
   push:
-    branches: [master]
+    branches: [ "main" ]
   pull_request:
-    branches: [master]
+    branches: [ "main" ]
 
 jobs:
   build:
+    name: Run Jest Tests
+
     runs-on: ubuntu-latest
 
     strategy:
+      fail-fast: false
+      max-parallel: 2
       matrix:
-        node-version: ["18.x", "20.x", "21.x", "22.x"]
+        node-version: [18.x, 20.x, 21.x, 22.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
-      - uses: actions/checkout@v4
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v4
-        with:
-          node-version: ${{ matrix.node-version }}
-          cache: "npm"
-      - name: Install Dependencies
-        run: npm ci
-      - name: Run Tests
-        run: npm test
+    - uses: actions/checkout@v4
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v3
+      with:
+        node-version: ${{ matrix.node-version }}
+        cache: 'npm'
+    - run: npm ci
+    - run: npm run build --if-present
+    - run: npm test

package.json

@@ -40,6 +40,7 @@
     "@testing-library/jest-dom": "^6.4.8",
     "@testing-library/react": "^16.0.0",
     "@types/jest": "^29.5.12",
+    "@types/react-test-renderer": "^18.3.0",
     "chromatic": "^11.5.6",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",

test/src/Hexagon.test.tsx

@@ -2,8 +2,8 @@ import React from "react"
 import renderer from "react-test-renderer"
 import { render, fireEvent } from "@testing-library/react"
 
-import { Layout } from "../../../src/Layout"
-import { Hexagon } from "../../../src/Hexagon/Hexagon"
+import { Layout } from "../../src/Layout"
+import { Hexagon } from "../../src/Hexagon/Hexagon"
 
 test("Hexagon should render correctly with default props", () => {
   const tree = renderer