feat: add resolved project names to the reporter API (#7213)

Author: userquin

packages/ui/client/composables/client/index.ts

@@ -153,10 +153,11 @@ watch(
     ws.addEventListener('open', async () => {
       status.value = 'OPEN'
       client.state.filesMap.clear()
-      let [files, _config, errors] = await Promise.all([
+      let [files, _config, errors, projects] = await Promise.all([
         client.rpc.getFiles(),
         client.rpc.getConfig(),
         client.rpc.getUnhandledErrors(),
+        client.rpc.getResolvedProjectNames(),
       ])
       if (_config.standalone) {
         const filenames = await client.rpc.getTestFiles()
@@ -166,7 +167,7 @@ watch(
           return file
         })
       }
-      explorerTree.loadFiles(files)
+      explorerTree.loadFiles(files, projects)
       client.state.collectFiles(files)
       explorerTree.startRun()
       unhandledErrors.value = (errors || []).map(parseError)

packages/ui/client/composables/client/static.ts

@@ -15,6 +15,7 @@ interface HTMLReportMetadata {
   paths: string[]
   files: File[]
   config: SerializedConfig
+  projects: string[]
   moduleGraph: Record<string, Record<string, ModuleGraphData>>
   unhandledErrors: unknown[]
   // filename -> source
@@ -47,6 +48,9 @@ export function createStaticClient(): VitestClient {
     getConfig: () => {
       return metadata.config
     },
+    getResolvedProjectNames: () => {
+      return metadata.projects
+    },
     getModuleGraph: async (projectName, id) => {
       return metadata.moduleGraph[projectName]?.[id]
     },

packages/ui/client/composables/explorer/tree.ts

@@ -18,6 +18,7 @@ export class ExplorerTree {
   private rafCollector: ReturnType<typeof useRafFn>
   private resumeEndRunId: ReturnType<typeof setTimeout> | undefined
   constructor(
+    public projects: string[] = [],
     private onTaskUpdateCalled: boolean = false,
     private resumeEndTimeout = 500,
     public root = <RootTreeNode>{
@@ -53,7 +54,8 @@ export class ExplorerTree {
     this.rafCollector = useRafFn(this.runCollect.bind(this), { fpsLimit: 10, immediate: false })
   }
 
-  loadFiles(remoteFiles: File[]) {
+  loadFiles(remoteFiles: File[], projects: string[]) {
+    this.projects.splice(0, this.projects.length, ...projects)
     runLoadFiles(
       remoteFiles,
       true,

packages/ui/node/reporter.ts

@@ -35,6 +35,7 @@ interface HTMLReportData {
   paths: string[]
   files: RunnerTestFile[]
   config: SerializedConfig
+  projects: string[]
   moduleGraph: Record<string, Record<string, ModuleGraphData>>
   unhandledErrors: unknown[]
   // filename -> source
@@ -64,6 +65,7 @@ export default class HTMLReporter implements Reporter {
       files: this.ctx.state.getFiles(),
       config: this.ctx.getRootProject().serializedConfig,
       unhandledErrors: this.ctx.state.getUnhandledErrors(),
+      projects: this.ctx.resolvedProjects.map(p => p.name),
       moduleGraph: {},
       sources: {},
     }

packages/vitest/src/api/setup.ts

@@ -81,6 +81,9 @@ export function setup(ctx: Vitest, _server?: ViteDevServer) {
         getConfig() {
           return ctx.getRootProject().serializedConfig
         },
+        getResolvedProjectNames(): string[] {
+          return ctx.resolvedProjects.map(p => p.name)
+        },
         async getTransformResult(projectName: string, id, browser = false) {
           const project = ctx.getProjectByName(projectName)
           const result: TransformResultWithSource | null | undefined = browser

packages/vitest/src/api/types.ts

@@ -32,6 +32,7 @@ export interface WebSocketHandlers {
   getTestFiles: () => Promise<SerializedTestSpecification[]>
   getPaths: () => string[]
   getConfig: () => SerializedConfig
+  getResolvedProjectNames: () => string[]
   getModuleGraph: (
     projectName: string,
     id: string,

test/reporters/tests/__snapshots__/html.test.ts.snap

@@ -98,6 +98,9 @@ exports[`html reporter > resolves to "failing" status for test file "json-fail"
   "paths": [
     "<rootDir>/test/reporters/fixtures/json-fail.test.ts",
   ],
+  "projects": [
+    "",
+  ],
   "sources": {
     "<rootDir>/test/reporters/fixtures/json-fail.test.ts": "import { expect, test } from 'vitest'
 
@@ -195,6 +198,9 @@ exports[`html reporter > resolves to "passing" status for test file "all-passing
   "paths": [
     "<rootDir>/test/reporters/fixtures/all-passing-or-skipped.test.ts",
   ],
+  "projects": [
+    "",
+  ],
   "sources": {
     "<rootDir>/test/reporters/fixtures/all-passing-or-skipped.test.ts": "import { expect, test } from 'vitest'