perf(test): default DOM tests to a light setup; isolate heavy registry setup (#2644)

Follow-up to #2641, which sharded the Vitest suite but only parallelized
its cost. This reduces the cost itself.

`setup` was the largest line item in a CI run — 990s cumulative vs 205s
of actual `tests` — because `vitest.setup.dom.tsx` side-effect imports
@object-ui/components, fields, plugin-dashboard and plugin-grid and
re-registers 9 widgets, and under `isolate: true` that module graph
re-executes for every DOM test file. Measured at ~3.3s of pure setup per
file. But an empirical run of the whole `dom` project under a trimmed
setup showed only ~20 of ~310 files actually render through the
ComponentRegistry; the other ~290 paid that 3.3s for nothing.

Split the DOM tests into two projects by need:

- `dom` (default): the new light `vitest.setup.dom-light.tsx` — base
  polyfills + jest-dom + RTL cleanup, none of the heavy package graphs.
- `dom-heavy`: the ~20 `heavyDomTests` that drive the registry, keeping
  the full `vitest.setup.dom.tsx` (which apps/console also still uses).

`heavyDomTests` was derived empirically, not guessed: every file in it
failed under the light setup (e.g. "page:card not registered"). The list
is self-correcting — a heavy test left off it lands in the light project
and fails loudly in CI, so coverage can't be silently lost, only turned
red with a pointer to the fix.

Behavior-preserving: full suite is 566 files / 6892 tests
(6868 passed, 24 skipped) both before and after, at the same commit.
Local cumulative `setup` drops from ~990s to ~167s.

Co-authored-by: Jack Zhuang <277994282+os-zhuang@users.noreply.github.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

Author: os-zhuang

vitest.config.mts

@@ -52,19 +52,66 @@ const domTsTests = [
   'packages/react/src/hooks/__tests__/useRecordSearch.test.ts',
 ];
 
+// Test files that render through the ComponentRegistry and therefore need the
+// heavy `vitest.setup.dom.tsx` (the four side-effect package imports + widget
+// re-registrations). They run in the `dom-heavy` project; every other DOM test
+// gets the trimmed `vitest.setup.dom-light.tsx` default.
+//
+// This list was derived empirically: run the whole `dom` project under the
+// light setup and every file here is one that failed (e.g. "page:card not
+// registered", or an element that never rendered). It is a small minority
+// (~20 of ~310 DOM files) — the other ~290 never touch the registry and used
+// to pay ~3.3s/file of setup for nothing.
+//
+// If a NEW test renders a schema / page:* / dashboard / grid widget and fails
+// with "<type> not registered", add it here. Misfiling is self-correcting, not
+// silent: a heavy test left out of this list lands in the light `dom` project
+// and fails loudly in CI (it can never be skipped), so coverage cannot be lost
+// — only a red build that points at the fix.
+const heavyDomTests = [
+  'packages/app-shell/src/console/ai/LiveCanvas.test.tsx',
+  'packages/app-shell/src/console/ai/__tests__/ConversationsSidebar.test.tsx',
+  'packages/app-shell/src/console/organizations/__tests__/CreateWorkspaceDialog.test.tsx',
+  'packages/app-shell/src/hooks/__tests__/useConsoleActionRuntime.test.tsx',
+  'packages/app-shell/src/layout/__tests__/AiUsageIndicator.test.tsx',
+  'packages/app-shell/src/layout/__tests__/ChatDock.test.tsx',
+  'packages/app-shell/src/preview/__tests__/DraftChangesPanel.test.tsx',
+  'packages/app-shell/src/preview/__tests__/DraftPreviewBar.test.tsx',
+  'packages/app-shell/src/views/metadata-admin/AccessExplainPanel.test.tsx',
+  'packages/app-shell/src/views/metadata-admin/AssignedUsersSection.test.tsx',
+  'packages/app-shell/src/views/metadata-admin/previews/DatasetPreview.test.tsx',
+  'packages/app-shell/src/views/metadata-admin/previews/PagePreview.test.tsx',
+  'packages/app-shell/src/views/metadata-admin/previews/ReportPreview.dataset.test.tsx',
+  'packages/components/src/__tests__/action-bar.test.tsx',
+  'packages/components/src/__tests__/page-card-i18n-title.test.tsx',
+  'packages/components/src/__tests__/page-header-actions.test.tsx',
+  'packages/components/src/__tests__/page-header-title.test.tsx',
+  'packages/plugin-calendar/src/registration.test.tsx',
+  'packages/plugin-dashboard/src/__tests__/DashboardRenderer.designMode.test.tsx',
+  'packages/plugin-kanban/src/registration.test.tsx',
+];
+
 export default defineConfig({
   test: {
     globals: true,
     environment: 'happy-dom',
     testTimeout: 15000, // Increase default timeout for integration tests with MSW
     exclude: sharedExclude,
-    // Two root-level projects split by environment cost. The heavy DOM setup
-    // (vitest.setup.dom.tsx imports @object-ui/components / fields /
-    // plugin-dashboard / plugin-grid from source and re-registers widgets)
-    // used to run for EVERY file: with `isolate: true` that module graph
-    // re-executes per file, and a CI run spent ~20 min cumulative in setup
-    // for ~2 min of actual tests. Pure-logic *.test.ts files now run in the
-    // `unit` project: node env + vitest.setup.base.ts only.
+    // Three root-level projects split by environment cost.
+    //
+    // - `unit`: pure-logic *.test.ts in node env + vitest.setup.base.ts only.
+    // - `dom`: React tests in happy-dom with the LIGHT setup — jsdom polyfills,
+    //   jest-dom and RTL cleanup, but none of the @object-ui/components / fields
+    //   / plugin-dashboard / plugin-grid graphs.
+    // - `dom-heavy`: the ~20 `heavyDomTests` that render through the
+    //   ComponentRegistry, with the full `vitest.setup.dom.tsx`.
+    //
+    // Why the split: with `isolate: true` every setup import re-executes per
+    // file. The old single DOM setup pulled the four heavy package graphs into
+    // every one of ~300 DOM files (~3.3s/file of setup) even though ~290 never
+    // touch the registry — a CI run spent ~20 min cumulative in setup for ~3
+    // min of actual tests. Restricting that graph to the files that need it
+    // leaves the common case paying only the light setup.
     //
     // (The former `environmentMatchGlobs` split silently stopped working on
     // Vitest 4 — the option was removed — so every file was paying happy-dom
@@ -89,12 +136,24 @@ export default defineConfig({
         test: {
           name: 'dom',
           environment: 'happy-dom',
-          setupFiles: [path.resolve(__dirname, 'vitest.setup.dom.tsx')],
+          setupFiles: [path.resolve(__dirname, 'vitest.setup.dom-light.tsx')],
           include: [
             'packages/**/*.test.tsx',
             'examples/**/*.test.tsx',
             ...domTsTests,
           ],
+          // heavyDomTests render through the registry — they run in `dom-heavy`
+          // with the full setup, so keep them out of the light project.
+          exclude: [...sharedExclude, ...heavyDomTests],
+        },
+      },
+      {
+        extends: true,
+        test: {
+          name: 'dom-heavy',
+          environment: 'happy-dom',
+          setupFiles: [path.resolve(__dirname, 'vitest.setup.dom.tsx')],
+          include: [...heavyDomTests],
         },
       },
       path.resolve(__dirname, './apps/console/vitest.config.ts'),

vitest.setup.dom-light.tsx

@@ -0,0 +1,38 @@
+/**
+ * ObjectUI — light DOM test setup (default for the `dom` project)
+ *
+ * Just enough to render a React component with @testing-library: jsdom-ish
+ * polyfills (via vitest.setup.base), jest-dom matchers, and RTL auto-cleanup.
+ * It deliberately does NOT import @object-ui/components / fields /
+ * plugin-dashboard / plugin-grid or re-register any widgets.
+ *
+ * Under `isolate: true` every setup import re-executes per test file, and the
+ * old single DOM setup pulled those four package graphs into ~300 files that
+ * mostly never render through the ComponentRegistry — ~3.3s of pure setup per
+ * file. Tests that DO drive the registry (SchemaRenderer, or page / dashboard /
+ * grid widgets) run in the `dom-heavy` project instead, which keeps the full
+ * `vitest.setup.dom.tsx`. See `heavyDomTests` in vitest.config.mts.
+ *
+ * If a test renders a component that resolves other components by type and you
+ * see "<type> not registered" or an element that never appears, it belongs in
+ * `heavyDomTests`, not here.
+ */
+
+import './vitest.setup.base';
+import '@testing-library/jest-dom';
+import { afterEach } from 'vitest';
+import { cleanup } from '@testing-library/react';
+
+// RTL installs its auto-cleanup afterEach only on first import; with modules
+// cached across files in a worker, later files would accumulate DOM nodes.
+// Register cleanup here so every test file gets an unmount.
+afterEach(() => {
+  cleanup();
+});
+
+// jsdom/happy-dom do not implement Element.prototype.scrollIntoView; some
+// components call it inside effects. Polyfill as a no-op so component tests
+// don't throw inside React's commit phase.
+if (typeof Element !== 'undefined' && !Element.prototype.scrollIntoView) {
+  Element.prototype.scrollIntoView = function () {};
+}

vitest.setup.dom.tsx

@@ -1,14 +1,16 @@
 /**
- * ObjectUI — DOM test setup
+ * ObjectUI — heavy DOM test setup (the `dom-heavy` project + apps/console)
  *
- * Heavy setup for tests that render React components. Registers ObjectUI
+ * For tests that render through the ComponentRegistry. Registers ObjectUI
  * component widgets (text, email, password, textarea, image, html, avatar,
  * select, slider, grid) and pulls in @object-ui/components, @object-ui/fields,
  * @object-ui/plugin-dashboard, @object-ui/plugin-grid for their side-effect
  * registrations.
  *
- * Pure-logic unit tests should use `vitest.setup.base.ts` instead to avoid
- * paying this boot cost.
+ * This graph is expensive (~3.3s/file under `isolate: true`), so it is NOT the
+ * default. Most `dom` tests use the trimmed `vitest.setup.dom-light.tsx`; only
+ * the files listed in `heavyDomTests` (vitest.config.mts) run here. Pure-logic
+ * unit tests use `vitest.setup.base.ts`.
  */
 
 import './vitest.setup.base';