Bug: when used with jsdom-jscore-rn, importing react-dom crashes

[jsnajdr]

React version: 18.2.0

Steps To Reproduce

Install the jsdom-jscore-rn and react-dom packages locally and then run this Node.js script:

// create a document with primitive DOM implementation
const jsdom = require('jsdom-jscore-rn');
const document = jsdom.html( '', null, null );

// assign all the browser-ish globals
global.document = document;
global.window = { document };
global.navigator = { userAgent: '' };

// load react-dom and see it crash
require('react-dom');

Importing the react-dom package will crash:

node_modules/react-dom/cjs/react-dom.development.js:8797
    if (prefixMap.hasOwnProperty(styleProp) && styleProp in style) {
                                                         ^

TypeError: Cannot use 'in' operator to search for 'WebkitAnimation' in undefined
    at getVendorPrefixedEventName (node_modules/react-dom/cjs/react-dom.development.js:8797:58)
    at node_modules/react-dom/cjs/react-dom.development.js:8805:21
    at Object.<anonymous> (node_modules/react-dom/cjs/react-dom.development.js:29867:5)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:94:18)
    at Object.<anonymous> (node_modules/react-dom/index.js:37:20)

What happened? There is the jsdom-jscore-rn package that provides a very bare-bones implementation of DOM (like jsdom but much smaller), intended for React Native apps that need to have some DOM available. Typically to please libraries that depend on it, like the hpq HTML parser lib. The mobile version of the Gutenberg editor uses jsdom-jscore-rn.

The jsdom-jscore-rn DOM doesn't support the .style attribute on elements. Accessing an el.style returns undefined, not an instance of CSSStyleDeclaration. But this confuses react-dom's getVendorPrefixedEventName code that will assign the undefined value to the global style variable and will try to access its properties with statements like styleProp in style.

It would be nice if react-dom could do one additional check on the el.style attribute before assigning it to the global style. It would make the package more compatible with--admittedly very strange, but realistic--environments that combine React Native, jsdom-jscore-rn and react-dom. Note that we don't even have to use anything from react-dom to trigger the bug, we're merely importing it. Maybe in some test environment where there's nothing like tree shaking that would remove unused modules.

[eps1lon]

Why can't jsdom-jscore-rn implement style with an empty CSSStyleDeclaration? The problem here is precedent: Do we need to special case every single environment that has a partial implementation of the DOM?

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[github-actions]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!