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

Component not accepted by Hot Loader if using react-refetch #666

Closed
loris opened this issue Oct 12, 2017 · 27 comments
Closed

Component not accepted by Hot Loader if using react-refetch #666

loris opened this issue Oct 12, 2017 · 27 comments
Labels

Comments

@loris
Copy link

loris commented Oct 12, 2017

Hi! congrats on v3!
I have been trying to switch from react-transform-hmr to react-hot-loader@3and facing some issues. It looks like I can't get Hot Loader to properly works with components wrapped with https://github.com/heroku/react-refetch HOC (and since my parent App component is also wrapped, none on the children components are accepted)

React Hot Loader: this component is not accepted by Hot Loader. 
Please check is it extracted as a top level class, a function or a variable. 
Click below to reveal the source location: 
 ƒ RefetchConnect(props, context) {
        _classCallCheck(this, RefetchConnect);

        var _this2 = _possibleConstructorReturn(this, _Component.call(this, props, context));

        _this2.version …

It looks really related to react-refetch (my App component is wrapped with multiple HOCs using compose from recompose and hot reload properly works as soon as I remove the react-refetch HOC). Any idea?

@oliviertassinari
Copy link
Contributor

I have noticed the same behavior today. For instance, I have 6 components raising this warning. Some of those components are userland, some are coming from redux-form, react-redux, Material-UI.
I have upgraded recently to react-hot-loader-3.0.0. I will rollback to the previous version to see if that help.

@oliviertassinari
Copy link
Contributor

I confirm, @loris see if [email protected] fix your issue.

@gregberge
Copy link
Collaborator

It is new in v3, it gives you warning about component not accepted by React Hot Loader. The behaviour is the same as v3.0.0-beta.7 except you don't get any warning about not accepted components.

@anamanaguchi
Copy link

@neoziro, is there an option to disable this warning? ;)

@gregberge
Copy link
Collaborator

Not yet

@gregberge
Copy link
Collaborator

Feel free to contribute #667

@loris
Copy link
Author

loris commented Oct 16, 2017

Not sure why the issue has been closed. Warnings are not the problem, the fact that reloading is not happening is. Using react-refetch in a component will make any children unreloadable.

@skipjack
Copy link

skipjack commented Oct 16, 2017

@loris I agree, though this issue is similar to #650 (and potentially some others) so maybe it was closed in favor of that one? BTW I'm seeing this issue with react-redux connected components as well so I don't think it's specific to react-refetch but more to HoC components in general.

@gregberge gregberge reopened this Oct 17, 2017
@Iuriy-Budnikov
Copy link

Iuriy-Budnikov commented Oct 18, 2017

I have the same issue with connect. I got it after update from 3.0.0-beta.7 to v 3.1.1. Something wrong with HOC

@nathanqueija
Copy link

I am having the same issue with connect. The warnings reaches to the number of 8000.
Sometimes chrome chrashes because it ran out of memory.

@nathanqueija
Copy link

screen shot 2017-10-19 at 10 48 57 am

20000 > warnings

@Panoplos
Copy link

Issue #666 ... coincidence? Because this one is certainly a beast!!
In order to comply, I would have to unwrap every single component that uses connect or recompose.
Can someone explain why this is not supported, as the composed components are not changing in most cases?

@vanderhoop
Copy link

Encountered the same. reverting to 3.0.0-beta.7 did the trick.

@luisherranz
Copy link

Exactly the same here. I also went back to beta 7.

@gregberge
Copy link
Collaborator

@loris
Copy link
Author

loris commented Oct 29, 2017

Any updates on this one @neoziro? Using React with HoC like redux seems like a very common setup, so currently RHL is broken for most people

@gregberge
Copy link
Collaborator

@loris in fact the implementation is the same as in beta. We added warnings by default and you can disable them.

Concerning support of HOC we do not have any solution yet except exporting them at top level.

@theKashey
Copy link
Collaborator

What about "that babel plugin"? @loris - check this out - #650 (comment)

@JustFly1984
Copy link

I'm also experiencing an issue with hot reloading and connected components:
screenshot 2017-11-07 02 50 08

@PeterKottas
Copy link

Yeah same here guys. HOCs are breaking my setup at the moment.

@jcrben
Copy link

jcrben commented Nov 7, 2017

I believe that there's a bug here where the warning fires even if the component actually is reloaded - because it's a child component in the same file. I'll see about posting a reproducible case, but can't promise it... nevermind, I'm using a dated version from a starter kit, will see what happens if I upgrade

@cescoferraro
Copy link

reverting back to beta7 indeed solves the warning issues. But, Is there anyone else having issues with HMR a redux store. I keep getting the Provider does not support changing store on the fly warning on each first hot-reload

@gregberge
Copy link
Collaborator

react-refetch issue is fixed in next. Also added an example using react-refetch.

@Stanko
Copy link

Stanko commented Dec 27, 2017

@neoziro thanks! I just tried next and it seems issue is fixed, but it is giving me another error, sorry if it is unrelated!

React-stand-in: Updated class  Connect(People) contains native or bound function  notifyNestedSubs ƒ notifyNestedSubs() {
    this.listeners.notify();
  } . Unable to reproduce, use arrow functions instead.

@gregberge
Copy link
Collaborator

Ping @theKashey

@theKashey
Copy link
Collaborator

@Stanko - we will remove this warning asap. This is just a warning. Everything is ok in real.

@loris
Copy link
Author

loris commented Jan 2, 2018

@neoziro Thanks! Just installed next on our project and can confirm our components (event the ones exported with multiple HOCs) are properly hot reloaded!

@loris loris closed this as completed Jan 2, 2018
Stanko added a commit to workco/marvin that referenced this issue Jan 3, 2018
* Switched to redux-saga.
* Switched to postcss.
* Async server data.
* Removed unused files.
* Refactoring.
* Updated dependencies.
* Updated documentation.
* Added react-hot-loader 4 beta cause of this issue gaearon/react-hot-loader#666
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests