Disable esModuleInterop (#1699)

Co-authored-by: Alexey Romanov <[email protected]>

Author: alexeyr-ci

CHANGELOG.md

@@ -20,6 +20,7 @@ Changes since the last non-beta release.
 
 #### Fixed
 - Fix obscure errors by introducing FULL_TEXT_ERRORS [PR 1695](https://github.com/shakacode/react_on_rails/pull/1695) by [Romex91](https://github.com/Romex91).
+- Disable `esModuleInterop` to increase interoperability [PR 1699](https://github.com/shakacode/react_on_rails/pull/1699) by [alexeyr-ci](https://github.com/alexeyr-ci).
 
 ### [14.1.1] - 2025-01-15
 

node_package/src/clientStartup.ts

@@ -1,4 +1,4 @@
-import ReactDOM from 'react-dom';
+import * as ReactDOM from 'react-dom';
 import type { ReactElement } from 'react';
 import type {
   RailsContext,

node_package/src/createReactOutput.ts

@@ -1,6 +1,6 @@
 /* eslint-disable react/prop-types */
 
-import React from 'react';
+import * as React from 'react';
 import type { ServerRenderResult,
   CreateParams, ReactComponent, RenderFunction, CreateReactOutputResult } from './types/index';
 import {isServerRenderHash, isPromise} from "./isServerRenderResult";

node_package/src/handleError.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import ReactDOMServer from 'react-dom/server';
+import * as React from 'react';
+import * as ReactDOMServer from 'react-dom/server';
 import type { ErrorOptions } from './types/index';
 
 function handleRenderFunctionIssue(options: ErrorOptions): string {

node_package/src/reactApis.ts

@@ -1,4 +1,4 @@
-import ReactDOM from 'react-dom';
+import * as ReactDOM from 'react-dom';
 
 const reactMajorVersion = Number(ReactDOM.version?.split('.')[0]) || 16;
 

node_package/src/reactHydrateOrRender.ts

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import ReactDOM from 'react-dom';
+import * as ReactDOM from 'react-dom';
 import type { RenderReturnType } from './types';
 import { supportsRootApi } from './reactApis';
 

node_package/src/serverRenderReactComponent.ts

@@ -1,4 +1,4 @@
-import ReactDOMServer from 'react-dom/server';
+import * as ReactDOMServer from 'react-dom/server';
 import type { ReactElement } from 'react';
 
 import ComponentRegistry from './ComponentRegistry';

node_package/src/streamServerRenderedReactComponent.ts

@@ -1,4 +1,4 @@
-import ReactDOMServer, { type PipeableStream } from 'react-dom/server';
+import * as ReactDOMServer from 'react-dom/server';
 import { PassThrough, Readable } from 'stream';
 import type { ReactElement } from 'react';
 
@@ -34,8 +34,8 @@ const transformRenderStreamChunksToResultObject = (renderState: StreamRenderStat
     }
   });
 
-  let pipedStream: PipeableStream | null = null;
-  const pipeToTransform = (pipeableStream: PipeableStream) => {
+  let pipedStream: ReactDOMServer.PipeableStream | null = null;
+  const pipeToTransform = (pipeableStream: ReactDOMServer.PipeableStream) => {
     pipeableStream.pipe(transformStream);
     pipedStream = pipeableStream;
   };

node_package/tests/ComponentRegistry.test.js

@@ -5,8 +5,8 @@
 /* eslint-disable no-unused-vars */
 /* eslint-disable import/extensions */
 
-import React from 'react';
-import createReactClass from 'create-react-class';
+import * as React from 'react';
+import * as createReactClass from 'create-react-class';
 
 import ComponentRegistry from '../src/ComponentRegistry';
 

node_package/tests/ReactOnRails.test.js

@@ -4,8 +4,8 @@
 /* eslint-disable react/jsx-filename-extension */
 
 import { createStore } from 'redux';
-import React from 'react';
-import createReactClass from 'create-react-class';
+import * as React from 'react';
+import * as createReactClass from 'create-react-class';
 import ReactOnRails from '../src/ReactOnRails';
 
 describe('ReactOnRails', () => {