-
Notifications
You must be signed in to change notification settings - Fork 802
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
Hot reloading fails for components which have a class property render method #924
Comments
I did a bit of investigative work into this, and it seems that this is due to how class properties work and how we access the render method of a component on hot reload. Babel converts class properties to look something like this; function Example() {
this.render = function() {
return "Hello, example!";
};
} Which does not put the method on the prototype. The issue is that we try and call the react-hot-loader/src/proxy/createClassProxy.js Lines 150 to 158 in 10a320c
I'm not sure if there is a solution to this or whether we should just add a warning about it, as it doesn't seem like you can re-bind the context of an arrow function. |
Yeah, it is better to codemod this code, as long we could not distinguish a "local prop" render method and "render method we got from the prototype". Just because we are using render as a descriptor. |
I guess there's no solution for this then. Cheers 👍 |
Sorry about it. Might be solved with #840 |
@jackwilsdon sorry, a wrong click! |
There is no solution for this issue at all? react-hot-loader not working for classes and it's no way to fix it? |
@neoziro Should this be re-opened if it was a mis-click? 😛 |
@Deadly0 it works fine for classes, it just fails with class property render methods; class MyComponent extends React.Component {
render() {
return "This will hot reload fine!";
}
}
class MyOtherComponent extends React.Component {
render = function() {
return "This will fail to hot reload!";
}
} |
Ok, I just start typing a long story why I have to idea how to solve this problem, and thus could not. |
So the main thing here - there were no issues with the provided code. Only for the nested components, and even they possible were able to hot-reload themselves. |
fix: render as a class prop. Fixes #924
If
you are reporting a bug or having an issue setting up React Hot Loader, please fill in below. For feature requests, feel free to remove this template entirely.Description
What you are reporting:
Hot reloading fails for components which have a class property render method.
Expected behavior
What you think should happen:
Hot reloading should work correctly for components which have a class property render method.
Actual behavior
What actually happens:
A debug message is logged in the browser console (with
logLevel
set todebug
) and the component does not reload.Environment
React Hot Loader version:
4.0.1
Run these commands in the project folder and fill in their results:
node -v
:v8.10.0
npm -v
:v5.6.0
Then, specify:
Reproducible Demo
https://github.com/jackwilsdon/react-hot-loader-class-properties
Steps to reproduce
npm run start
oryarn start
.src/components/Example.js
to say something else.The text was updated successfully, but these errors were encountered: