User a proper jest environment to create a mixed one

facebook · Mar 20, 2022 · 6551423 · 6551423
1 parent 57d393f
commit 6551423
Show file tree

Hide file tree

Showing 22 changed files with 78 additions and 44 deletions.
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';
 
-let JSDOM;
 let Stream;
 let Scheduler;
 let React;
@@ -21,19 +21,16 @@ let useSyncExternalStore;
 let useSyncExternalStoreWithSelector;
 let PropTypes;
 let textCache;
-let window;
-let document;
 let writable;
 let CSPnonce = null;
-let container;
+let container = null;
 let buffer = '';
 let hasErrored = false;
 let fatalError = undefined;
 
 describe('ReactDOMFizzServer', () => {
   beforeEach(() => {
     jest.resetModules();
-    JSDOM = require('jsdom').JSDOM;
     Scheduler = require('scheduler');
     React = require('react');
     ReactDOMClient = require('react-dom/client');
@@ -64,16 +61,8 @@ describe('ReactDOMFizzServer', () => {
 
     textCache = new Map();
 
-    // Test Environment
-    const jsdom = new JSDOM(
-      '<!DOCTYPE html><html><head></head><body><div id="container">',
-      {
-        runScripts: 'dangerously',
-      },
-    );
-    window = jsdom.window;
-    document = jsdom.window.document;
-    container = document.getElementById('container');
+    container = document.createElement('div');
+    document.body.appendChild(container);
 
     buffer = '';
     hasErrored = false;
@@ -89,6 +78,11 @@ describe('ReactDOMFizzServer', () => {
     });
   });
 
+  afterEach(() => {
+    container?.remove();
+    container = null;
+  });
+
   async function act(callback) {
     await callback();
     // Await one turn around the event loop.

diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzShellHydration-test.js
@@ -5,18 +5,17 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
-let JSDOM;
 let React;
 let ReactDOMClient;
 let Scheduler;
 let clientAct;
 let ReactDOMFizzServer;
 let Stream;
-let document;
 let writable;
-let container;
+let container = null;
 let buffer = '';
 let hasErrored = false;
 let fatalError = undefined;
@@ -25,7 +24,6 @@ let textCache;
 describe('ReactDOMFizzShellHydration', () => {
   beforeEach(() => {
     jest.resetModules();
-    JSDOM = require('jsdom').JSDOM;
     React = require('react');
     ReactDOMClient = require('react-dom/client');
     Scheduler = require('scheduler');
@@ -35,15 +33,8 @@ describe('ReactDOMFizzShellHydration', () => {
 
     textCache = new Map();
 
-    // Test Environment
-    const jsdom = new JSDOM(
-      '<!DOCTYPE html><html><head></head><body><div id="container">',
-      {
-        runScripts: 'dangerously',
-      },
-    );
-    document = jsdom.window.document;
-    container = document.getElementById('container');
+    container = document.createElement('div');
+    document.body.appendChild(container);
 
     buffer = '';
     hasErrored = false;
@@ -59,6 +50,11 @@ describe('ReactDOMFizzShellHydration', () => {
     });
   });
 
+  afterEach(() => {
+    container?.remove();
+    container = null;
+  });
+
   async function serverAct(callback) {
     await callback();
     // Await one turn around the event loop.

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationAttributes-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationBasic-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationBasic-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationCheckbox-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationCheckbox-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationClassContextType-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationClassContextType-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationElements-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationElements-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';
@@ -43,7 +44,7 @@ const {
   clientRenderOnServerString,
 } = ReactDOMServerIntegrationUtils(initModules);
 
-describe('ReactDOMServerIntegration', () => {
+describe('ReactDOMServerIntegrationElements', () => {
   beforeEach(() => {
     resetModules();
   });

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationFragment-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationFragment-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationHooks-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 /* eslint-disable no-func-assign */
@@ -36,7 +37,6 @@ let clearYields;
 function initModules() {
   // Reset warning cache.
   jest.resetModules();
-
   React = require('react');
   ReactDOM = require('react-dom');
   ReactDOMServer = require('react-dom/server');
@@ -79,7 +79,7 @@ const {
   serverRender,
 } = ReactDOMServerIntegrationUtils(initModules);
 
-describe('ReactDOMServerHooks', () => {
+describe('ReactDOMServerIntegrationHooks', () => {
   beforeEach(() => {
     resetModules();
   });

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationInput-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationInput-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationLegacyContext-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationLegacyContext-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/...s/react-dom/src/__tests__/ReactDOMServerIntegrationLegacyContextDisabled-test.internal.js b/...s/react-dom/src/__tests__/ReactDOMServerIntegrationLegacyContextDisabled-test.internal.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationModes-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationNewContext-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationNewContext-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSelect-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSelect-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationSpecialTypes-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationTextarea-test.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationTextarea-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.internal.js b/packages/react-dom/src/__tests__/ReactDOMServerIntegrationUntrustedURL-test.internal.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 /* eslint-disable no-script-url */
@@ -184,7 +185,6 @@ describe('ReactDOMServerIntegration - Untrusted URLs - disableJavaScriptURLs', (
     jest.resetModules();
     const ReactFeatureFlags = require('shared/ReactFeatureFlags');
     ReactFeatureFlags.disableJavaScriptURLs = true;
-
     React = require('react');
     ReactDOM = require('react-dom');
     ReactDOMServer = require('react-dom/server');

diff --git a/packages/react-dom/src/__tests__/ReactDOMUseId-test.js b/packages/react-dom/src/__tests__/ReactDOMUseId-test.js
@@ -5,9 +5,9 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
-let JSDOM;
 let React;
 let ReactDOMClient;
 let Scheduler;
@@ -17,7 +17,6 @@ let Stream;
 let Suspense;
 let useId;
 let useState;
-let document;
 let writable;
 let container;
 let buffer = '';
@@ -27,7 +26,6 @@ let fatalError = undefined;
 describe('useId', () => {
   beforeEach(() => {
     jest.resetModules();
-    JSDOM = require('jsdom').JSDOM;
     React = require('react');
     ReactDOMClient = require('react-dom/client');
     Scheduler = require('scheduler');
@@ -38,15 +36,8 @@ describe('useId', () => {
     useId = React.useId;
     useState = React.useState;
 
-    // Test Environment
-    const jsdom = new JSDOM(
-      '<!DOCTYPE html><html><head></head><body><div id="container">',
-      {
-        runScripts: 'dangerously',
-      },
-    );
-    document = jsdom.window.document;
-    container = document.getElementById('container');
+    container = document.createElement('div');
+    document.body.appendChild(container);
 
     buffer = '';
     hasErrored = false;
@@ -62,6 +53,11 @@ describe('useId', () => {
     });
   });
 
+  afterEach(() => {
+    container?.remove();
+    container = null;
+  });
+
   async function serverAct(callback) {
     await callback();
     // Await one turn around the event loop.

diff --git a/packages/react-dom/src/__tests__/ReactDOMserverIntegrationProgress-test.js b/packages/react-dom/src/__tests__/ReactDOMserverIntegrationProgress-test.js
@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @emails react-core
+ * @jest-environment ./scripts/jest/ReactDOMServerIntegrationEnvironment
  */
 
 'use strict';

diff --git a/packages/react-reconciler/src/DebugTracing.js b/packages/react-reconciler/src/DebugTracing.js
@@ -49,6 +49,7 @@ function log(...logArgs): void {
     for (let i = printedGroupIndex + 1; i < pendingGroupArgs.length; i++) {
       const groupArgs = pendingGroupArgs[i];
       nativeConsole.group(...groupArgs);
+      // nativeConsoleLog(new Error().stack)
     }
     printedGroupIndex = pendingGroupArgs.length - 1;
   }

diff --git a/scripts/jest/ReactDOMServerIntegrationEnvironment.js b/scripts/jest/ReactDOMServerIntegrationEnvironment.js
@@ -0,0 +1,32 @@
+'use strict';
+
+const JSDOMEnvironment = require('jest-environment-jsdom');
+const NodeEnvironment = require('jest-environment-node');
+
+/**
+ * Test environment for testing integration of react-dom (browser) with react-dom/server (node)
+ */
+class ReactDOMServerIntegrationEnvironment extends NodeEnvironment {
+  constructor(config, context) {
+    super(config, context);
+
+    this.domEnvironment = new JSDOMEnvironment(config, context);
+
+    this.global.window = this.domEnvironment.dom.window;
+    this.global.document = this.global.window.document;
+    this.global.navigator = this.global.window.navigator;
+    this.global.Node = this.global.window.Node;
+  }
+
+  async setup() {
+    await super.setup();
+    await this.domEnvironment.setup();
+  }
+
+  async teardown() {
+    await this.domEnvironment.teardown();
+    await super.teardown();
+  }
+}
+
+module.exports = ReactDOMServerIntegrationEnvironment;