feat: support displaying slow-running tests (#706)

Co-authored-by: Copilot <[email protected]>

Author: 9aoy

e2e/reporter/index.test.ts

@@ -71,7 +71,12 @@ describe.concurrent('reporters', () => {
     });
 
     await cli.exec;
+    expect(cli.stdout).toContain('[custom reporter] onTestCaseStart');
+    expect(
+      cli.stdout.match(/\[custom reporter\] onTestCaseStart/g)?.length,
+    ).toBe(3);
     expect(cli.stdout).toContain('[custom reporter] onTestFileStart');
+
     expect(
       cli.stdout.match(/\[custom reporter\] onTestCaseResult/g)?.length,
     ).toBe(3);

e2e/reporter/rstest.customReporterConfig.ts

@@ -1,5 +1,6 @@
 import type {
   Reporter,
+  TestCaseInfo,
   TestFileInfo,
   TestFileResult,
   TestResult,
@@ -13,6 +14,10 @@ class MyReporter implements Reporter {
     reporterResult.push('[custom reporter] onTestFileStart');
   }
 
+  onTestCaseStart(_test: TestCaseInfo) {
+    reporterResult.push('[custom reporter] onTestCaseStart');
+  }
+
   onTestCaseResult(_result: TestResult) {
     reporterResult.push('[custom reporter] onTestCaseResult');
   }

examples/node/test/index.test.ts

@@ -1,8 +1,6 @@
-import { describe, expect, it, rs } from '@rstest/core';
+import { describe, expect, it } from '@rstest/core';
 import { sayHi } from '../src/index';
 
-const config = rs.getConfig();
-console.log(config);
 describe('Index', () => {
   it('should add two numbers correctly', () => {
     expect(1 + 1).toBe(2);

packages/core/rslib.config.ts

@@ -104,6 +104,7 @@ export default defineConfig({
       id: 'rstest_loaders',
       format: 'esm',
       syntax: 'es2021',
+      dts: false,
       source: {
         entry: {
           cssFilterLoader: './src/core/plugins/css-filter/loader.ts',
@@ -116,6 +117,9 @@ export default defineConfig({
       },
     },
   ],
+  performance: {
+    printFileSize: !isBuildWatch,
+  },
   tools: {
     rspack: {
       watchOptions: {

packages/core/src/index.ts

@@ -73,6 +73,7 @@ export type {
   RstestCommand,
   RstestExpect as Expect,
   RstestUtilities,
+  TestCaseInfo,
   TestFileInfo,
   TestFileResult,
   TestResult,

packages/core/src/pool/index.ts

@@ -8,6 +8,7 @@ import type {
   RstestContext,
   RuntimeConfig,
   Test,
+  TestCaseInfo,
   TestFileInfo,
   TestFileResult,
   TestResult,
@@ -200,6 +201,11 @@ export const createPool = async ({
   });
 
   const rpcMethods = {
+    onTestCaseStart: async (test: TestCaseInfo) => {
+      Promise.all(
+        reporters.map((reporter) => reporter.onTestCaseStart?.(test)),
+      );
+    },
     onTestCaseResult: async (result: TestResult) => {
       context.stateManager.onTestCaseResult(result);
       await Promise.all(
@@ -291,6 +297,7 @@ export const createPool = async ({
             .catch((err: unknown) => {
               (err as any).fullStack = true;
               return {
+                testId: '0',
                 project: projectName,
                 testPath: entryInfo.testPath,
                 status: 'fail',

packages/core/src/reporter/index.ts

@@ -7,6 +7,7 @@ import type {
   NormalizedConfig,
   Reporter,
   SnapshotSummary,
+  TestCaseInfo,
   TestFileInfo,
   TestFileResult,
   TestResult,
@@ -69,6 +70,10 @@ export class DefaultReporter implements Reporter {
     this.statusRenderer?.onTestCaseResult(result);
   }
 
+  onTestCaseStart(test: TestCaseInfo): void {
+    this.statusRenderer?.onTestCaseStart(test);
+  }
+
   onUserConsoleLog(log: UserConsoleLog): void {
     const shouldLog = this.config.onConsoleLog?.(log.content) ?? true;
 

packages/core/src/reporter/statusRenderer.ts

@@ -1,6 +1,12 @@
 import { relative } from 'pathe';
-import type { TestFileResult, TestResult } from '../types';
-import { color, prettyTestPath, prettyTime } from '../utils';
+import type { TestCaseInfo, TestFileResult, TestResult } from '../types';
+import {
+  color,
+  getTaskNameWithPrefix,
+  POINTER,
+  prettyTestPath,
+  prettyTime,
+} from '../utils';
 import {
   DurationLabel,
   getSummaryStatusString,
@@ -12,7 +18,10 @@ import { WindowRenderer } from './windowedRenderer';
 export class StatusRenderer {
   private rootPath: string;
   private renderer: WindowRenderer;
-  private runningModules = new Map<string, TestResult[]>();
+  private runningModules = new Map<
+    string,
+    { runningTests: TestCaseInfo[]; results: TestResult[] }
+  >();
   private testModules: TestFileResult[] = [];
   private startTime: number | undefined = undefined;
 
@@ -32,13 +41,32 @@ export class StatusRenderer {
 
   getContent(): string[] {
     this.startTime ??= Date.now();
+    const now = Date.now();
     const summary = [];
-    for (const module of this.runningModules.keys()) {
+
+    // only display running tests if they have been running for more than 2 seconds
+    const shouldDisplayRunningTests = (runningTests: TestCaseInfo[]) => {
+      return (
+        runningTests[0]?.startTime && now - runningTests[0].startTime > 2000
+      );
+    };
+
+    for (const [module, { runningTests }] of this.runningModules.entries()) {
       const relativePath = relative(this.rootPath, module);
       summary.push(
         `${color.bgYellow(color.bold(' RUNS '))} ${prettyTestPath(relativePath)}`,
       );
+      if (runningTests.length && shouldDisplayRunningTests(runningTests)) {
+        let caseLog = ` ${color.gray(POINTER)} ${getTaskNameWithPrefix(runningTests[0]!)} ${color.magenta(prettyTime(now - runningTests[0]!.startTime!))}`;
+
+        if (runningTests.length > 1) {
+          caseLog += color.gray(` and ${runningTests.length - 1} more cases`);
+        }
+
+        summary.push(caseLog);
+      }
     }
+
     summary.push('');
 
     if (this.testModules.length === 0) {
@@ -50,7 +78,7 @@ export class StatusRenderer {
     }
 
     const testResults: TestResult[] = Array.from(this.runningModules.values())
-      .flat()
+      .flatMap(({ results }) => results)
       .concat(this.testModules.flatMap((mod) => mod.results));
 
     if (testResults.length) {
@@ -67,15 +95,48 @@ export class StatusRenderer {
   }
 
   onTestFileStart(testPath: string): void {
-    this.runningModules.set(testPath, []);
+    this.runningModules.set(testPath, { runningTests: [], results: [] });
     this.renderer?.schedule();
   }
 
   onTestCaseResult(result: TestResult): void {
-    this.runningModules.set(result.testPath, [
-      ...(this.runningModules.get(result.testPath) || []),
-      result,
-    ]);
+    const currentModule = this.runningModules.get(result.testPath);
+    if (!currentModule) {
+      this.runningModules.set(result.testPath, {
+        runningTests: [],
+        results: [result],
+      });
+    } else {
+      // Find and remove the test from runningTests by matching testId
+      const filteredRunningTests = currentModule.runningTests.filter(
+        (t) => t.testId !== result.testId,
+      );
+      this.runningModules.set(result.testPath, {
+        runningTests: filteredRunningTests,
+        results: [...currentModule.results, result],
+      });
+    }
+
+    this.renderer?.schedule();
+  }
+
+  onTestCaseStart(test: TestCaseInfo): void {
+    const currentModule = this.runningModules.get(test.testPath);
+    if (!currentModule) {
+      this.runningModules.set(test.testPath, {
+        runningTests: [test],
+        results: [],
+      });
+    } else {
+      // Remove from runningTests if it exists (for restart scenarios)
+      const filteredRunningTests = currentModule.runningTests.filter(
+        (t) => t.testId !== test.testId,
+      );
+      this.runningModules.set(test.testPath, {
+        runningTests: [...filteredRunningTests, test],
+        results: currentModule.results,
+      });
+    }
   }
 
   onTestFileResult(test: TestFileResult): void {

packages/core/src/reporter/summary.ts

@@ -26,6 +26,7 @@ import {
   formatTestPath,
   getTaskNameWithPrefix,
   logger,
+  POINTER,
   prettyTestPath,
   prettyTime,
   TEST_DELIMITER,
@@ -89,7 +90,6 @@ export const printSnapshotSummaryLog = (
       );
     }
   }
-  const POINTER = '➜';
 
   if (snapshots.filesRemovedList?.length) {
     const [head, ...tail] = snapshots.filesRemovedList;

packages/core/src/runtime/api/snapshot.ts

@@ -141,7 +141,7 @@ function getTestNames(test: TestCase) {
   return {
     filepath: test.testPath,
     name: getTaskNameWithPrefix(test),
-    // testId: test.id,
+    testId: test.testId,
   };
 }