Set up Storybook tests for CI

Add vitest configuration with projects for unit and storybook tests:
- Create ui/vitest.config.ts with unit and storybook test projects
- Add ui-tests-storybook.yml workflow for running Storybook tests in CI
- Update ui-tests.yml to explicitly run unit tests only
- Add test:unit and test:storybook scripts to package.json
- Upgrade vitest to 4.0.15 and add @vitest/browser-playwright

Ref tensorzero#1602

Author: rrrodzilla

.github/workflows/general.yml

@@ -1030,6 +1030,14 @@ jobs:
       is_merge_group: ${{ github.event_name == 'merge_group' }}
     needs: [build-gateway-container, build-mock-inference-container]
 
+  ui-storybook-tests:
+    permissions:
+      contents: read
+      actions: read
+    uses: ./.github/workflows/ui-tests-storybook.yml
+    with:
+      is_merge_group: ${{ github.event_name == 'merge_group' }}
+
   ui-tests-e2e:
     permissions:
       contents: read

.github/workflows/ui-tests-storybook.yml

@@ -0,0 +1,49 @@
+name: UI Storybook Tests
+
+on:
+  workflow_call:
+    inputs:
+      is_merge_group:
+        required: true
+        type: boolean
+
+permissions:
+  contents: read
+  actions: read
+
+jobs:
+  ui-storybook-tests:
+    runs-on: ubuntu-latest
+    if: github.repository == 'tensorzero/tensorzero'
+
+    steps:
+      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683
+
+      - name: Setup Node
+        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020
+        with:
+          node-version: "24.11.0"
+
+      - name: Setup `pnpm`
+        run: |
+          for attempt in 1 2 3; do
+            if npm install -g pnpm@latest; then
+              break
+            fi
+            if [ $attempt -eq 3 ]; then
+              echo "Failed to install pnpm after 3 attempts"
+              exit 1
+            fi
+            sleep $((10 * attempt))
+          done
+        shell: bash
+
+      - name: Install `pnpm` dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Install Playwright browsers
+        working-directory: ui
+        run: pnpm exec playwright install chromium
+
+      - name: Run Storybook tests
+        run: pnpm ui:test:storybook --run

.github/workflows/ui-tests.yml

@@ -98,15 +98,15 @@ jobs:
           TENSORZERO_CLICKHOUSE_VERSION=${{ matrix.clickhouse_version }} docker compose -f fixtures/docker-compose.yml up clickhouse fixtures mock-inference-provider -d
           docker compose -f fixtures/docker-compose.yml wait fixtures
 
-      - name: Run `pnpm test`
+      - name: Run `pnpm test:unit`
         env:
           OPENAI_API_KEY: not_used
           FIREWORKS_API_KEY: not_used
           TENSORZERO_UI_CONFIG_PATH: fixtures/config/tensorzero.toml
           TENSORZERO_CLICKHOUSE_URL: http://chuser:chpassword@localhost:8123/tensorzero_ui_fixtures
           TENSORZERO_POSTGRES_URL: postgres://postgres:postgres@localhost:5432/tensorzero_ui_fixtures
           TENSORZERO_GATEWAY_URL: http://localhost:3000
-        run: pnpm ui:test
+        run: pnpm ui:test:unit
 
       - name: Run `pnpm test` for tensorzero-node
         working-directory: internal/tensorzero-node

package.json

@@ -7,6 +7,8 @@
     "ui:dev": "pnpm --filter=tensorzero-ui dev",
     "ui:storybook": "pnpm --filter=tensorzero-ui storybook",
     "ui:test": "pnpm --filter=tensorzero-ui test",
+    "ui:test:unit": "pnpm --filter=tensorzero-ui test:unit",
+    "ui:test:storybook": "pnpm --filter=tensorzero-ui test:storybook",
     "ui:test:e2e": "pnpm --filter=tensorzero-ui test-e2e",
     "ui:test:e2e-base-path": "pnpm --filter=tensorzero-ui test-e2e-base-path",
     "tensorzero-node:test": "cd internal/tensorzero-node && pnpm test",