From 54029124912163c351cf1c45ac728e7d66fb254a Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 14:28:05 +0900
Subject: [PATCH 01/21] chore: use VITEST_API_TOKEN for ui dev

---
 packages/ui/CONTRIBUTING.md |  4 ++--
 packages/ui/vite.config.ts  | 22 ++++++++++++++++++++++
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 847f71a03306..07dc1c71d9c2 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -5,7 +5,7 @@ nr ui:dev
 ```
 
 ```bash
-nr test --api
+nr test --ui ---open=false
 ```
 
 As the last command, you can use any of the available tests suites instead. Make sure that they run at 51204 port or specify a custom port with `VITE_PORT` environmental variable when running the first command. For example,
@@ -15,7 +15,7 @@ VITE_PORT=3200 nr ui:dev
 ```
 
 ```bash
-nr test --api=3200
+nr test --ui --open=false --api=3200
 ```
 
 Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 586e772c6ac2..5ad7c00a733f 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -1,3 +1,4 @@
+import assert from 'node:assert'
 import Vue from '@vitejs/plugin-vue'
 import { resolve } from 'pathe'
 import { presetAttributify, presetIcons, presetUno, transformerDirectives } from 'unocss'
@@ -63,6 +64,27 @@ export default defineConfig({
     //   },
     // },
 
+    {
+      name: 'proxy-api-token',
+      apply: 'serve',
+      async transformIndexHtml() {
+        const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
+        const apiTokenPattern = /<script>(window\.VITEST_API_TOKEN = .+?)<\/script>/s
+        const response = await fetch(new URL('/__vitest__/', apiOrigin))
+        assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${apiOrigin}/__vitest__/`)
+        const testHtml = await response.text()
+        const tokenScript = testHtml.match(apiTokenPattern)?.[1]
+        assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
+        return [
+          {
+            tag: 'script',
+            children: tokenScript,
+            injectTo: 'head-prepend',
+          },
+        ]
+      },
+    },
+
     // uncomment to see the browser tab
     // {
     //   name: 'browser-dev-preview',

From f4a06697998c12ed099ac7356f09ecbb0146ff29 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 14:58:43 +0900
Subject: [PATCH 02/21] wip: browser-dev-preview

---
 packages/ui/CONTRIBUTING.md | 16 ++++++++++++---
 packages/ui/browser.dev.js  | 40 ++++++++++++++++++++++++++++---------
 packages/ui/vite.config.ts  | 19 +++++++++---------
 3 files changed, 54 insertions(+), 21 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 07dc1c71d9c2..4c3749a79a75 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -5,7 +5,7 @@ nr ui:dev
 ```
 
 ```bash
-nr test --ui ---open=false
+nr test --ui --open=false
 ```
 
 As the last command, you can use any of the available tests suites instead. Make sure that they run at 51204 port or specify a custom port with `VITE_PORT` environmental variable when running the first command. For example,
@@ -20,6 +20,16 @@ nr test --ui --open=false --api=3200
 
 Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
 
-To preview the browser tab, uncomment the "browser-dev-preview" plugin in `vite.config.ts`.
+<!-- TODO -->
 
-To configure the browser state, update the `__vitest_browser_runner__` object in `browser.dev.js`.
+To preview the browser tab, start a browser-mode test server and run the UI dev server with `BROWSER_DEV_PREVIEW=true`.
+
+```bash
+# run browser mode test server
+pnpm -C packages/ui test:ui --browser.headless --ui
+
+# run ui dev server
+BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client
+```
+
+To configure the browser state, update the `__vitest_browser_runner__` object in `browser.dev.js` with the real project name, active browser session id, and project root from the browser-mode test server.
diff --git a/packages/ui/browser.dev.js b/packages/ui/browser.dev.js
index 2381161e627e..8a6fd546c5b7 100644
--- a/packages/ui/browser.dev.js
+++ b/packages/ui/browser.dev.js
@@ -1,11 +1,33 @@
 window.__vitest_browser_runner__ = {
-  files: [],
-  config: {
-    browser: {
-      name: 'chrome',
-    },
-  },
-  type: 'orchestrator',
-  provider: 'playwright',
-  wrapModule: () => {},
+  // files: [],
+  // runningFiles: [],
+  // config: {
+  //   name: '',
+  //   browser: {
+  //     name: 'chromium',
+  //   },
+  // },
+  // provider: 'playwright',
+  // method: 'orchestrate',
+  // type: 'orchestrator',
+  // sessionId: '<real active browser session id>',
+  // testerId: 'none',
+  // viteConfig: {
+  //   root: '/home/hiroshi/code/others/vitest/packages/ui',
+  // },
+  // providedContext: '{}',
+  disposeExceptionTracker: () => {},
+  wrapModule: f => f(),
+  wrapDynamicImport: f => f(),
+      disposeExceptionTracker: () => {},
+    cleanups: [],
+    config: {"mode":"test","isolate":true,"defines":{"__BASE_PATH__":"/__vitest__/"},"taskTitleValueFormatTruncate":40,"setupFiles":[],"allowOnly":true,"testTimeout":15000,"hookTimeout":30000,"clearMocks":false,"mockReset":false,"restoreMocks":false,"unstubEnvs":false,"unstubGlobals":false,"maxConcurrency":5,"pool":"forks","expect":{},"snapshotSerializers":[],"api":{"allowExec":true,"allowWrite":true},"disableConsoleIntercept":false,"root":"/home/hiroshi/code/others/vitest/packages/ui","name":"chromium","globals":false,"coverage":{"reportsDirectory":"/home/hiroshi/code/others/vitest/packages/ui/coverage","provider":"v8","enabled":false,"autoAttachSubprocess":false},"fakeTimers":{"loopLimit":10000,"shouldClearNativeTimers":true},"deps":{"web":{"transformAssets":true,"transformCss":true,"transformGlobPattern":[]},"optimizer":{"ssr":{"enabled":false},"client":{"enabled":false}},"moduleDirectories":["/node_modules/","/packages/"]},"snapshotOptions":{"updateSnapshot":"new","snapshotFormat":{},"expand":false},"sequence":{"hooks":"stack"},"inspector":{"enabled":false,"waitForDebugger":false},"detectAsyncLeaks":false,"watch":true,"env":{"BASE_URL":"/","MODE":"test","DEV":true,"PROD":false,"VITEST_BROWSER_DEBUG":""},"browser":{"name":"chromium","headless":true,"isolate":true,"fileParallelism":true,"ui":false,"detailsPanelPosition":"bottom","viewport":{"width":414,"height":896},"screenshotFailures":true,"locators":{"testIdAttribute":"data-testid","exact":false},"providerOptions":{"actionTimeout":5000},"trackUnhandledErrors":true,"trace":"off","traceView":{"enabled":true,"recordCanvas":false,"inlineImages":false}},"serializedDefines":"","experimental":{"fsModuleCache":false,"importDurations":{"print":false,"failOnDanger":false,"limit":10,"thresholds":{"warn":100,"danger":500}},"viteModuleRunner":true,"nodeLoader":true},"tags":[],"strictTags":true,"slowTestThreshold":300,"isAgent":false},
+    viteConfig: {"root":"/home/hiroshi/code/others/vitest/packages/ui"},
+    type: "orchestrator",
+    sessionId: "9a962055-78ca-45ae-9fc6-6d218e58040e",
+    testerId: "none",
+    otelCarrier: null,
+    provider: "playwright",
+    method: "orchestrate",
+    providedContext: "[{}]",
 }
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 5ad7c00a733f..20c78cacc726 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -85,16 +85,17 @@ export default defineConfig({
       },
     },
 
+    // TODO
     // uncomment to see the browser tab
-    // {
-    //   name: 'browser-dev-preview',
-    //   apply: 'serve',
-    //   transformIndexHtml() {
-    //     return [
-    //       { tag: 'script', attrs: { src: './browser.dev.js' } },
-    //     ]
-    //   },
-    // },
+    !!process.env.BROWSER_DEV_PREVIEW && {
+      name: 'browser-dev-preview',
+      apply: 'serve',
+      transformIndexHtml() {
+        return [
+          { tag: 'script', attrs: { src: './browser.dev.js' } },
+        ]
+      },
+    },
     {
       // workaround `crossorigin` issues on some browsers
       // https://github.com/vitejs/vite/issues/6648

From 69545d531e864ddc28be1f84cbfc3ee146e30eb1 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:01:43 +0900
Subject: [PATCH 03/21] cleanup

---
 packages/ui/vite.config.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 20c78cacc726..eaa0eb2bf5a1 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -69,11 +69,11 @@ export default defineConfig({
       apply: 'serve',
       async transformIndexHtml() {
         const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
-        const apiTokenPattern = /<script>(window\.VITEST_API_TOKEN = .+?)<\/script>/s
+        const apiTokenPattern = /window\.VITEST_API_TOKEN = "\w+"/
         const response = await fetch(new URL('/__vitest__/', apiOrigin))
         assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${apiOrigin}/__vitest__/`)
         const testHtml = await response.text()
-        const tokenScript = testHtml.match(apiTokenPattern)?.[1]
+        const tokenScript = testHtml.match(apiTokenPattern)?.[0]
         assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
         return [
           {

From 4a90b067c8af3cdf3075cc74538a022d25a6b85e Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:05:26 +0900
Subject: [PATCH 04/21] fix: disable on test

---
 packages/ui/vite.config.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index eaa0eb2bf5a1..45492ebbe202 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -66,7 +66,9 @@ export default defineConfig({
 
     {
       name: 'proxy-api-token',
-      apply: 'serve',
+      apply(_config, env) {
+        return env.command === 'serve' && env.mode !== 'test'
+      },
       async transformIndexHtml() {
         const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
         const apiTokenPattern = /window\.VITEST_API_TOKEN = "\w+"/

From 289e163d459e233e5137d09b0a3d62be1e66859e Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:07:33 +0900
Subject: [PATCH 05/21] cleanup

---
 packages/ui/CONTRIBUTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 4c3749a79a75..b58b2b164db7 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -26,7 +26,7 @@ To preview the browser tab, start a browser-mode test server and run the UI dev
 
 ```bash
 # run browser mode test server
-pnpm -C packages/ui test:ui --browser.headless --ui
+pnpm -C packages/ui test:ui --browser.headless --ui --open=false
 
 # run ui dev server
 BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client

From 3ea242ca65264bba01614137e1cbf73438f6e69b Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:26:40 +0900
Subject: [PATCH 06/21] wip browser dev

---
 packages/ui/browser.dev.js | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/ui/browser.dev.js b/packages/ui/browser.dev.js
index 8a6fd546c5b7..2dd90abc3265 100644
--- a/packages/ui/browser.dev.js
+++ b/packages/ui/browser.dev.js
@@ -19,15 +19,15 @@ window.__vitest_browser_runner__ = {
   disposeExceptionTracker: () => {},
   wrapModule: f => f(),
   wrapDynamicImport: f => f(),
-      disposeExceptionTracker: () => {},
-    cleanups: [],
-    config: {"mode":"test","isolate":true,"defines":{"__BASE_PATH__":"/__vitest__/"},"taskTitleValueFormatTruncate":40,"setupFiles":[],"allowOnly":true,"testTimeout":15000,"hookTimeout":30000,"clearMocks":false,"mockReset":false,"restoreMocks":false,"unstubEnvs":false,"unstubGlobals":false,"maxConcurrency":5,"pool":"forks","expect":{},"snapshotSerializers":[],"api":{"allowExec":true,"allowWrite":true},"disableConsoleIntercept":false,"root":"/home/hiroshi/code/others/vitest/packages/ui","name":"chromium","globals":false,"coverage":{"reportsDirectory":"/home/hiroshi/code/others/vitest/packages/ui/coverage","provider":"v8","enabled":false,"autoAttachSubprocess":false},"fakeTimers":{"loopLimit":10000,"shouldClearNativeTimers":true},"deps":{"web":{"transformAssets":true,"transformCss":true,"transformGlobPattern":[]},"optimizer":{"ssr":{"enabled":false},"client":{"enabled":false}},"moduleDirectories":["/node_modules/","/packages/"]},"snapshotOptions":{"updateSnapshot":"new","snapshotFormat":{},"expand":false},"sequence":{"hooks":"stack"},"inspector":{"enabled":false,"waitForDebugger":false},"detectAsyncLeaks":false,"watch":true,"env":{"BASE_URL":"/","MODE":"test","DEV":true,"PROD":false,"VITEST_BROWSER_DEBUG":""},"browser":{"name":"chromium","headless":true,"isolate":true,"fileParallelism":true,"ui":false,"detailsPanelPosition":"bottom","viewport":{"width":414,"height":896},"screenshotFailures":true,"locators":{"testIdAttribute":"data-testid","exact":false},"providerOptions":{"actionTimeout":5000},"trackUnhandledErrors":true,"trace":"off","traceView":{"enabled":true,"recordCanvas":false,"inlineImages":false}},"serializedDefines":"","experimental":{"fsModuleCache":false,"importDurations":{"print":false,"failOnDanger":false,"limit":10,"thresholds":{"warn":100,"danger":500}},"viteModuleRunner":true,"nodeLoader":true},"tags":[],"strictTags":true,"slowTestThreshold":300,"isAgent":false},
-    viteConfig: {"root":"/home/hiroshi/code/others/vitest/packages/ui"},
-    type: "orchestrator",
-    sessionId: "9a962055-78ca-45ae-9fc6-6d218e58040e",
-    testerId: "none",
-    otelCarrier: null,
-    provider: "playwright",
-    method: "orchestrate",
-    providedContext: "[{}]",
+  disposeExceptionTracker: () => {},
+  cleanups: [],
+  config: { mode: 'test', isolate: true, defines: { __BASE_PATH__: '/__vitest__/' }, taskTitleValueFormatTruncate: 40, setupFiles: [], allowOnly: true, testTimeout: 15000, hookTimeout: 30000, clearMocks: false, mockReset: false, restoreMocks: false, unstubEnvs: false, unstubGlobals: false, maxConcurrency: 5, pool: 'forks', expect: {}, snapshotSerializers: [], api: { allowExec: true, allowWrite: true }, disableConsoleIntercept: false, root: '/home/hiroshi/code/others/vitest/packages/ui', name: 'chromium', globals: false, coverage: { reportsDirectory: '/home/hiroshi/code/others/vitest/packages/ui/coverage', provider: 'v8', enabled: false, autoAttachSubprocess: false }, fakeTimers: { loopLimit: 10000, shouldClearNativeTimers: true }, deps: { web: { transformAssets: true, transformCss: true, transformGlobPattern: [] }, optimizer: { ssr: { enabled: false }, client: { enabled: false } }, moduleDirectories: ['/node_modules/', '/packages/'] }, snapshotOptions: { updateSnapshot: 'new', snapshotFormat: {}, expand: false }, sequence: { hooks: 'stack' }, inspector: { enabled: false, waitForDebugger: false }, detectAsyncLeaks: false, watch: true, env: { BASE_URL: '/', MODE: 'test', DEV: true, PROD: false, VITEST_BROWSER_DEBUG: '' }, browser: { name: 'chromium', headless: true, isolate: true, fileParallelism: true, ui: false, detailsPanelPosition: 'bottom', viewport: { width: 414, height: 896 }, screenshotFailures: true, locators: { testIdAttribute: 'data-testid', exact: false }, providerOptions: { actionTimeout: 5000 }, trackUnhandledErrors: true, trace: 'off', traceView: { enabled: true, recordCanvas: false, inlineImages: false } }, serializedDefines: '', experimental: { fsModuleCache: false, importDurations: { print: false, failOnDanger: false, limit: 10, thresholds: { warn: 100, danger: 500 } }, viteModuleRunner: true, nodeLoader: true }, tags: [], strictTags: true, slowTestThreshold: 300, isAgent: false },
+  viteConfig: { root: '/home/hiroshi/code/others/vitest/packages/ui' },
+  type: 'orchestrator',
+  sessionId: '9a962055-78ca-45ae-9fc6-6d218e58040e',
+  testerId: 'none',
+  otelCarrier: null,
+  provider: 'playwright',
+  method: 'orchestrate',
+  providedContext: '[{}]',
 }

From f969d3ff13da64bbd7a20c33f7578817c9478894 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:28:24 +0900
Subject: [PATCH 07/21] fix regex

---
 packages/ui/vite.config.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 45492ebbe202..d4cc5f148c7b 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -71,7 +71,7 @@ export default defineConfig({
       },
       async transformIndexHtml() {
         const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
-        const apiTokenPattern = /window\.VITEST_API_TOKEN = "\w+"/
+        const apiTokenPattern = /window\.VITEST_API_TOKEN\s*=\s*"[^"]+"/
         const response = await fetch(new URL('/__vitest__/', apiOrigin))
         assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${apiOrigin}/__vitest__/`)
         const testHtml = await response.text()

From d8bd779ac8dd71457a26507acb51b3abb50c2302 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:30:32 +0900
Subject: [PATCH 08/21] fix: always generate api token

Remove the build-time UI token escape hatch and stale CI/test wiring now that local UI dev injects the real token from the Vitest UI server.

Co-authored-by: Codex <noreply@openai.com>
---
 .github/workflows/ci.yml                         | 1 -
 .github/workflows/cr.yml                         | 1 -
 .github/workflows/publish.yml                    | 1 -
 packages/ui/client/constants.ts                  | 2 +-
 packages/vitest/rollup.config.js                 | 4 ----
 packages/vitest/src/node/config/resolveConfig.ts | 2 +-
 packages/vitest/src/shims.dev.d.ts               | 5 -----
 scripts/publish-ci.ts                            | 4 ++--
 test/test-utils/index.ts                         | 2 --
 test/unit/test/cli-test.test.ts                  | 3 ---
 10 files changed, 4 insertions(+), 21 deletions(-)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 7162bdcb4993..dcf1029cdac8 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -19,7 +19,6 @@ concurrency:
 
 env:
   PLAYWRIGHT_BROWSERS_PATH: ${{ github.workspace }}/.cache/ms-playwright
-  VITEST_GENERATE_UI_TOKEN: 'true'
 
 jobs:
   lint:
diff --git a/.github/workflows/cr.yml b/.github/workflows/cr.yml
index 07075c88b9f1..e953b2e8a0fe 100644
--- a/.github/workflows/cr.yml
+++ b/.github/workflows/cr.yml
@@ -41,7 +41,6 @@ jobs:
       - name: Build
         run: pnpm build
         env:
-          VITEST_GENERATE_UI_TOKEN: 'true'
           VITE_TEST_WATCHER_DEBUG: 'false'
 
       - name: Publish to StackBlitz
diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml
index bee9a3d2523a..1aa5ea80c3ad 100644
--- a/.github/workflows/publish.yml
+++ b/.github/workflows/publish.yml
@@ -10,7 +10,6 @@ permissions:
   id-token: write
 
 env:
-  VITEST_GENERATE_UI_TOKEN: 'true'
   VITE_TEST_WATCHER_DEBUG: 'false'
 
 jobs:
diff --git a/packages/ui/client/constants.ts b/packages/ui/client/constants.ts
index bd4db857be19..3e14532c189c 100644
--- a/packages/ui/client/constants.ts
+++ b/packages/ui/client/constants.ts
@@ -2,6 +2,6 @@ export const PORT = import.meta.hot ? (import.meta.env.VITE_PORT || '51204') : l
 export const HOST = [location.hostname, PORT].filter(Boolean).join(':')
 export const ENTRY_URL = `${
   location.protocol === 'https:' ? 'wss:' : 'ws:'
-}//${HOST}/__vitest_api__?token=${(window as any).VITEST_API_TOKEN || '0'}`
+}//${HOST}/__vitest_api__?token=${(window as any).VITEST_API_TOKEN}`
 export const isReport = !!window.METADATA_PATH
 export const BASE_PATH = isReport ? import.meta.env.BASE_URL : __BASE_PATH__
diff --git a/packages/vitest/rollup.config.js b/packages/vitest/rollup.config.js
index d3e45cdc43f6..09200e35c63d 100644
--- a/packages/vitest/rollup.config.js
+++ b/packages/vitest/rollup.config.js
@@ -95,10 +95,6 @@ const plugins = [
     transform: {
       target: 'node20',
       define: {
-        // __VITEST_GENERATE_UI_TOKEN__ is set as a global to catch accidental leaking,
-        // in the release version the "if" with this condition should not be present
-        // To test strict token locally, build by e.g. `VITEST_GENERATE_UI_TOKEN=true pnpm build`
-        __VITEST_GENERATE_UI_TOKEN__: process.env.VITEST_GENERATE_UI_TOKEN === 'true' ? 'true' : 'false',
         ...(process.env.VITE_TEST_WATCHER_DEBUG === 'false'
           ? {
               'process.env.VITE_TEST_WATCHER_DEBUG': 'false',
diff --git a/packages/vitest/src/node/config/resolveConfig.ts b/packages/vitest/src/node/config/resolveConfig.ts
index 60b507c11193..a56296b3c8be 100644
--- a/packages/vitest/src/node/config/resolveConfig.ts
+++ b/packages/vitest/src/node/config/resolveConfig.ts
@@ -675,7 +675,7 @@ export function resolveConfig(
 
   // the server has been created, we don't need to override vite.server options
   const api = resolveApiServerConfig(options, defaultPort)
-  resolved.api = { ...api, token: __VITEST_GENERATE_UI_TOKEN__ ? crypto.randomUUID() : '0' }
+  resolved.api = { ...api, token: crypto.randomUUID() }
 
   if (options.related) {
     resolved.related = toArray(options.related).map(file =>
diff --git a/packages/vitest/src/shims.dev.d.ts b/packages/vitest/src/shims.dev.d.ts
index 291b2a3112f3..e69de29bb2d1 100644
--- a/packages/vitest/src/shims.dev.d.ts
+++ b/packages/vitest/src/shims.dev.d.ts
@@ -1,5 +0,0 @@
-declare global {
-  const __VITEST_GENERATE_UI_TOKEN__: boolean
-}
-
-export {}
diff --git a/scripts/publish-ci.ts b/scripts/publish-ci.ts
index e77fbc0f9eba..7f53a7897195 100644
--- a/scripts/publish-ci.ts
+++ b/scripts/publish-ci.ts
@@ -4,8 +4,8 @@ import { readFileSync } from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import { $ } from 'zx'
 
-if (process.env.VITEST_GENERATE_UI_TOKEN !== 'true' || process.env.VITE_TEST_WATCHER_DEBUG !== 'false') {
-  throw new Error(`Cannot release Vitest without VITEST_GENERATE_UI_TOKEN=${process.env.VITEST_GENERATE_UI_TOKEN} and VITE_TEST_WATCHER_DEBUG=${process.env.VITE_TEST_WATCHER_DEBUG} environment variable. `)
+if (process.env.VITE_TEST_WATCHER_DEBUG !== 'false') {
+  throw new Error(`Cannot release Vitest without VITE_TEST_WATCHER_DEBUG=${process.env.VITE_TEST_WATCHER_DEBUG} environment variable. `)
 }
 
 let version = process.argv[2]
diff --git a/test/test-utils/index.ts b/test/test-utils/index.ts
index c2d4196843df..efc0f5eae6dc 100644
--- a/test/test-utils/index.ts
+++ b/test/test-utils/index.ts
@@ -26,8 +26,6 @@ import { Cli } from './cli'
 
 // override default colors to disable them in tests
 Object.assign(tinyrainbow.default, tinyrainbow.getDefaultColors())
-// @ts-expect-error not typed global
-globalThis.__VITEST_GENERATE_UI_TOKEN__ = true
 
 export interface VitestRunnerCLIOptions {
   std?: 'inherit'
diff --git a/test/unit/test/cli-test.test.ts b/test/unit/test/cli-test.test.ts
index 86f8a2881463..c53863f701ac 100644
--- a/test/unit/test/cli-test.test.ts
+++ b/test/unit/test/cli-test.test.ts
@@ -4,9 +4,6 @@ import { ReportersMap, rolldownVersion } from 'vitest/node'
 import { createCLI, parseCLI } from '../../../packages/vitest/src/node/cli/cac.js'
 import { resolveConfig } from '../../../packages/vitest/src/node/config/resolveConfig.js'
 
-// @ts-expect-error not typed global
-globalThis.__VITEST_GENERATE_UI_TOKEN__ = true
-
 const vitestCli = createCLI()
 
 function parseArguments(commands: string, full = false) {

From b450fd6b592e88e3529fd51863cfaf0b3d8bef46 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:30:40 +0900
Subject: [PATCH 09/21] cleanup

---
 packages/vitest/src/shims.dev.d.ts | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 packages/vitest/src/shims.dev.d.ts

diff --git a/packages/vitest/src/shims.dev.d.ts b/packages/vitest/src/shims.dev.d.ts
deleted file mode 100644
index e69de29bb2d1..000000000000

From 688f360343bbcd4369cd93923931b00429c0dd6b Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:43:50 +0900
Subject: [PATCH 10/21] fix(ui): proxy browser preview state in dev

Fetch the browser runner HTML from the active browser dev server and inject its generated runner state into the UI dev page instead of relying on the manual browser.dev.js stub.

Co-authored-by: Codex <noreply@openai.com>
---
 packages/ui/CONTRIBUTING.md |  8 +++++---
 packages/ui/vite.config.ts  | 33 +++++++++++++++++++--------------
 2 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index b58b2b164db7..d795cb345ec1 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -20,8 +20,6 @@ nr test --ui --open=false --api=3200
 
 Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
 
-<!-- TODO -->
-
 To preview the browser tab, start a browser-mode test server and run the UI dev server with `BROWSER_DEV_PREVIEW=true`.
 
 ```bash
@@ -32,4 +30,8 @@ pnpm -C packages/ui test:ui --browser.headless --ui --open=false
 BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client
 ```
 
-To configure the browser state, update the `__vitest_browser_runner__` object in `browser.dev.js` with the real project name, active browser session id, and project root from the browser-mode test server.
+If the browser runner starts on a custom port, pass the printed port to the UI dev server:
+
+```bash
+VITEST_BROWSER_DEV_PORT=63315 BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client
+```
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index d4cc5f148c7b..8c20d6e7c27d 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -70,12 +70,29 @@ export default defineConfig({
         return env.command === 'serve' && env.mode !== 'test'
       },
       async transformIndexHtml() {
+        if (process.env.BROWSER_DEV_PREVIEW) {
+          const browserOrigin = `http://localhost:${process.env.VITEST_BROWSER_DEV_PORT || '63315'}`
+          const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
+          assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
+          const browserHtml = await response.text()
+          const browserScript = browserHtml.match(/<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=\s*[\s\S]*?)<\/script>/)?.[1]
+          assert(browserScript, 'Failed to extract browser runner state from the response')
+          assert(!browserScript.includes('sessionId: "none"'), 'Browser runner session is not active')
+          return [
+            {
+              tag: 'script',
+              attrs: { type: 'module' },
+              children: browserScript,
+              injectTo: 'head-prepend',
+            },
+          ]
+        }
+
         const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
-        const apiTokenPattern = /window\.VITEST_API_TOKEN\s*=\s*"[^"]+"/
         const response = await fetch(new URL('/__vitest__/', apiOrigin))
         assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${apiOrigin}/__vitest__/`)
         const testHtml = await response.text()
-        const tokenScript = testHtml.match(apiTokenPattern)?.[0]
+        const tokenScript = testHtml.match(/<script>(window\.VITEST_API_TOKEN\s*=\s*"[^"]+")<\/script>/)?.[1]
         assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
         return [
           {
@@ -86,18 +103,6 @@ export default defineConfig({
         ]
       },
     },
-
-    // TODO
-    // uncomment to see the browser tab
-    !!process.env.BROWSER_DEV_PREVIEW && {
-      name: 'browser-dev-preview',
-      apply: 'serve',
-      transformIndexHtml() {
-        return [
-          { tag: 'script', attrs: { src: './browser.dev.js' } },
-        ]
-      },
-    },
     {
       // workaround `crossorigin` issues on some browsers
       // https://github.com/vitejs/vite/issues/6648

From 1a85777f6ade845f224c0f4eba332eecb3fc2ffb Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:46:55 +0900
Subject: [PATCH 11/21] chore(ui): rename browser dev env vars

Use shorter BROWSER_DEV and BROWSER_DEV_PORT names for the UI browser preview workflow.

Co-authored-by: Codex <noreply@openai.com>
---
 packages/ui/CONTRIBUTING.md | 6 +++---
 packages/ui/vite.config.ts  | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index d795cb345ec1..cda94047fbfa 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -20,18 +20,18 @@ nr test --ui --open=false --api=3200
 
 Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
 
-To preview the browser tab, start a browser-mode test server and run the UI dev server with `BROWSER_DEV_PREVIEW=true`.
+To preview the browser tab, start a browser-mode test server and run the UI dev server with `BROWSER_DEV=true`.
 
 ```bash
 # run browser mode test server
 pnpm -C packages/ui test:ui --browser.headless --ui --open=false
 
 # run ui dev server
-BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client
+BROWSER_DEV=true pnpm -C packages/ui dev:client
 ```
 
 If the browser runner starts on a custom port, pass the printed port to the UI dev server:
 
 ```bash
-VITEST_BROWSER_DEV_PORT=63315 BROWSER_DEV_PREVIEW=true pnpm -C packages/ui dev:client
+BROWSER_DEV_PORT=63315 BROWSER_DEV=true pnpm -C packages/ui dev:client
 ```
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 8c20d6e7c27d..a4f2519d1e59 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -70,8 +70,8 @@ export default defineConfig({
         return env.command === 'serve' && env.mode !== 'test'
       },
       async transformIndexHtml() {
-        if (process.env.BROWSER_DEV_PREVIEW) {
-          const browserOrigin = `http://localhost:${process.env.VITEST_BROWSER_DEV_PORT || '63315'}`
+        if (process.env.BROWSER_DEV) {
+          const browserOrigin = `http://localhost:${process.env.BROWSER_DEV_PORT || '63315'}`
           const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
           assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
           const browserHtml = await response.text()

From 3b9cd78bec08eefc06bfcce6f58e6e370549bf54 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:47:24 +0900
Subject: [PATCH 12/21] tweak

---
 packages/ui/CONTRIBUTING.md | 2 +-
 packages/ui/vite.config.ts  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index cda94047fbfa..2b811d9d21de 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -20,7 +20,7 @@ nr test --ui --open=false --api=3200
 
 Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
 
-To preview the browser tab, start a browser-mode test server and run the UI dev server with `BROWSER_DEV=true`.
+To preview the browser-mode UI, start a browser-mode test server and run the UI dev server with `BROWSER_DEV=true`.
 
 ```bash
 # run browser mode test server
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index a4f2519d1e59..e5fa3bd1f070 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -65,7 +65,7 @@ export default defineConfig({
     // },
 
     {
-      name: 'proxy-api-token',
+      name: 'dev-ui-script',
       apply(_config, env) {
         return env.command === 'serve' && env.mode !== 'test'
       },

From 7d22f6939a462b8a2cae3e4b8c1bb0fc2669756c Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 15:57:08 +0900
Subject: [PATCH 13/21] wip

---
 packages/ui/CONTRIBUTING.md | 40 ++++++++++++++++++++++++++-----------
 packages/ui/vite.config.ts  |  2 +-
 2 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 2b811d9d21de..ff16ad8a6a32 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -1,37 +1,53 @@
-At project root, create terminals with each of the following commands:
+# @vitest/ui Development
+
+## UI
+
+Use this setup for developing UI features with Vite HMR. It serves the UI from a separate dev server, so it can differ from the exact `vitest --ui` runtime path.
+
+Start the UI dev server:
 
 ```bash
-nr ui:dev
+pnpm -C packages/ui dev:client
 ```
 
+Start a Vitest server that serves the real UI and API token used by the dev server:
+
 ```bash
-nr test --ui --open=false
+pnpm test --ui --open=false
 ```
 
-As the last command, you can use any of the available tests suites instead. Make sure that they run at 51204 port or specify a custom port with `VITE_PORT` environmental variable when running the first command. For example,
+Open the URL printed by the UI dev server, usually `http://localhost:5173/`.
+
+The UI dev server connects to the Vitest server on port `51204` by default. If the Vitest server uses another API port, pass the same port to the UI dev server:
 
 ```bash
-VITE_PORT=3200 nr ui:dev
+VITE_PORT=3200 pnpm -C packages/ui dev:client
 ```
 
 ```bash
-nr test --ui --open=false --api=3200
+pnpm test --ui --open=false --api=3200
 ```
 
-Open the browser at the URL printed by the first command. For example, `http://localhost:5173/`. If you see a connection error, it means the port is specified incorrectly.
+## Browser Mode UI
 
-To preview the browser-mode UI, start a browser-mode test server and run the UI dev server with `BROWSER_DEV=true`.
+Use this setup for developing Browser Mode UI features with Vite HMR. It serves the Browser Mode UI from the UI dev server and injects state from a real browser-mode Vitest server.
+
+Start a browser-mode Vitest server:
 
 ```bash
-# run browser mode test server
 pnpm -C packages/ui test:ui --browser.headless --ui --open=false
+```
+
+Start the UI dev server in browser preview mode:
 
-# run ui dev server
+```bash
 BROWSER_DEV=true pnpm -C packages/ui dev:client
 ```
 
-If the browser runner starts on a custom port, pass the printed port to the UI dev server:
+Open the URL printed by the UI dev server, usually `http://localhost:5173/`.
+
+The UI dev server fetches browser runner state from the browser runner server on port `63315` by default. If Vitest prints a different browser runner port, pass it to the UI dev server:
 
 ```bash
-BROWSER_DEV_PORT=63315 BROWSER_DEV=true pnpm -C packages/ui dev:client
+BROWSER_DEV_PORT=63316 BROWSER_DEV=true pnpm -C packages/ui dev:client
 ```
diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index e5fa3bd1f070..432af56268c6 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -75,7 +75,7 @@ export default defineConfig({
           const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
           assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
           const browserHtml = await response.text()
-          const browserScript = browserHtml.match(/<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=\s*[\s\S]*?)<\/script>/)?.[1]
+          const browserScript = browserHtml.match(/<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=[\s\S]*?)<\/script>/)?.[1]
           assert(browserScript, 'Failed to extract browser runner state from the response')
           assert(!browserScript.includes('sessionId: "none"'), 'Browser runner session is not active')
           return [

From f55780a9688139c00bfc38453edaef0e20d19550 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:03:12 +0900
Subject: [PATCH 14/21] polish

---
 packages/ui/CONTRIBUTING.md | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index ff16ad8a6a32..895726fcc68d 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -7,25 +7,27 @@ Use this setup for developing UI features with Vite HMR. It serves the UI from a
 Start the UI dev server:
 
 ```bash
-pnpm -C packages/ui dev:client
+VITE_PORT=3023 pnpm -C packages/ui dev:client
 ```
 
-Start a Vitest server that serves the real UI and API token used by the dev server:
+Start a Vitest UI/API server for any test project you want to use as the backend. For example, from the repository root this runs the `test/unit` suite with UI enabled:
 
 ```bash
 pnpm test --ui --open=false
 ```
 
+The UI dev server only needs a real Vitest UI/API server to connect to; the backend can be `test/unit`, `packages/ui`, or another suite.
+
 Open the URL printed by the UI dev server, usually `http://localhost:5173/`.
 
-The UI dev server connects to the Vitest server on port `51204` by default. If the Vitest server uses another API port, pass the same port to the UI dev server:
+The UI dev server connects to the Vitest UI/API server on port `51204` by default. If that server uses another API port, pass the same port to the UI dev server:
 
 ```bash
-VITE_PORT=3200 pnpm -C packages/ui dev:client
+VITE_PORT=12345 pnpm -C packages/ui dev:client
 ```
 
 ```bash
-pnpm test --ui --open=false --api=3200
+pnpm test --ui --open=false --api=12345
 ```
 
 ## Browser Mode UI

From d98b5a6430ebdf5adaefae7d2ace1ad1348161ec Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:03:37 +0900
Subject: [PATCH 15/21] cleanup

---
 packages/ui/browser.dev.js | 33 ---------------------------------
 1 file changed, 33 deletions(-)
 delete mode 100644 packages/ui/browser.dev.js

diff --git a/packages/ui/browser.dev.js b/packages/ui/browser.dev.js
deleted file mode 100644
index 2dd90abc3265..000000000000
--- a/packages/ui/browser.dev.js
+++ /dev/null
@@ -1,33 +0,0 @@
-window.__vitest_browser_runner__ = {
-  // files: [],
-  // runningFiles: [],
-  // config: {
-  //   name: '',
-  //   browser: {
-  //     name: 'chromium',
-  //   },
-  // },
-  // provider: 'playwright',
-  // method: 'orchestrate',
-  // type: 'orchestrator',
-  // sessionId: '<real active browser session id>',
-  // testerId: 'none',
-  // viteConfig: {
-  //   root: '/home/hiroshi/code/others/vitest/packages/ui',
-  // },
-  // providedContext: '{}',
-  disposeExceptionTracker: () => {},
-  wrapModule: f => f(),
-  wrapDynamicImport: f => f(),
-  disposeExceptionTracker: () => {},
-  cleanups: [],
-  config: { mode: 'test', isolate: true, defines: { __BASE_PATH__: '/__vitest__/' }, taskTitleValueFormatTruncate: 40, setupFiles: [], allowOnly: true, testTimeout: 15000, hookTimeout: 30000, clearMocks: false, mockReset: false, restoreMocks: false, unstubEnvs: false, unstubGlobals: false, maxConcurrency: 5, pool: 'forks', expect: {}, snapshotSerializers: [], api: { allowExec: true, allowWrite: true }, disableConsoleIntercept: false, root: '/home/hiroshi/code/others/vitest/packages/ui', name: 'chromium', globals: false, coverage: { reportsDirectory: '/home/hiroshi/code/others/vitest/packages/ui/coverage', provider: 'v8', enabled: false, autoAttachSubprocess: false }, fakeTimers: { loopLimit: 10000, shouldClearNativeTimers: true }, deps: { web: { transformAssets: true, transformCss: true, transformGlobPattern: [] }, optimizer: { ssr: { enabled: false }, client: { enabled: false } }, moduleDirectories: ['/node_modules/', '/packages/'] }, snapshotOptions: { updateSnapshot: 'new', snapshotFormat: {}, expand: false }, sequence: { hooks: 'stack' }, inspector: { enabled: false, waitForDebugger: false }, detectAsyncLeaks: false, watch: true, env: { BASE_URL: '/', MODE: 'test', DEV: true, PROD: false, VITEST_BROWSER_DEBUG: '' }, browser: { name: 'chromium', headless: true, isolate: true, fileParallelism: true, ui: false, detailsPanelPosition: 'bottom', viewport: { width: 414, height: 896 }, screenshotFailures: true, locators: { testIdAttribute: 'data-testid', exact: false }, providerOptions: { actionTimeout: 5000 }, trackUnhandledErrors: true, trace: 'off', traceView: { enabled: true, recordCanvas: false, inlineImages: false } }, serializedDefines: '', experimental: { fsModuleCache: false, importDurations: { print: false, failOnDanger: false, limit: 10, thresholds: { warn: 100, danger: 500 } }, viteModuleRunner: true, nodeLoader: true }, tags: [], strictTags: true, slowTestThreshold: 300, isAgent: false },
-  viteConfig: { root: '/home/hiroshi/code/others/vitest/packages/ui' },
-  type: 'orchestrator',
-  sessionId: '9a962055-78ca-45ae-9fc6-6d218e58040e',
-  testerId: 'none',
-  otelCarrier: null,
-  provider: 'playwright',
-  method: 'orchestrate',
-  providedContext: '[{}]',
-}

From 78bee92c02caf0ccc8c18afc268063ade9889f8c Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:04:24 +0900
Subject: [PATCH 16/21] cleanup

---
 packages/ui/CONTRIBUTING.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 895726fcc68d..5f3af4a2f3ab 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -7,6 +7,7 @@ Use this setup for developing UI features with Vite HMR. It serves the UI from a
 Start the UI dev server:
 
 ```bash
+# align port with api config of test/unit/vite.config.ts
 VITE_PORT=3023 pnpm -C packages/ui dev:client
 ```
 

From 754700ef377208be4a06518dca94d7be85ced7d8 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:05:44 +0900
Subject: [PATCH 17/21] docs(ui): clarify dev server ports

Document that the default UI dev workflow points at the test/unit API port and explain how to align custom backend ports.

Co-authored-by: Codex <noreply@openai.com>
---
 packages/ui/CONTRIBUTING.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/ui/CONTRIBUTING.md b/packages/ui/CONTRIBUTING.md
index 5f3af4a2f3ab..c22b3e26f064 100644
--- a/packages/ui/CONTRIBUTING.md
+++ b/packages/ui/CONTRIBUTING.md
@@ -7,7 +7,7 @@ Use this setup for developing UI features with Vite HMR. It serves the UI from a
 Start the UI dev server:
 
 ```bash
-# align port with api config of test/unit/vite.config.ts
+# Align with the API port configured in test/unit/vite.config.ts.
 VITE_PORT=3023 pnpm -C packages/ui dev:client
 ```
 
@@ -21,7 +21,7 @@ The UI dev server only needs a real Vitest UI/API server to connect to; the back
 
 Open the URL printed by the UI dev server, usually `http://localhost:5173/`.
 
-The UI dev server connects to the Vitest UI/API server on port `51204` by default. If that server uses another API port, pass the same port to the UI dev server:
+The UI dev server connects to the Vitest UI/API server on port `51204` by default. The root `test/unit` suite uses port `3023`, so the command above sets `VITE_PORT=3023`. If you use another backend port, pass the same port to the UI dev server:
 
 ```bash
 VITE_PORT=12345 pnpm -C packages/ui dev:client

From 80c99f916e387b33c6a8ba06af1cd06af9b7ac0c Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:09:57 +0900
Subject: [PATCH 18/21] nit

---
 packages/ui/vite.config.ts | 88 +++++++++++++++++++++-----------------
 1 file changed, 48 insertions(+), 40 deletions(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 432af56268c6..c1e296e5cb5a 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -1,3 +1,4 @@
+import type { Plugin } from 'vite'
 import assert from 'node:assert'
 import Vue from '@vitejs/plugin-vue'
 import { resolve } from 'pathe'
@@ -55,6 +56,7 @@ export default defineConfig({
     Pages({
       dirs: ['client/pages'],
     }),
+    devUiScriptPlugin(),
     // uncomment to see the HTML reporter preview
     // {
     //   name: 'debug-html-report',
@@ -63,46 +65,6 @@ export default defineConfig({
     //     return html.replace('<!-- !LOAD_METADATA! -->', `<script>window.METADATA_PATH="${debugLink}/html.meta.json.gz"</script>`)
     //   },
     // },
-
-    {
-      name: 'dev-ui-script',
-      apply(_config, env) {
-        return env.command === 'serve' && env.mode !== 'test'
-      },
-      async transformIndexHtml() {
-        if (process.env.BROWSER_DEV) {
-          const browserOrigin = `http://localhost:${process.env.BROWSER_DEV_PORT || '63315'}`
-          const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
-          assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
-          const browserHtml = await response.text()
-          const browserScript = browserHtml.match(/<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=[\s\S]*?)<\/script>/)?.[1]
-          assert(browserScript, 'Failed to extract browser runner state from the response')
-          assert(!browserScript.includes('sessionId: "none"'), 'Browser runner session is not active')
-          return [
-            {
-              tag: 'script',
-              attrs: { type: 'module' },
-              children: browserScript,
-              injectTo: 'head-prepend',
-            },
-          ]
-        }
-
-        const apiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
-        const response = await fetch(new URL('/__vitest__/', apiOrigin))
-        assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${apiOrigin}/__vitest__/`)
-        const testHtml = await response.text()
-        const tokenScript = testHtml.match(/<script>(window\.VITEST_API_TOKEN\s*=\s*"[^"]+")<\/script>/)?.[1]
-        assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
-        return [
-          {
-            tag: 'script',
-            children: tokenScript,
-            injectTo: 'head-prepend',
-          },
-        ]
-      },
-    },
     {
       // workaround `crossorigin` issues on some browsers
       // https://github.com/vitejs/vite/issues/6648
@@ -119,3 +81,49 @@ export default defineConfig({
     outDir: './dist/client',
   },
 })
+
+function devUiScriptPlugin(): Plugin {
+  const UI_SCRIPT_RE = /<script>(window\.VITEST_API_TOKEN\s*=\s*"[^"]+")<\/script>/
+  const BROWSER_SCRIPT_RE = /<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=[\s\S]*?)<\/script>/
+
+  const uiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
+  const browserOrigin = `http://localhost:${process.env.BROWSER_DEV_PORT || '63315'}`
+
+  return {
+    name: 'dev-ui-script',
+    apply(_config, env) {
+      return env.command === 'serve' && env.mode !== 'test'
+    },
+    async transformIndexHtml() {
+      if (process.env.BROWSER_DEV) {
+        const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
+        assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
+        const browserHtml = await response.text()
+        const browserScript = browserHtml.match(BROWSER_SCRIPT_RE)?.[1]
+        assert(browserScript, 'Failed to extract browser runner state from the response')
+        assert(!browserScript.includes('sessionId: "none"'), 'Browser runner session is not active')
+        return [
+          {
+            tag: 'script',
+            attrs: { type: 'module' },
+            children: browserScript,
+            injectTo: 'head-prepend',
+          },
+        ]
+      }
+
+      const response = await fetch(new URL('/__vitest__/', uiOrigin))
+      assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${uiOrigin}/__vitest__/`)
+      const testHtml = await response.text()
+      const tokenScript = testHtml.match(UI_SCRIPT_RE)?.[1]
+      assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
+      return [
+        {
+          tag: 'script',
+          children: tokenScript,
+          injectTo: 'head-prepend',
+        },
+      ]
+    },
+  }
+}

From 579f7cf0f27c095e96fcc4f02aa2004881272504 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:12:37 +0900
Subject: [PATCH 19/21] chore(ui): avoid assert in dev script plugin

Use explicit error checks when fetching and extracting development UI scripts.

Co-authored-by: Codex <noreply@openai.com>
---
 packages/ui/vite.config.ts | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index c1e296e5cb5a..48c89da070ff 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -1,5 +1,4 @@
 import type { Plugin } from 'vite'
-import assert from 'node:assert'
 import Vue from '@vitejs/plugin-vue'
 import { resolve } from 'pathe'
 import { presetAttributify, presetIcons, presetUno, transformerDirectives } from 'unocss'
@@ -97,11 +96,17 @@ function devUiScriptPlugin(): Plugin {
     async transformIndexHtml() {
       if (process.env.BROWSER_DEV) {
         const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
-        assert(response.ok, `Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
+        if (!response.ok) {
+          throw new Error(`Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
+        }
         const browserHtml = await response.text()
         const browserScript = browserHtml.match(BROWSER_SCRIPT_RE)?.[1]
-        assert(browserScript, 'Failed to extract browser runner state from the response')
-        assert(!browserScript.includes('sessionId: "none"'), 'Browser runner session is not active')
+        if (!browserScript) {
+          throw new Error('Failed to extract browser runner state from the response')
+        }
+        if (browserScript.includes('sessionId: "none"')) {
+          throw new Error('Browser runner session is not active')
+        }
         return [
           {
             tag: 'script',
@@ -113,10 +118,14 @@ function devUiScriptPlugin(): Plugin {
       }
 
       const response = await fetch(new URL('/__vitest__/', uiOrigin))
-      assert(response.ok, `Failed to fetch VITEST_API_TOKEN from ${uiOrigin}/__vitest__/`)
+      if (!response.ok) {
+        throw new Error(`Failed to fetch VITEST_API_TOKEN from ${uiOrigin}/__vitest__/`)
+      }
       const testHtml = await response.text()
       const tokenScript = testHtml.match(UI_SCRIPT_RE)?.[1]
-      assert(tokenScript, 'Failed to extract VITEST_API_TOKEN from the response')
+      if (!tokenScript) {
+        throw new Error('Failed to extract VITEST_API_TOKEN from the response')
+      }
       return [
         {
           tag: 'script',

From 2557f1885d467aa17b165b9ad8f60a83f4aecbc7 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:14:39 +0900
Subject: [PATCH 20/21] bloat

---
 packages/ui/vite.config.ts | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index 48c89da070ff..a1038a2d39de 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -104,9 +104,6 @@ function devUiScriptPlugin(): Plugin {
         if (!browserScript) {
           throw new Error('Failed to extract browser runner state from the response')
         }
-        if (browserScript.includes('sessionId: "none"')) {
-          throw new Error('Browser runner session is not active')
-        }
         return [
           {
             tag: 'script',

From 9cdb55acb4e23fc982a0385dd0254dd4be583535 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Wed, 6 May 2026 16:17:59 +0900
Subject: [PATCH 21/21] deslop

---
 packages/ui/vite.config.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/ui/vite.config.ts b/packages/ui/vite.config.ts
index a1038a2d39de..7f5bfee461d6 100644
--- a/packages/ui/vite.config.ts
+++ b/packages/ui/vite.config.ts
@@ -85,8 +85,8 @@ function devUiScriptPlugin(): Plugin {
   const UI_SCRIPT_RE = /<script>(window\.VITEST_API_TOKEN\s*=\s*"[^"]+")<\/script>/
   const BROWSER_SCRIPT_RE = /<script type="module">([\s\S]*?window\.__vitest_browser_runner__\s*=\s*\{[\s\S]*?window\.VITEST_API_TOKEN\s*=[\s\S]*?)<\/script>/
 
-  const uiOrigin = `http://localhost:${process.env.VITE_PORT || '51204'}`
-  const browserOrigin = `http://localhost:${process.env.BROWSER_DEV_PORT || '63315'}`
+  const uiUrl = `http://localhost:${process.env.VITE_PORT || '51204'}/__vitest__/`
+  const browserUrl = `http://localhost:${process.env.BROWSER_DEV_PORT || '63315'}/__vitest_test__/`
 
   return {
     name: 'dev-ui-script',
@@ -95,9 +95,9 @@ function devUiScriptPlugin(): Plugin {
     },
     async transformIndexHtml() {
       if (process.env.BROWSER_DEV) {
-        const response = await fetch(new URL('/__vitest_test__/', browserOrigin))
+        const response = await fetch(browserUrl)
         if (!response.ok) {
-          throw new Error(`Failed to fetch browser runner HTML from ${browserOrigin}/__vitest_test__/`)
+          throw new Error(`Failed to fetch browser runner HTML from ${browserUrl}`)
         }
         const browserHtml = await response.text()
         const browserScript = browserHtml.match(BROWSER_SCRIPT_RE)?.[1]
@@ -114,9 +114,9 @@ function devUiScriptPlugin(): Plugin {
         ]
       }
 
-      const response = await fetch(new URL('/__vitest__/', uiOrigin))
+      const response = await fetch(uiUrl)
       if (!response.ok) {
-        throw new Error(`Failed to fetch VITEST_API_TOKEN from ${uiOrigin}/__vitest__/`)
+        throw new Error(`Failed to fetch VITEST_API_TOKEN from ${uiUrl}`)
       }
       const testHtml = await response.text()
       const tokenScript = testHtml.match(UI_SCRIPT_RE)?.[1]