From d0bf89d377a9c4c206aad7dbe9c76c80ec3a49f0 Mon Sep 17 00:00:00 2001
From: Hiroshi Ogawa <hi.ogawa.zz@gmail.com>
Date: Thu, 26 Sep 2024 18:46:10 +0900
Subject: [PATCH] fix(ui): list tests on ui when `--standalone` (#6577)

---
 .../ui/client/composables/client/index.ts     | 17 ++++----
 test/ui/test/ui.spec.ts                       | 43 +++++++++++++++++++
 2 files changed, 51 insertions(+), 9 deletions(-)

diff --git a/packages/ui/client/composables/client/index.ts b/packages/ui/client/composables/client/index.ts
index cf5a679ecbb2..ebb629e6ef33 100644
--- a/packages/ui/client/composables/client/index.ts
+++ b/packages/ui/client/composables/client/index.ts
@@ -130,23 +130,22 @@ watch(
     ws.addEventListener('open', async () => {
       status.value = 'OPEN'
       client.state.filesMap.clear()
-      const [remoteFiles, _config, errors] = await Promise.all([
+      let [files, _config, errors] = await Promise.all([
         client.rpc.getFiles(),
         client.rpc.getConfig(),
         client.rpc.getUnhandledErrors(),
       ])
       if (_config.standalone) {
         const filenames = await client.rpc.getTestFiles()
-        const files = filenames.map<File>(([{ name, root }, filepath]) => {
-          return /* #__PURE__ */ createFileTask(filepath, root, name)
+        files = filenames.map(([{ name, root }, filepath]) => {
+          const file = createFileTask(filepath, root, name)
+          file.mode = 'skip'
+          return file
         })
-        client.state.collectFiles(files)
-      }
-      else {
-        explorerTree.loadFiles(remoteFiles)
-        client.state.collectFiles(remoteFiles)
-        explorerTree.startRun()
       }
+      explorerTree.loadFiles(files)
+      client.state.collectFiles(files)
+      explorerTree.startRun()
       unhandledErrors.value = (errors || []).map(parseError)
       config.value = _config
     })
diff --git a/test/ui/test/ui.spec.ts b/test/ui/test/ui.spec.ts
index d8d293805c57..f042de6aa78e 100644
--- a/test/ui/test/ui.spec.ts
+++ b/test/ui/test/ui.spec.ts
@@ -138,3 +138,46 @@ test.describe('ui', () => {
     await expect(page.getByTestId('details-panel').getByText('fixtures/task-name.test.ts', { exact: true })).toBeVisible()
   })
 })
+
+test.describe('standalone', () => {
+  let vitest: Vitest | undefined
+
+  test.beforeAll(async () => {
+    // silence Vitest logs
+    const stdout = new Writable({ write: (_, __, callback) => callback() })
+    const stderr = new Writable({ write: (_, __, callback) => callback() })
+    vitest = await startVitest('test', [], {
+      watch: true,
+      ui: true,
+      standalone: true,
+      open: false,
+      api: { port },
+      reporters: [],
+    }, {}, {
+      stdout,
+      stderr,
+    })
+    expect(vitest).toBeDefined()
+  })
+
+  test.afterAll(async () => {
+    await vitest?.close()
+  })
+
+  test('basic', async ({ page }) => {
+    await page.goto(pageUrl)
+
+    // initially no stats
+    await expect(page.locator('[aria-labelledby=tests]')).toContainText('0 Pass 0 Fail 0 Total')
+
+    // run single file
+    await page.getByText('fixtures/sample.test.ts').hover()
+    await page.getByRole('button', { name: 'Run current test' }).click()
+
+    // check results
+    await page.getByText('PASS (1)').click()
+    expect(vitest?.state.getFiles().map(f => [f.name, f.result?.state])).toEqual([
+      ['fixtures/sample.test.ts', 'pass'],
+    ])
+  })
+})