test: set IS_REACT_ACT_ENVIRONMENT once per package in a vitest setup file

apps/ai-studio/src/components/visualize/copy-result-button.spec.tsx

@@ -9,12 +9,6 @@ vi.mock('../../utils/export-visualization', () => ({
   copyResult: vi.fn(),
 }));
 
-declare global {
-  // eslint-disable-next-line no-var
-  var IS_REACT_ACT_ENVIRONMENT: boolean;
-}
-globalThis.IS_REACT_ACT_ENVIRONMENT = true;
-
 async function click(button: HTMLButtonElement) {
   await act(async () => {
     button.dispatchEvent(new MouseEvent('click', { bubbles: true }));

apps/ai-studio/types.d.ts

@@ -0,0 +1,7 @@
+declare global {
+  // React reads this flag to know the test environment wraps updates in act(); vitest.setup.ts sets it.
+  // eslint-disable-next-line no-var
+  var IS_REACT_ACT_ENVIRONMENT: boolean;
+}
+
+export {};

apps/ai-studio/vite.config.mts

@@ -37,6 +37,7 @@ export default defineConfig(() => {
     test: {
       globals: true,
       environment: 'jsdom',
+      setupFiles: ['./vitest.setup.ts'],
     },
   };
 });

apps/ai-studio/vitest.setup.ts

@@ -0,0 +1 @@
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;

packages/ui/src/components/button/nav-button/nav-button.spec.tsx

@@ -3,8 +3,6 @@ import { type Root, createRoot } from 'react-dom/client';
 
 import { NavButton } from './nav-button';
 
-(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
 let container: HTMLDivElement;
 let root: Root;
 

packages/ui/src/components/menu/menu.spec.tsx

@@ -4,8 +4,6 @@ import { afterEach, beforeEach, describe, expect, it } from 'vitest';
 
 import { Menu } from './menu';
 
-(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
 let container: HTMLDivElement;
 let root: Root;
 

packages/ui/src/components/node/node-description/node-description.spec.tsx

@@ -3,8 +3,6 @@ import { type Root, createRoot } from 'react-dom/client';
 
 import { NodeDescription } from './node-description';
 
-(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
 let container: HTMLDivElement;
 let root: Root;
 

packages/ui/src/components/node/node-panel/node-panel.spec.tsx

@@ -4,8 +4,6 @@ import { afterEach, beforeEach, describe, expect, it } from 'vitest';
 
 import { NodePanel } from './node-panel';
 
-(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
 let container: HTMLDivElement;
 let root: Root;
 

packages/ui/src/components/segment-picker/segment-picker.spec.tsx

@@ -3,8 +3,6 @@ import { type Root, createRoot } from 'react-dom/client';
 
 import { SegmentPicker } from './segment-picker';
 
-(globalThis as typeof globalThis & { IS_REACT_ACT_ENVIRONMENT: boolean }).IS_REACT_ACT_ENVIRONMENT = true;
-
 let container: HTMLDivElement;
 let root: Root;
 

packages/ui/src/shared/components/field/field.spec.tsx

@@ -5,12 +5,6 @@ import { Input } from '../../../components/input/input';
 import { TextArea } from '../../../components/text-area/text-area';
 import { Field } from './field';
 
-declare global {
-  // eslint-disable-next-line no-var
-  var IS_REACT_ACT_ENVIRONMENT: boolean;
-}
-globalThis.IS_REACT_ACT_ENVIRONMENT = true;
-
 describe('Field', () => {
   let container: HTMLDivElement;
   let root: ReturnType<typeof createRoot>;

packages/ui/tsconfig.json

@@ -8,6 +8,6 @@
       "@ui/*": ["./src/*"]
     }
   },
-  "include": ["src", "types.d.ts"],
+  "include": ["src", "types.d.ts", "vitest.setup.ts"],
   "exclude": ["node_modules", "dist"]
 }

packages/ui/types.d.ts

@@ -1 +1,9 @@
 /// <reference types="vite/client" />
+
+declare global {
+  // React reads this flag to know the test environment wraps updates in act(); vitest.setup.ts sets it.
+  // eslint-disable-next-line no-var
+  var IS_REACT_ACT_ENVIRONMENT: boolean;
+}
+
+export {};

packages/ui/vite.config.mts

@@ -136,7 +136,7 @@ export default defineConfig({
     libInjectCss(),
     // A stray *.spec.mts in the ts program stalls this build for 15+ minutes
     // with no output - keep every spec shape excluded.
-    dts({ entryRoot: 'src', exclude: ['**/*.spec.{ts,tsx,mts}'] }),
+    dts({ entryRoot: 'src', exclude: ['**/*.spec.{ts,tsx,mts}', 'vitest.setup.ts'] }),
     copyTokenStyles(),
     combineCssBundle(rootDirectory),
     ...(process.env.BUNDLE_STATS ? bundleStatsPlugins() : []),

packages/ui/vitest.config.mts

@@ -14,5 +14,6 @@ export default defineConfig({
   test: {
     globals: true,
     environment: 'jsdom',
+    setupFiles: ['./vitest.setup.ts'],
   },
 });

packages/ui/vitest.setup.ts

@@ -0,0 +1 @@
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;