Describe the bug
When using react-dev-inspector in a project that sets NODE_OPTIONS=--openssl-legacy-provider (commonly needed for Node 16 projects running on Node 20+), clicking on an element to open the editor fails with the following error:
D:\soft\Windsurf\bin\..\Windsurf.exe: --openssl-legacy-provider is not allowed in NODE_OPTIONS
Could not open index.tsx in the editor.
The editor process exited with an error: (code 9).
To set up the editor integration, add something like REACT_EDITOR=atom to the .env.local file in your project folder and restart the development server. Learn more: https://goo.gl/MMTaZt
Root Cause
The issue is in react-dev-utils/launchEditor.js. When spawning the editor process, it doesn't specify a custom env option, so child_process.spawn() inherits all environment variables from the parent process, including NODE_OPTIONS.
// Current code (around line 375-385)
if (process.platform === 'win32') {
_childProcess = child_process.spawn(
'cmd.exe',
['/C', editor].concat(args),
{ stdio: 'inherit' } // No env option, inherits NODE_OPTIONS
);
} else {
_childProcess = child_process.spawn(editor, args, { stdio: 'inherit' });
}
Electron-based editors (VSCode, Windsurf, Cursor, etc.) do not accept --openssl-legacy-provider in NODE_OPTIONS, causing them to fail to launch.
Suggested Fix
Create a copy of process.env without NODE_OPTIONS and pass it to spawn():
// Proposed fix
const editorEnv = Object.assign({}, process.env);
delete editorEnv.NODE_OPTIONS;
if (process.platform === 'win32') {
_childProcess = child_process.spawn(
'cmd.exe',
['/C', editor].concat(args),
{ stdio: 'inherit', env: editorEnv }
);
} else {
_childProcess = child_process.spawn(editor, args, { stdio: 'inherit', env: editorEnv });
}
To Reproduce
- Create a project using
react-dev-inspector
- Set
NODE_OPTIONS=--openssl-legacy-provider in the start script (e.g., cross-env NODE_OPTIONS=--openssl-legacy-provider umi dev)
- Configure
REACT_EDITOR=windsurf (or code, or any Electron-based editor)
- Start the dev server
- Press
Ctrl + Shift + Alt + C and click on any element
- Observe the error in the terminal
Expected behavior
The editor should open the source file without being affected by the parent process's NODE_OPTIONS environment variable.
Environment
- OS: Windows 11
- Node.js: v20.11.0
- react-dev-inspector: 2.0.1
- react-dev-utils: 12.0.1
- Editor: Windsurf (also affects VSCode, Cursor, etc.)
Workaround
Currently using pnpm patch to patch react-dev-utils locally. See the suggested fix above.
Additional context
This issue affects any project that:
- Uses
react-dev-inspector for component inspection
- Needs
--openssl-legacy-provider for OpenSSL compatibility (common when running Node 16 projects on Node 20+)
- Uses an Electron-based editor
The fix is backward-compatible and should not affect projects that don't set NODE_OPTIONS.
Describe the bug
When using
react-dev-inspectorin a project that setsNODE_OPTIONS=--openssl-legacy-provider(commonly needed for Node 16 projects running on Node 20+), clicking on an element to open the editor fails with the following error:Root Cause
The issue is in
react-dev-utils/launchEditor.js. When spawning the editor process, it doesn't specify a customenvoption, sochild_process.spawn()inherits all environment variables from the parent process, includingNODE_OPTIONS.Electron-based editors (VSCode, Windsurf, Cursor, etc.) do not accept
--openssl-legacy-providerinNODE_OPTIONS, causing them to fail to launch.Suggested Fix
Create a copy of
process.envwithoutNODE_OPTIONSand pass it tospawn():To Reproduce
react-dev-inspectorNODE_OPTIONS=--openssl-legacy-providerin the start script (e.g.,cross-env NODE_OPTIONS=--openssl-legacy-provider umi dev)REACT_EDITOR=windsurf(orcode, or any Electron-based editor)Ctrl + Shift + Alt + Cand click on any elementExpected behavior
The editor should open the source file without being affected by the parent process's
NODE_OPTIONSenvironment variable.Environment
Workaround
Currently using
pnpm patchto patchreact-dev-utilslocally. See the suggested fix above.Additional context
This issue affects any project that:
react-dev-inspectorfor component inspection--openssl-legacy-providerfor OpenSSL compatibility (common when running Node 16 projects on Node 20+)The fix is backward-compatible and should not affect projects that don't set
NODE_OPTIONS.