Description
(This may or may not be something you want to address with v3; if not, please just close this)
Our project uses decorators to connect components to the redux store. I think this is fairly common. For example, you see it a lot in erikras/react-redux-universal-hot-example, which uses Babel 6 and the "transform-decorators-legacy" Babel plugin, since Babel has decided to postpone decorator support until its more mature. For example:
This worked fine with v2, but with v3 components that are decorated like this seem to lose their internal state when they're hot-reloaded.
If you want to look at this, let me know and I'll put together a sample repo that shows the problem. Thanks so much for your work on this! It's great to see all the activity on this project right now.
best,
Zach
Activity
[-]Incompatibility with decorators[/-][+]v3 Incompatibility with decorators[/+][-]v3 Incompatibility with decorators[/-][+]v3 incompatibility with decorators[/+]gaearon commentedon May 3, 2016
Please do! Also make sure you’re using
react-hot-loader/babel
rather thanreact-hot-loader/webpack
if you want “connected” classes to be found by it.Demonstrate gaearon/react-hot-loader#279
Demonstrate gaearon/react-hot-loader#279
zdavis commentedon May 3, 2016
Ok, the "decorators" branch in zdavis/react-hot-boilerplate shows the problem pretty clearly. See zdavis/react-hot-boilerplate@7b510aa.
This commit adds a new component called "DecoratedCounter". The decorated counter is decorated with @connect, which just wraps a component around the decorated component.
The Counter component is also wrapped with connect, but without using decorator syntax.
When DecoratedCounter is hot reloaded, it loses its internal state. This is not the case for the Counter component.
Let me know if there's anything else I can do to help!
nfcampos commentedon May 3, 2016
I think this comes down to our babel plugin needing to be aware of decorators, otherwise it only wraps the decorated hoc, not the original component that was decorated
[-]v3 incompatibility with decorators[/-][+]Babel plugin should recognize decorated classes[/+]gaearon commentedon May 3, 2016
I wonder if a simple way to fix this would be to insert our own “registering” decorator as the innermost one if we see a decorated class.
nfcampos commentedon May 3, 2016
Yeah that sounds like it'd work
liady commentedon Jul 9, 2016
@gaearon @nfcampos Any news on that? Currently all of our classes are decorated, which prevents them from being properly hot-reloaded (the Root component just refreshes and loses all internal state).
Is there a temporary fix we can do in our code to get it working?
66 remaining items