Uncaught TypeError: Cannot add property elementType, object is not extensible

[sachetsharma1]

Description

We upgraded react-hot-loader from 4.12.12 to 4.12.15. Running into the above error with the new version.

Source line points to a recent commit in the code: 62bc67e

React Hot Loader version: 4.12.15

Run these commands in the project folder and fill in their results:

1. node -v: 8.11.1
2. npm -v: 6.8.0

Then, specify:

1. Operating system: Mac OSX 10.13.6
2. Browser and version: Chrome 79

Stack:

react-hot-loader.development.js:1821 Uncaught TypeError: Cannot add property elementType, object is not extensible
at markUpdate (react-hot-loader.development.js:1821)
at deepMarkUpdate (react-hot-loader.development.js:1840)
at reconcileHotReplacement (react-hot-loader.development.js:2192)
at renderReconciler (react-hot-loader.development.js:2205)
at Object.asyncReconciledRender [as componentWillRender] (react-hot-loader.development.js:2213)
at Component.proxiedRender (react-hot-loader.development.js:770)
at finishClassComponent (react-dom.development.js:8389)
at updateClassComponent (react-dom.development.js:8357)
at beginWork (react-dom.development.js:8982)
at performUnitOfWork (react-dom.development.js:11814)
at workLoop (react-dom.development.js:11843)
at renderRoot (react-dom.development.js:11874)
at performWorkOnRoot (react-dom.development.js:12449)
at performWork (react-dom.development.js:12370)
at performSyncWork (react-dom.development.js:12347)
at requestWork (react-dom.development.js:12247)

[theKashey]

Which version on React you are using? elementType should exist since 16.6.
I could fix the problem, but I could not prevent it from happening in the future without understanding how to test it, and having the right test for this case.
Please help me create it.

[sachetsharma1]

We are using react version 16.3.2.
Looks like FiberNode is not extensible based on this line: https://github.com/facebook/react/blob/70754f10d4119a999ac9a46b6ea8c11a12a1a72d/packages/react-reconciler/src/ReactFiber.js#L336
Which is causing the issue.

[theKashey]

Any real reasons to use so old version?

[sachetsharma1]

We don't upgrade every new version. We have large scale project and it has to be prioritized and go through a long QA cycle. Regardless, this is a minor version upgrade and we didn't expect a breaking change to be introduced.

Is there a plan to fix this bug for pre 16.6 versions?

[theKashey]

It's one line change. Harder to test it properly.

[ws-perelyaynen]

@theKashey
you can let us to test =)

[TimboKZ]

Same problem, working with React v16.3. I imagine downgrading to an earlier version of react-hot-loader is the way to go?

[TimboKZ]

Downgrading to [email protected] fixed the issue for React 16.3.

[theKashey]

Fixed in 4.12.16