From fa3fddb0edd38251524e9b4606c74f013f91f500 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Sun, 18 Aug 2024 00:23:19 +0800
Subject: [PATCH] test: use bun in github action (#50466)

---
 .github/workflows/mock-project-build.yml      |   6 +-
 .github/workflows/pkg.pr.new.yml              |  12 +-
 .github/workflows/preview-build.yml           |  90 +------
 .github/workflows/site-deploy.yml             |  55 +---
 .github/workflows/test.yml                    | 249 +++---------------
 .github/workflows/upgrade-deps.yml            |   8 +-
 .../visual-regression-diff-build.yml          |  81 +-----
 .../visual-regression-diff-finish.yml         |   6 +-
 .../visual-regression-persist-start.yml       |  57 +---
 docs/blog/github-actions-workflow.en-US.md    |   4 +-
 docs/blog/github-actions-workflow.zh-CN.md    |   2 +-
 package.json                                  |   3 +-
 12 files changed, 80 insertions(+), 493 deletions(-)

diff --git a/.github/workflows/mock-project-build.yml b/.github/workflows/mock-project-build.yml
index 8118640832..f5e3f4f0b0 100644
--- a/.github/workflows/mock-project-build.yml
+++ b/.github/workflows/mock-project-build.yml
@@ -20,9 +20,7 @@ jobs:
       - name: checkout
         uses: actions/checkout@v4
 
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
+      - uses: oven-sh/setup-bun@v2
 
       - uses: actions/cache@v4
         with:
@@ -54,7 +52,7 @@ jobs:
 
       - name: 🎨 Diff Report
         if: ${{ failure() }}
-        run: npx diff-yarn-lock --source=~tmpProj/yarn.lock --target=~tmpProj/yarn.lock.failed
+        run: bunx diff-yarn-lock --source=~tmpProj/yarn.lock --target=~tmpProj/yarn.lock.failed
 
       - uses: actions-cool/ci-notice@v1
         if: ${{ failure() }}
diff --git a/.github/workflows/pkg.pr.new.yml b/.github/workflows/pkg.pr.new.yml
index fc5f61d1fd..5a0a87ec04 100644
--- a/.github/workflows/pkg.pr.new.yml
+++ b/.github/workflows/pkg.pr.new.yml
@@ -10,15 +10,13 @@ jobs:
         uses: actions/checkout@v4
 
       - run: corepack enable
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
+      - uses: oven-sh/setup-bun@v2
 
       - name: Install dependencies
-        run: npm install
+        run: bun install
 
       - name: Build
-        run: npm run build
+        run: bun run build
 
       # ========== Prepare examples ==========
       - name: Clear examples
@@ -31,6 +29,6 @@ jobs:
           path: examples
 
       - name: Modify examples
-        run: npx tsx scripts/prepare-examples.ts
+        run: bunx tsx scripts/prepare-examples.ts
 
-      - run: npx pkg-pr-new publish --template './examples/examples/*'
+      - run: bunx pkg-pr-new publish --template './examples/examples/*'
diff --git a/.github/workflows/preview-build.yml b/.github/workflows/preview-build.yml
index 671b19a407..719092d37f 100644
--- a/.github/workflows/preview-build.yml
+++ b/.github/workflows/preview-build.yml
@@ -15,73 +15,26 @@ permissions:
   contents: read
 
 jobs:
-  # Prepare node modules. Reuse cache if available
-  setup:
-    name: prepare preview
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: cache package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: create package-lock.json
-        run: npm i --package-lock-only --ignore-scripts
-
-      - name: hack for single file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
   build-site:
     name: build preview
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: npm run site
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
+      - name: bun run site
         id: site
-        run: npm run site
+        run: bun run site
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
-
+      - name: run e2e test
+        run: bun run test:site
       - name: upload site artifact
         uses: actions/upload-artifact@v4
         with:
           name: site
           path: _site/
           retention-days: 5
-
       # Upload PR id for next workflow use
       - name: Save PR number
         if: ${{ always() }}
@@ -93,32 +46,3 @@ jobs:
         with:
           name: pr
           path: ./pr-id.txt
-
-  site-test:
-    name: site E2E test
-    runs-on: ubuntu-latest
-    needs: [setup, build-site]
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: download site artifact
-        uses: actions/download-artifact@v4
-        with:
-          name: site
-          path: _site
-
-      - name: run e2e test
-        run: npm run test:site
diff --git a/.github/workflows/site-deploy.yml b/.github/workflows/site-deploy.yml
index 5e69e82222..14361a928f 100644
--- a/.github/workflows/site-deploy.yml
+++ b/.github/workflows/site-deploy.yml
@@ -11,69 +11,24 @@ permissions:
   contents: write
 
 jobs:
-  setup:
+  build-and-deploy:
     runs-on: ubuntu-latest
     if: (startsWith(github.ref, 'refs/tags/') && (contains(github.ref_name, '-') == false)) || github.event_name == 'workflow_dispatch'
     steps:
       - name: checkout
         uses: actions/checkout@v4
 
-      - name: cache package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
+      - uses: oven-sh/setup-bun@v2
 
-      - name: create package-lock.json
-        run: npm i --package-lock-only --ignore-scripts
-
-      - name: hack for single file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
-  build-and-deploy:
-    runs-on: ubuntu-latest
-    needs: setup
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+      - run: bun install
 
       - name: build site
-        run: npm run predeploy
+        run: bun run predeploy
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
 
       - name: build dist and bundle analyzer report
-        run: npm run dist
+        run: bun run dist
         env:
           ANALYZER: 1
           NODE_OPTIONS: "--max_old_space_size=4096"
diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
index 39a0e7fb0d..2230a51895 100644
--- a/.github/workflows/test.yml
+++ b/.github/workflows/test.yml
@@ -13,67 +13,13 @@ permissions:
   contents: read
 
 jobs:
-  setup:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: cache package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: create package-lock.json
-        run: npm i --package-lock-only --ignore-scripts
-
-      - name: hack for single file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
   lint:
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: lint
-        run: npm run lint
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
+      - run: bun run lint
 
   ################################ Test ################################
   test-react-legacy:
@@ -85,68 +31,28 @@ jobs:
     env:
       REACT: ${{ matrix.react }}
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
       - name: install react 16
         if: ${{ matrix.react == '16' }}
-        run: npm run install-react-16
-
+        run: bun run bun-install-react-16
       - name: install react 17
         if: ${{ matrix.react == '17' }}
-        run: npm run install-react-17
-
+        run: bun run bun-install-react-17
       # dom test
       - name: dom test
-        run: npm test -- --maxWorkers=2 --shard=${{matrix.shard}} --coverage
+        run: bun run test -- --maxWorkers=2 --shard=${{matrix.shard}} --coverage
 
   test-node:
     name: test-node
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install react 18
-        run: npm run install-react-18
-
-      - name: node test
-        run: npm run test:node
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
+      - run: bun run test:node
 
   test-react-latest:
     name: test-react-latest
@@ -155,33 +61,14 @@ jobs:
         module: ['dom']
         shard: ['1/2', '2/2']
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install react 18
-        run: npm run install-react-18
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       # dom test
       - name: dom test
-        run: npm test -- --maxWorkers=2 --shard=${{matrix.shard}} --coverage
+        run: bun run test -- --maxWorkers=2 --shard=${{matrix.shard}} --coverage
 
       - name: persist coverages
         run: |
@@ -203,27 +90,9 @@ jobs:
     runs-on: ubuntu-latest
     needs: build
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install react 18
-        run: npm run install-react-18
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - name: restore cache from dist
         uses: actions/cache@v4
@@ -233,13 +102,13 @@ jobs:
 
       - name: dist-min test
         if: ${{ matrix.module == 'dist-min' }}
-        run: npm test
+        run: bun run test
         env:
           LIB_DIR: dist-min
 
       - name: dist test
         if: ${{ matrix.module == 'dist' }}
-        run: npm test
+        run: bun run test
         env:
           LIB_DIR: dist
 
@@ -250,10 +119,8 @@ jobs:
     needs: test-react-latest
     steps:
       - uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - uses: actions/download-artifact@v4
         with:
@@ -262,8 +129,8 @@ jobs:
           path: persist-coverage
       - name: Merge Code Coverage
         run: |
-          npx nyc merge persist-coverage/ coverage/coverage-final.json
-          npx nyc report --reporter text -t coverage --report-dir coverage
+          bunx nyc merge persist-coverage/ coverage/coverage-final.json
+          bunx nyc report --reporter text -t coverage --report-dir coverage
           rm -rf persist-coverage
       - name: Upload coverage to codecov
         uses: codecov/codecov-action@v4
@@ -274,26 +141,10 @@ jobs:
   ########################### Compile & Test ###########################
   build:
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - name: cache lib
         uses: actions/cache@v4
@@ -308,7 +159,7 @@ jobs:
           key: es-${{ github.sha }}
 
       - name: compile
-        run: npm run compile
+        run: bun run compile
 
       - name: cache dist
         uses: actions/cache@v4
@@ -317,7 +168,7 @@ jobs:
           key: dist-${{ github.sha }}
 
       - name: dist
-        run: npm run dist
+        run: bun run dist
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
           CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}
@@ -351,36 +202,14 @@ jobs:
   test-lib-es:
     name: test lib/es module
     runs-on: ubuntu-latest
-    needs: setup
     strategy:
       matrix:
         module: [lib, es]
         shard: ['1/2', '2/2']
     steps:
-      - name: checkout
-        # lib only run in master branch not in pull request
-        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        # lib only run in master branch not in pull request
-        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        # lib only run in master branch not in pull request
-        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - name: restore cache from ${{ matrix.module }}
         # lib only run in master branch not in pull request
@@ -393,15 +222,11 @@ jobs:
       - name: compile
         # lib only run in master branch not in pull request
         if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        run: npm run compile
-
-      - name: install react 18
-        if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        run: npm run install-react-18
+        run: bun run compile
 
       - name: test
         # lib only run in master branch not in pull request
         if: ${{ github.event_name != 'pull_request' || matrix.module != 'lib' }}
-        run: npm test -- --maxWorkers=2 --shard=${{matrix.shard}}
+        run: bun run test -- --maxWorkers=2 --shard=${{matrix.shard}}
         env:
           LIB_DIR: ${{ matrix.module }}
diff --git a/.github/workflows/upgrade-deps.yml b/.github/workflows/upgrade-deps.yml
index 3e0dc29631..20d04f2705 100644
--- a/.github/workflows/upgrade-deps.yml
+++ b/.github/workflows/upgrade-deps.yml
@@ -21,10 +21,8 @@ jobs:
             .ncurc.js
             package.json
 
-      - name: setup node
-        uses: actions/setup-node@v4
-        with:
-          node-version: 20
+      - name: setup bun
+        uses: oven-sh/setup-bun@v2
 
       - name: upgrade deps
         id: upgrade
@@ -32,7 +30,7 @@ jobs:
           if [ ! -d .tmp ] ; then
             mkdir .tmp
           fi
-          $(npx npm-check-updates -u > .tmp/upgrade-deps-logs.txt) 2>&1 || true
+          $(bunx npm-check-updates -u > .tmp/upgrade-deps-logs.txt) 2>&1 || true
           if [ -s .tmp/upgrade-deps-logs.txt ]; then
             cat .tmp/upgrade-deps-logs.txt
             echo "logs<<EOF" >> $GITHUB_OUTPUT
diff --git a/.github/workflows/visual-regression-diff-build.yml b/.github/workflows/visual-regression-diff-build.yml
index a4784f07f9..6c0f7f99fd 100644
--- a/.github/workflows/visual-regression-diff-build.yml
+++ b/.github/workflows/visual-regression-diff-build.yml
@@ -16,41 +16,6 @@ permissions:
   contents: read
 
 jobs:
-  # Prepare node modules. Reuse cache if available
-  setup:
-    name: prepare node_modules
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: cache package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: create package-lock.json
-        run: npm i --package-lock-only --ignore-scripts
-
-      - name: hack for single file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
   ############################ Generate Snapshot ###########################
   visual-diff-snapshot:
     name: visual-diff snapshot
@@ -58,33 +23,17 @@ jobs:
       matrix:
         shard: ['1/2', '2/2']
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - name: generate image snapshots
         id: test-image
         run: |
           node node_modules/puppeteer/install.mjs
-          npm run version
-          npm run test:image -- --shard=${{matrix.shard}}
+          bun run version
+          bun run test:image -- --shard=${{matrix.shard}}
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
 
@@ -102,22 +51,8 @@ jobs:
     needs: visual-diff-snapshot
     steps:
       - uses: actions/checkout@v4
-
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
 
       - uses: actions/download-artifact@v4
         with:
@@ -132,7 +67,7 @@ jobs:
           EVENT_NUMBER: ${{ github.event.number }}
           BASE_REF: ${{ github.base_ref }}
         run: |
-          npm run test:visual-regression -- --pr-id=$EVENT_NUMBER --base-ref=$BASE_REF --max-workers=2
+          bun run test:visual-regression -- --pr-id=$EVENT_NUMBER --base-ref=$BASE_REF --max-workers=2
 
       # Upload report in `visualRegressionReport`
       - name: upload report artifact
diff --git a/.github/workflows/visual-regression-diff-finish.yml b/.github/workflows/visual-regression-diff-finish.yml
index 0ffcb2e335..31555e42e2 100644
--- a/.github/workflows/visual-regression-diff-finish.yml
+++ b/.github/workflows/visual-regression-diff-finish.yml
@@ -63,8 +63,8 @@ jobs:
     runs-on: ubuntu-latest
     needs: [upstream-workflow-summary]
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
 
       # We need get persist-index first
       - name: download image snapshot artifact
@@ -110,7 +110,7 @@ jobs:
           echo "✅ Uncompress Finished"
 
           rm package.json
-          npm i ali-oss --no-save
+          bun add ali-oss --no-save
           echo "✅ Install `ali-oss` Finished"
 
           echo "🤖 Uploading"
diff --git a/.github/workflows/visual-regression-persist-start.yml b/.github/workflows/visual-regression-persist-start.yml
index ed83d1aba2..6f640cda22 100644
--- a/.github/workflows/visual-regression-persist-start.yml
+++ b/.github/workflows/visual-regression-persist-start.yml
@@ -12,65 +12,18 @@ permissions:
   contents: read
 
 jobs:
-  # Prepare node modules. Reuse cache if available
-  setup:
-    name: prepare node_modules
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: cache package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: create package-lock.json
-        run: npm i --package-lock-only --ignore-scripts
-
-      - name: hack for single file
-        run: |
-          if [ ! -d "package-temp-dir" ]; then
-            mkdir package-temp-dir
-          fi
-          cp package-lock.json package-temp-dir
-      - name: cache node_modules
-        id: node_modules_cache_id
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
-      - name: install
-        if: steps.node_modules_cache_id.outputs.cache-hit != 'true'
-        run: npm ci
-
   test-image:
     name: test image
     runs-on: ubuntu-latest
-    needs: setup
     steps:
-      - name: checkout
-        uses: actions/checkout@v4
-
-      - name: restore cache from package-lock.json
-        uses: actions/cache@v4
-        with:
-          path: package-temp-dir
-          key: lock-${{ github.sha }}
-
-      - name: restore cache from node_modules
-        uses: actions/cache@v4
-        with:
-          path: node_modules
-          key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
-
+      - uses: actions/checkout@v4
+      - uses: oven-sh/setup-bun@v2
+      - run: bun install
       - name: generate image snapshots
         run: |
           node node_modules/puppeteer/install.mjs
-          npm run version
-          npm run test:image
+          bun run version
+          bun run test:image
           tar -czvf imageSnapshots.tar.gz imageSnapshots/*
         env:
           NODE_OPTIONS: "--max_old_space_size=4096"
diff --git a/docs/blog/github-actions-workflow.en-US.md b/docs/blog/github-actions-workflow.en-US.md
index 6d109f4484..89f949c121 100644
--- a/docs/blog/github-actions-workflow.en-US.md
+++ b/docs/blog/github-actions-workflow.en-US.md
@@ -176,8 +176,8 @@ jobs:
       - name: Checkout code
         uses: actions/checkout@v4
 
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
+      - name: Setup bun
+        uses: oven-sh/setup-bun@v2
         with:
           node-version: 16
 
diff --git a/docs/blog/github-actions-workflow.zh-CN.md b/docs/blog/github-actions-workflow.zh-CN.md
index 7431744fb9..d061f2e7e7 100644
--- a/docs/blog/github-actions-workflow.zh-CN.md
+++ b/docs/blog/github-actions-workflow.zh-CN.md
@@ -180,7 +180,7 @@ jobs:
         uses: actions/checkout@v4
 
       - name: Setup Node.js (设置 node 版本)
-        uses: actions/setup-node@v3
+        uses: oven-sh/setup-bun@v2
         with:
           node-version: 16
 
diff --git a/package.json b/package.json
index 5438d43be9..6503ebd1a3 100644
--- a/package.json
+++ b/package.json
@@ -52,7 +52,8 @@
     "format": "biome format --write .",
     "install-react-16": "npm i --no-save --legacy-peer-deps react@16 react-dom@16 @testing-library/react@12",
     "install-react-17": "npm i --no-save --legacy-peer-deps react@17 react-dom@17 @testing-library/react@12",
-    "install-react-18": "npm i --no-save --legacy-peer-deps react@18 react-dom@18",
+    "bun-install-react-16": "bun remove react react-dom @testing-library/react && bun add --no-save react@16 react-dom@16 @testing-library/react@12",
+    "bun-install-react-17": "bun remove react react-dom @testing-library/react && bun add --no-save react@17 react-dom@17 @testing-library/react@12",
     "prelint": "dumi setup",
     "lint": "npm run version && npm run tsc && npm run lint:script && npm run lint:biome && npm run lint:demo && npm run lint:md && npm run lint:style && npm run lint:changelog",
     "lint-fix": "npm run lint-fix:script && npm run lint-fix:demo",