React: Show a better warning when accidentally returning from constructor

Created on 27 Oct 2017 · 9Comments · Source: facebook/react

Based on a conversation with @vjeux:

I wrote
constructor(props) {
 return {
   something: false
 }
}
instead of
constructor(props) {
 super(props);
 this.state = {
   something: false
 }
}
and the error was super confusing, it told me that render is not defined on the component, which didn't make sense since I returned it!

We can fix this to show a different message if type has .prototype.isReactComponent but constructor() gave us something without a render method.

starter Enhancement good first issue (taken)

Source

gaearon

Most helpful comment

I think the relevant code is in ReactFiberClassComponent. I would suggest adding a test first (e.g. try to reproduce the existing warning), then try to make changes for a better warning. Does this help?

gaearon on 27 Oct 2017

👍6

All 9 comments

hi I would like to work on it. Could you please point me to specific direction. I would really appreciate it.

M-ZubairAhmed on 27 Oct 2017

gaearon on 27 Oct 2017

👍6

Hey, @M-ZubairAhmed, I thought this was a good starting bug and went ahead with the fix as an exercise for myself. If you don't ultimately take this bug, let me know so I can create a pull request.

deanbrophy on 28 Oct 2017

@M-ZubairAhmed Have you been able to look at it yet?

gaearon on 28 Oct 2017

@deanbrophy yes even I have started working on it but since I am a beginner is taking time for me to complete. But I think it's not wise for me to hold it up, you are welcome to continue.
@gaearon I will keep looking out the space for more issues in future

M-ZubairAhmed on 29 Oct 2017

@M-ZubairAhmed Thanks! The next "good first issue" is yours.

deanbrophy on 29 Oct 2017

👍3 😄1

Maybe it is not related. Basically all the components that we are writing in Class style must deal with the state. Why cannot we enforce returning an initial state in Class style instead of doing this.state = {}