'componentWillReact' of undefined after updating to 6.1.0.

[hh83917]

Due to the recent componentDidUpdate bug in mobx-react v6 we tried to upgrade to 6.1.0 but the page doesn't load and got this in the console.

vendors.bundle.a88a35b9.js:145824 Uncaught TypeError: Cannot read property 'componentWillReact' of undefined

"mobx": "^4.5.0",
"mobx-react": "^6.1.0"

Tried updating mobx to 4.11.0 and mobx-react to 6.1.1 doesn't fix it either.

[danielkcz]

I assume you don't use componentWillReact in your code (it's deprecated since V5 and removed in V6)? Well, there is the only occurrence of it here...

mobx-react/src/observerClass.js

Line 14 in 78216fe

if (target.componentWillReact)

That would effectively mean you have tried to call observer on something that does not have a prototype. That's definitely strange, hard to guess what's wrong without seeing an actual code. Reproduction in CodeSandbox would be the best.

Either way, we should guard against undefined (in here) and produce some better error message.

[hh83917]

Thanks @FredyC for the tip! ...tried to call observer on something that does not have a prototype.

I found someone did this on some of the functional components:

const SomeComponent observer(() => {
	...etc.
})

export default observer(SomeComponent)

Good thing it breaks so we got that syntax thing fixed, someone (gitblame... 😛) may have missed it during refactor from class component.

[danielkcz]

Glad I could help.

I will keep this open as we shall provide better handling of such error. The error you encountered is definitely way too cryptic.

[mweststrate]

@hh83917 could you give us the actual component definition that was wrong? That will help us in creating a reproduction (all the methods can be empty, it is just about the structure your code was in)

[danielkcz]

@mweststrate He already did, here is the repro... https://codesandbox.io/s/shy-monad-2d4up

[hh83917]

@FredyC @mweststrate Thanks for following up on the issue and @FredyC for creating that sand box for me as reference for better error messages.

As @FredyC pointed out, we are not using componentWillReact in our codebase, so the error message definitely comes as cryptic. Also, we were originally on 6.0.3 and the page still renders with double observers in couple places in some older codes. Was not expecting breaking change when upgrading to 6.1.0.

[jrmyio]

I just got this when I accidentally used React.memo and observer at the same time:
observer(React.memo((props) => test)))

[helloanoop]

I got the same error. Rolled back to 5.4.4 and its working fine in the older version.

[danielkcz]

@anoopmd Thanks for the reminder, forgot about a pending PR. Just merged so it should be fixed in the next V6 release.

[johnnyreilly]

I just got this when I accidentally used React.memo and observer at the same time:
observer(React.memo((props) => test)))

@ConneXNL thanks for sharing that - I just bumped on this too.

Would someone be able to provide an explanation of why you can't mix React.memo and observer please? I'd love to give a good explanation to the team (and understand myself 😄 )

[danielkcz]

Well, observer packs React.memo underneath, so there is no need to use it (only by accident). Why it's a problem to have it there twice it's probably more of the question for a React team :)

[danielkcz]

6.1.2 published with this fix

[jstansbe]

"Cannot read property ' componentWillReact' of undefined"

"mobx": "^5.13.0",
"mobx-react": "^6.1.2",
"mobx-state-tree": "^3.14.1",
"react": "16.8.6",
"react-native": "0.60.4",

Edit:
After adding @babel/plugin-proposal-class-properties and @babel/plugin-proposal-decorators i get the following error:
undefined is not an object (evaluating 't.componentWillReact')

[danielkcz]

@jstansbe Can you provide reproduction, please? Might be some other case we have missed there.

[andq-ibl]

I'm using :

"node":v10.13.0,
"react": "^16.8.4",
"mobx": "^5.13.0",
"mobx-react": "^6.1.3",

Got the same issue but I do not use react.memo. I checked the code and make some log:

And the result I got is like this:

After changing t=e.prototype to t=e.__proto__, it's worked

[danielkcz]

@andq-ibl Once again, without reproduction, it's not possible to fix it.

And I am going to lock this, it's clearly some other issue so let's treat it like that.