feat(rstest): add Rstest examples (#393)

Author: fi3ework

.github/workflows/ci.yaml

@@ -31,6 +31,9 @@ jobs:
       - name: Install dependencies
         run: pnpm install
 
+      - name: Install Playwright browsers
+        run: pnpm dlx playwright install chromium
+
       - name: Build Rspack
         run: |
           pnpm build:rspack
@@ -50,3 +53,6 @@ jobs:
       - name: Build Rsdoctor
         run: |
           pnpm build:rsdoctor
+
+      - name: Test Rstest
+        run: pnpm test:rstest

.gitignore

@@ -23,6 +23,7 @@ lib-cov
 
 # Coverage directory used by tools like istanbul
 coverage
+!rstest/coverage/
 *.lcov
 
 # nyc test coverage

AGENTS.md

@@ -4,9 +4,33 @@ This file provides guidance for AI coding agents working in this repository.
 
 ## Repository Overview
 
-- This is a monorepo of example projects for the Rstack ecosystem: Rspack, Rsbuild, Rspress, Rsdoctor, and Rslib.
+- This is a monorepo of example projects for the Rstack ecosystem: Rspack, Rsbuild, Rspress, Rsdoctor, Rslib, and Rstest.
 - Package manager: `pnpm` (see `package.json#packageManager`).
-- Workspace layout: `pnpm-workspace.yaml` includes `rspack/**`, `rsbuild/**`, `rslib/**`, `rspress/**`, `rsdoctor/**`.
+- Workspace layout: `pnpm-workspace.yaml` includes `rspack/**`, `rsbuild/**`, `rslib/**`, `rspress/**`, `rsdoctor/**`, `rstest/**`.
+
+## Core Purpose of Examples
+
+**The primary goal of each example is to demonstrate "how a specific API achieves a specific effect through specific configuration".**
+
+When creating or modifying examples:
+- **Keep it minimal**: Only include code necessary to demonstrate the target feature/API
+- **Avoid over-engineering**: Don't add complex business logic that distracts from the core demonstration
+- **Focus on the tool, not the ecosystem**: For example, in a test runner example, focus on the test runner's APIs (mocking, assertions, configuration), not on complex DOM manipulation or third-party library integrations
+- **One concept per example**: Each example should ideally demonstrate one main feature or configuration pattern
+- **Clarity over completeness**: A simple, clear example is better than a comprehensive but confusing one
+
+Example of good vs bad:
+```
+# Good: Demonstrates rstest's mocking API
+- Simple mock function usage
+- Clear before/after assertions
+- Minimal setup code
+
+# Bad: Demonstrates rstest's mocking API
+- Complex React component with many interactions
+- Detailed DOM testing with @testing-library
+- Business logic mixed with test assertions
+```
 
 ## Quick Start (Local)
 

biome.json

@@ -13,11 +13,13 @@
       "**/rspress/**",
       "**/rsdoctor/**",
       "**/rslib/**",
+      "**/rstest/**",
       "!**/dist",
       "!**/dist-*",
       "!**/doc_build",
       "!**/auto-imports.d.ts",
-      "!**/components.d.ts"
+      "!**/components.d.ts",
+      "!**/__snapshots__/**"
     ],
     "ignoreUnknown": true
   },

package.json

@@ -10,10 +10,11 @@
     "build:rsdoctor": "pnpm --filter \"rsdoctor-*\" build",
     "build:rspack": "pnpm --filter \"example-*\" build",
     "test:rspack": "pnpm --filter \"example-*\" test",
+    "test:rstest": "pnpm --filter \"rstest-*\" test",
     "build:rspress": "pnpm --filter \"rspress-*\" build",
     "build:rslib": "pnpm --filter \"rslib-*\" build",
     "prepare": "husky",
-    "sort-package-json": "npx sort-package-json \"rspack/*/package.json\" \"rsbuild/*/package.json\" \"rspress/*/package.json\" \"rsdoctor/*/package.json\" \"rslib/*/package.json\""
+    "sort-package-json": "npx sort-package-json \"rspack/*/package.json\" \"rsbuild/*/package.json\" \"rspress/*/package.json\" \"rsdoctor/*/package.json\" \"rslib/*/package.json\" \"rstest/*/package.json\""
   },
   "lint-staged": {
     "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}": [

pnpm-lock.yaml

@@ -4,4 +4,5 @@ packages:
   - "rslib/**"
   - "rspress/**"
   - "rsdoctor/**"
+  - "rstest/**"
   - "!**/dist"

pnpm-workspace.yaml

@@ -0,0 +1,26 @@
+{
+  "name": "rstest-browser-rsbuild-react",
+  "version": "1.0.0",
+  "private": true,
+  "scripts": {
+    "dev": "rsbuild dev",
+    "build": "rsbuild build",
+    "test": "rstest run"
+  },
+  "devDependencies": {
+    "@rsbuild/core": "^1.4.2",
+    "@rsbuild/plugin-react": "^1.4.2",
+    "@rstest/adapter-rsbuild": "^0.1.0",
+    "@rstest/browser": "^0.7.9",
+    "@rstest/browser-react": "^0.7.9",
+    "@rstest/core": "^0.7.9",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/user-event": "^14.6.1",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
+    "playwright": "^1.57.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "typescript": "^5.8.3"
+  }
+}

rstest/browser-rsbuild-react/package.json

@@ -0,0 +1,19 @@
+import path from 'node:path';
+import { defineConfig } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+
+export default defineConfig({
+  plugins: [pluginReact()],
+  source: {
+    entry: {
+      index: './src/index.tsx',
+    },
+    alias: {
+      '@': path.resolve(__dirname, 'src'),
+      '@components': path.resolve(__dirname, 'src/components'),
+    },
+    define: {
+      __APP_VERSION__: JSON.stringify('1.0.0'),
+    },
+  },
+});

rstest/browser-rsbuild-react/rsbuild.config.ts

@@ -0,0 +1,11 @@
+import { withRsbuildConfig } from '@rstest/adapter-rsbuild';
+import { defineConfig, type ExtendConfigFn } from '@rstest/core';
+
+export default defineConfig({
+  extends: withRsbuildConfig() as ExtendConfigFn,
+  browser: {
+    enabled: true,
+    browser: 'chromium',
+    port: 3012,
+  },
+});