chore(test): fix issue when running test with react major version env…

… set

also reactor how we manipulate environment variables in our test

jest.config.ts

@@ -1,14 +1,11 @@
-// eslint-disable-next-line import/no-import-module-exports
-import type { Config } from 'jest';
+/* eslint-disable @typescript-eslint/triple-slash-reference */
+/// <reference path="./test/typings/environment.d.ts" />
 
-declare global {
-  interface ProcessEnv {
-    REACT_MAJOR_VERSION: string;
-    CI?: boolean;
-  }
-}
+import type { Config } from 'jest';
+import getReactMajorVersion from './test/util/get-react-major-version';
+import isRunningInCI from './test/util/is-running-in-ci';
 
-const reactMajorVersion = process.env.REACT_MAJOR_VERSION;
+const reactMajorVersion = getReactMajorVersion();
 
 const config: Config = {
   clearMocks: true,
@@ -39,7 +36,7 @@ const config: Config = {
 };
 
 // eslint-disable-next-line no-console
-console.log('Testing with React version:', `${reactMajorVersion || '18'}.x.x`);
+console.log('Testing with React version:', `${reactMajorVersion}.x.x`);
 
 if (['16', '17'].includes(reactMajorVersion)) {
   config.testPathIgnorePatterns = [
@@ -57,8 +54,8 @@ if (['16', '17'].includes(reactMajorVersion)) {
   };
 }
 
-if (process.env.CI) {
+if (isRunningInCI()) {
   config.maxWorkers = 2;
 }
 
-module.exports = config;
+export default config;

test/setup/environment.ts

@@ -8,12 +8,6 @@ import { TextDecoder, TextEncoder } from 'util';
 import attachRafStub from './attach-raf-stub';
 import transitionEventPolyfill from './transition-event-polyfill';
 
-declare global {
-  interface ProcessEnv {
-    REACT_MAJOR_VERSION?: string;
-  }
-}
-
 export default class MyJSDOMEnvironment extends JSDOMEnvironment {
   constructor(config: JestEnvironmentConfig, context: EnvironmentContext) {
     super(config, context);

test/setup/snapshot-resolver.ts

@@ -1,4 +1,5 @@
 import path from 'path';
+import getReactMajorVersion from '../util/get-react-major-version';
 
 // resolve snapshot folder with the react version
 // __react_16_snapshots__, __react_17_snapshots__, etc.
@@ -7,11 +8,12 @@ export default {
   resolveSnapshotPath: (testPath: string, snapshotExtension: string) => {
     const breadcrumb = testPath.split(path.sep);
     const filename = breadcrumb.pop();
+    const reactMajorVersion = getReactMajorVersion();
 
     return (
       [
         ...breadcrumb,
-        `__react_${process.env.REACT_MAJOR_VERSION}_snapshots__`,
+        `__react_${reactMajorVersion}_snapshots__`,
         filename,
       ].join(path.sep) + snapshotExtension
     );

test/typings/environment.d.ts

@@ -0,0 +1,9 @@
+interface ProcessEnv {
+  NODE_ENV?: 'development' | 'production';
+  REACT_MAJOR_VERSION?: '16' | '17' | '18';
+  CI?: boolean;
+}
+
+interface Process {
+  env: ProcessEnv;
+}

test/unit/state/registry/use-registry.spec.tsx

@@ -5,6 +5,7 @@ import type { DraggableId } from '../../../../src/types';
 import { invariant } from '../../../../src/invariant';
 import { getPreset } from '../../../util/dimension';
 import { getDraggableEntry } from '../../../util/registry';
+import getReactMajorVersion from '../../../util/get-react-major-version';
 import useRegistry from '../../../../src/state/registry/use-registry';
 
 const preset = getPreset();
@@ -35,7 +36,7 @@ it('should remove any registrations', () => {
   unmount();
 
   // only for react 16 and 17
-  if (['16', '17'].includes(`${process.env.REACT_MAJOR_VERSION}`)) {
+  if (['16', '17'].includes(getReactMajorVersion())) {
     // still available after a unmount
     // eslint-disable-next-line jest/no-conditional-expect
     expect(registry.draggable.exists(id)).toBe(true);

test/util/get-react-major-version.ts

@@ -0,0 +1,3 @@
+export default function getReactMajorVersion(): '16' | '17' | '18' {
+  return process.env.REACT_MAJOR_VERSION || '18';
+}

test/util/is-running-in-ci.ts

@@ -0,0 +1,3 @@
+export default function isRunningInCI(): boolean {
+  return Boolean(process.env.CI);
+}