Add build job with turbo cache to CI (#1615)

## Self Checklist - [x] I wrote a PR title in **English** and added an appropriate **label** to the PR. - [x] I wrote the commit message in **English** and to follow [**the Conventional Commits specification**](https://www.conventionalcommits.org/en/v1.0.0/). - [x] I [added the **changeset**](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md) about the changes that needed to be released. (or didn't have to) - [x] I wrote or updated **documentation** related to the changes. (or didn't have to) - [x] I wrote or updated **tests** related to the changes. (or didn't have to) - [x] I tested the changes in various browsers. (or didn't have to) - Windows: Chrome, Edge, (Optional) Firefox - macOS: Chrome, Edge, Safari, (Optional) Firefox ## Related Issue  Fixes #1005 ## Summary  - 빌드 잡을 CI에 추가합니다. - 빌드 잡에 캐시를 추가합니다. ## Details  기존에 `--filter=bezier-icons` 를 통해 아이콘 패키지만 빌드하던 것에서 필터를 제거하고, 모든 패키지를 빌드하도록 변경합니다. 의존성 업데이트 등 변경이 있었을 경우 라이브러리가 정상적으로 빌드되는 지 검증하기 위해서입니다. #1424 에서 빌드 시간이 많이 단축되었지만, 필터가 제거되었으므로 총 빌드 시간도 유의미하게 증가하게 될 거라 생각했습니다. 이를 방지하고자 빌드 잡에 캐시를 추가했습니다. ### 빌드 잡에 캐시 추가 - 기존엔 jest의 캐시가 없었습니다. 캐시 관련 설정을 추가합니다. - 마이너: 캐시 설정을 추가하며 jest 설정을 레포지토리 전반적으로 통일합니다. jest 관련 패키지를 루트로 옮기고, `@swc/jest` 를 모든 패키지에 적용하여 테스트 수행시간을 줄이고자 했습니다. 기본값과 동일하거나 불필요한 jest 설정 옵션은 제거했습니다. - `test:ci` 스크립트를 제거하고 기존 `test: jest --onlyChanged` 스크립트를 `test:ci` 와 동일한 스크립트로 변경합니다. 기존에 only changed 플래그가 추가되었던 이유가 pre-commit 훅을 빠르게 수행하기 위해서였는데, pre-commit 훅이 제거되었기때문에 불필요해졌다고 판단했습니다. ### Breaking change? (Yes/No)  No
channel-io · Oct 17, 2023 · f3945b9 · f3945b9
1 parent 5042b04
commit f3945b9
Show file tree

Hide file tree

Showing 19 changed files with 123 additions and 181 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,7 +1,8 @@
 version: 2.1
 
 orbs:
-  codecov: codecov/codecov@1.2.0
+  node: circleci/node@5.1.0
+  codecov: codecov/codecov@3.3.0
 
 references:
   workspace_root: &workspace_root
@@ -10,74 +11,98 @@ references:
   attach_workspace: &attach_workspace
     attach_workspace:
       at: *workspace_root
+
+  build_cache_paths: &build_cache_paths
+    paths:
+      - node_modules/.cache/turbo
 
-defaults: &defaults
-  resource_class: xlarge
-  working_directory: *workspace_root
+  lint_cache_paths: &lint_cache_paths
+    paths:
+      - packages/bezier-react/.stylelintcache
+      - packages/bezier-react/.eslintcache
+      - packages/bezier-icons/.eslintcache
+      - packages/bezier-figma-plugin/.eslintcache
+      - packages/bezier-codemod/.eslintcache
 
-  docker:
-    - image: node:18.17.1
+  test_cache_paths: &test_cache_paths
+    paths:
+      - packages/bezier-react/.jestcache
+      - packages/bezier-icons/.jestcache
+      - packages/bezier-figma-plugin/.jestcache
+      - packages/bezier-codemod/.jestcache
 
-filter_only_tagged: &filter_only_tagged
-  filters:
-    tags:
-      only: /^v.*/
-    branches:
-      ignore: /.*/
+executors:
+  node_executor:
+    docker:
+      - image: node:18.17.1
+    resource_class: xlarge
+    working_directory: *workspace_root
 
 jobs:
   install:
-    <<: *defaults
+    executor: node_executor
     steps:
       - checkout
-      - restore_cache:
-          keys:
-          - bezier-react-dependencies-{{ checksum "yarn.lock" }}
-      - run: yarn install
-      - save_cache:
-          paths:
-            - .yarn/cache
-            - .yarn/unplugged
-          key: bezier-react-dependencies-{{ checksum "yarn.lock" }}
+      - node/install-packages:
+          pkg-manager: yarn
       - persist_to_workspace:
           root: *workspace_root
           paths:
             - .
 
   build:
-    <<: *defaults
+    executor: node_executor
     steps:
       - *attach_workspace
-      - run: yarn build --filter=bezier-icons
+      - restore_cache:
+          keys:
+          - build-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-
+          - build-{{ .Environment.CACHE_VERSION }}-
+      - run: yarn build
+      - save_cache:
+          key: build-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-{{ epoch }}
+          <<: *build_cache_paths
       - persist_to_workspace:
           root: *workspace_root
           paths:
             - .
 
   lint:
-    <<: *defaults
+    executor: node_executor
     steps:
       - *attach_workspace
+      - restore_cache:
+          keys:
+          - lint-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-
+          - lint-{{ .Environment.CACHE_VERSION }}-
       - run: yarn lint
+      - save_cache:
+          key: lint-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-{{ epoch }}
+          <<: *lint_cache_paths
 
   typecheck:
-    <<: *defaults
+    executor: node_executor
     steps:
       - *attach_workspace
       - run: yarn typecheck
 
   test:
-    <<: *defaults
+    executor: node_executor
     steps:
       - *attach_workspace
-      - run: yarn test:ci
+      - restore_cache:
+          keys:
+          - test-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-
+          - test-{{ .Environment.CACHE_VERSION }}-
+      - run: yarn test
       - codecov/upload:
           file: './packages/bezier-react/coverage/lcov.info'
-          token: $CODECOV_TOKEN
+      - save_cache:
+          key: test-{{ .Environment.CACHE_VERSION }}-{{ .Branch }}-{{ epoch }}
+          <<: *test_cache_paths
 
 workflows:
-  version: 2
-  lint_and_test:
+  ci:
     jobs:
       - install
       - build:

diff --git a/.github/workflows/chromatic-report.yml b/.github/workflows/chromatic-report.yml
@@ -12,7 +12,7 @@ jobs:
     name: Chromatic Report
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout Repo
+      - name: Checkout
         uses: actions/checkout@v4
 
       - name: Download artifact

diff --git a/.github/workflows/chromatic.yml b/.github/workflows/chromatic.yml
@@ -4,8 +4,8 @@ on:
   push:
     branches:
       - main
+      - alpha
   pull_request:
-    types: [opened, reopened, synchronize]
     paths:
       - packages/bezier-react/**
 
@@ -15,33 +15,32 @@ jobs:
     name: Chromatic
     runs-on: ubuntu-latest
     steps:
-      - name: Get Yarn cache path
-        id: yarn-cache
-        run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
-
-      - name: Checkout Repo
+      - name: Checkout
         uses: actions/checkout@v4
         with:
           fetch-depth: 0
 
       - name: Setup Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18.17.1
+          node-version-file: .nvmrc
+          cache: yarn
 
-      - name: Load Yarn cache
+      - name: Restore cache
         uses: actions/cache@v3
         with:
-          path: ${{ steps.yarn-cache.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
+          path: |
+            **/.turbo
+            node_modules/.cache/turbo
+          key: ${{ runner.os }}-chromatic-${{ github.sha }}
           restore-keys: |
-            ${{ runner.os }}-yarn-
+            ${{ runner.os }}-chromatic-
 
-      - name: Install Dependencies
+      - name: Install dependencies
         run: yarn
 
-      - name: Build Packages
-        run: yarn build --filter=bezier-icons
+      - name: Build bezier-react's dependencies
+        run: yarn build --filter=@channel.io/bezier-react^...
 
       - name: Publish to Chromatic
         uses: chromaui/action@v1

diff --git a/.github/workflows/generate-icon-files.yml b/.github/workflows/generate-icon-files.yml
@@ -12,13 +12,13 @@ jobs:
     name: Generate icon files from icons.json file
     runs-on: ubuntu-latest
     steps:
-      - name: Checkout Repo
+      - name: Checkout
         uses: actions/checkout@v4
 
       - name: Setup Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18.17.1
+          node-version-file: .nvmrc
 
       - name: Git Config
         run: |

diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -10,32 +10,17 @@ jobs:
     name: Release
     runs-on: ubuntu-latest
     steps:
-      - name: Get Yarn cache path
-        id: yarn-cache
-        run: echo "dir=$(yarn cache dir)" >> $GITHUB_OUTPUT
-
-      - name: Checkout Repo
+      - name: Checkout
         uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
 
       - name: Setup Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: 18.17.1
-
-      - name: Load Yarn cache
-        uses: actions/cache@v3
-        with:
-          path: ${{ steps.yarn-cache.outputs.dir }}
-          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
-          restore-keys: |
-            ${{ runner.os }}-yarn-
+          node-version-file: .nvmrc
+          cache: yarn
 
-      - name: Install Dependencies
+      - name: Install dependencies
         run: yarn
-        env:
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
 
       - name: Create release Pull Request or publish to NPM
         id: changesets

diff --git a/.gitignore b/.gitignore
@@ -215,3 +215,6 @@ stats.html
 
 # Rollup cache
 .rollup.cache
+
+# Jest cache
+.jestcache
diff --git a/package.json b/package.json
@@ -12,7 +12,6 @@
     "lint": "turbo run lint",
     "typecheck": "turbo run typecheck",
     "test": "turbo run test",
-    "test:ci": "turbo run test:ci",
     "clean": "turbo run clean && rm -rf node_modules .turbo",
     "version-packages": "changeset version && yarn --mode=\"update-lockfile\"",
     "release": "turbo run build --filter='@channel.io/*' && changeset publish",
@@ -27,13 +26,17 @@
     "@channel.io/stylelint-config": "^1.2.0",
     "@commitlint/cli": "^17.7.1",
     "@commitlint/config-conventional": "^17.7.0",
+    "@swc/core": "^1.3.83",
+    "@swc/jest": "^0.2.29",
+    "@types/jest": "^29.5.4",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^7.32.0",
     "eslint-config-bezier": "workspace:*",
     "husky": "^8.0.3",
+    "jest": "^29.6.4",
+    "jest-environment-jsdom": "^29.6.4",
     "npm-run-all": "^4.1.5",
     "stylelint": "^13.13.1",
-    "ts-node": "^10.9.1",
     "turbo": "^1.10.13",
     "typescript": "^4.9.5"
   },

diff --git a/packages/bezier-codemod/jest.config.cjs b/packages/bezier-codemod/jest.config.cjs
@@ -1,19 +1,12 @@
-/** @type {import('ts-jest').JestConfigWithTsJest} */
+/** @type {import('jest').Config} */
 module.exports = {
-  preset: 'ts-jest/presets/default-esm',
+  cacheDirectory: '.jestcache',
+  testEnvironment: 'node',
+  transform: {
+    '^.+\\.[t|j]sx?$': ['@swc/jest'],
+  },
   moduleNameMapper: {
     '^(\\.{1,2}/.*)\\.js$': '$1',
   },
-  transform: {
-    // '^.+\\.[tj]sx?$' to process js/ts with `ts-jest`
-    // '^.+\\.m?[tj]sx?$' to process js/ts/mjs/mts with `ts-jest`
-    '^.+\\.tsx?$': [
-      'ts-jest',
-      {
-        useESM: true,
-      },
-    ],
-  },
-  testEnvironment: 'node',
-  testRegex: '\\.test\\.ts$',
+  testMatch: ['**/*.test.(ts|tsx)'],
 }
diff --git a/packages/bezier-codemod/package.json b/packages/bezier-codemod/package.json
@@ -19,8 +19,8 @@
 		"dev": "tsc --watch",
 		"lint": "TIMING=1 eslint --cache .",
 		"typecheck": "tsc --noEmit",
-		"test": "jest --onlyChanged",
-		"clean": "rm -rf dist node_modules .turbo .eslintcache"
+		"test": "jest",
+		"clean": "rm -rf dist node_modules .turbo .eslintcache .jestcache"
 	},
 	"files": [
 		"dist"
@@ -33,12 +33,9 @@
 		"ts-morph": "^19.0.0"
 	},
 	"devDependencies": {
-		"@types/jest": "^29.5.4",
 		"@types/node": "^20.6.0",
 		"@types/react": "^18.2.21",
 		"eslint-config-bezier": "workspace:*",
-		"jest": "^29.6.4",
-		"ts-jest": "^29.1.1",
 		"tsconfig": "workspace:*"
 	},
 	"keywords": [

diff --git a/packages/bezier-figma-plugin/package.json b/packages/bezier-figma-plugin/package.json
@@ -14,9 +14,10 @@
     "lint": "run-p 'lint:*'",
     "lint:js": "TIMING=1 eslint --cache .",
     "lint:style": "stylelint --allow-empty-input --cache '**/*.styled.{js,ts}'",
+    "typecheck": "tsc --noEmit",
     "clean": "run-s 'clean:*'",
     "clean:build": "rm -rf dist",
-    "clean:cache": "rm -rf node_modules .turbo .eslintcache"
+    "clean:cache": "rm -rf node_modules .turbo .eslintcache .jestcache"
   },
   "author": "Channel Corp.",
   "license": "Apache-2.0",

diff --git a/packages/bezier-icons/jest.config.js b/packages/bezier-icons/jest.config.js
@@ -0,0 +1,8 @@
+/** @type {import('jest').Config} */
+module.exports = {
+  cacheDirectory: '.jestcache',
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.[t|j]sx?$': ['@swc/jest'],
+  },
+}
diff --git a/packages/bezier-icons/package.json b/packages/bezier-icons/package.json
@@ -28,8 +28,8 @@
     "build": "rollup -c",
     "dev": "rollup -c -w",
     "lint": "TIMING=1 eslint --cache .",
-    "typecheck": "tsc --build --verbose",
-    "test": "jest --onlyChanged",
+    "typecheck": "tsc --noEmit",
+    "test": "jest",
     "clean": "run-s 'clean:*'",
     "clean:build": "rm -rf dist",
     "clean:cache": "rm -rf node_modules .turbo .eslintcache stats.html"
@@ -56,7 +56,6 @@
     "@svgr/core": "^8.1.0",
     "@svgr/plugin-jsx": "^8.1.0",
     "eslint-config-bezier": "workspace:^",
-    "jest": "^29.6.4",
     "rollup": "^3.29.1",
     "rollup-plugin-visualizer": "^5.9.2",
     "svgo": "^3.0.2",

diff --git a/packages/bezier-icons/tsconfig.eslint.json b/packages/bezier-icons/tsconfig.eslint.json
@@ -6,5 +6,6 @@
     ".eslintrc.js",
     "babel.config.js",
     "rollup.config.mjs",
+    "jest.config.js",
   ],
 }
diff --git a/packages/bezier-icons/tsconfig.json b/packages/bezier-icons/tsconfig.json
@@ -1,6 +1,5 @@
 {
   "compilerOptions": {
-    "noEmit": true,
     "target": "es2017",
     "moduleResolution": "node",
     "lib": ["es2017", "dom"],