Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Helpful error not thrown for stateless components instantiation. #76

Open
palavrov opened this issue May 8, 2017 · 4 comments
Open

Comments

@palavrov
Copy link

palavrov commented May 8, 2017

That one is really annoying.
See gaearon/react-hot-loader#488

@hfjallemark
Copy link

Any update on this one? It's almost impossible to debug stateless components using react-proxy as it is today.

@Panoplos
Copy link

Panoplos commented Aug 1, 2017

Oh my! This is the module that has me pulling my hair out!!

@eirikurn
Copy link

eirikurn commented Sep 15, 2017

I'm happy to write a PR for this issue. I can think of the following fixes, which do you prefer @gaearon:

  1. Detect if component is a native-ish ES6 class by reading it's source with Function.prototype.toString(). Like is-class does: https://github.com/miguelmota/is-class/blob/master/is-class.js
  2. Re-throw error unless it's "Cannot call a class as a function", with a regex that softly matches the different error messages in Trident, Gecko, Blink, Webkit and Babel.

1 might be slower but more standardized (with a leaky special case for babel).

2 is simpler and perhaps good enough for this edge case, but UA error messages do sometimes change. This would also have false negatives if the component constructor calls an ES6 class without new.

@bkniffler
Copy link

Please fix this, its been driving me crazy and the issue is growing some serious beard now. There's been a suggestion on how to fix in the linked issue.

eirikurn added a commit to aranja/tux that referenced this issue Nov 16, 2017
We should not support it since by default it's an aggressive and flaky
HMR handler. Where it says it can handle more file changes than it
actually can. Developers usually learn not to trust it and refresh
manually.

It also breaks JS error handling in arrow functions:

gaearon/react-proxy#76

After this change, HMR is still properly configured, including the
module.hot api and client/server communications. By default JS changes
refresh and CSS changes appear without refresh.

For the future, we should monitor the progress of this PR:

facebook/create-react-app#2304
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants