-
-
Notifications
You must be signed in to change notification settings - Fork 106
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
[react] HMR not working with HOC #21
Comments
HOCs are actually known to be unhandled by Fast Refresh (if they return class components): https://nextjs.org/docs/basic-features/fast-refresh#limitations |
I believe this was closed without a good reason. The HOC in my reproduction link is:
|
I am having a very similar issue and I couldn't find the root cause. I'm also using the react-plugin. Downgrading to older version didn't help. Only the html head is being refreshed but body ignored. Really strange. All I can do is manually refresh with F5 |
I am having the same issue here and haven't been able to find a solution. |
I don't know what I did but the problem is gone now from my side. I regularly update so maybe that's the reason. I was never able to determine the root cause. |
I figured mine out seconds after posting, just a lack of a capital letter in the import that my editor missed. |
I confirmed this still does not work. (Vite 4.0.2 + plugin-react 3.0.0) If I changed any of the following parts, it starts working:
|
This issue will be fixed by #79. Waiting for Vite 4.1 to enable this change |
@ArnaudBarre Amazing! Thank you for your work. |
I will release a 3.1-beta version in the next hour with you want to try |
great work! |
Describe the bug
Description
There is a very odd behavior in my project with HMR not updating what the browser is displaying after editing a component.
About
insrc/About.tsx
that is used as an element for react-router<Route>
insrc/App.tsx
.About
is also wrapped with HOCwithRandom
fromsrc/withRandom.tsx
.Component
defined in the samesrc/About.tsx
file is wrapped with HOCwithCounter
fromsrc/withCounter.tsx
and used as one of children ofAbout
componentThis combination makes HMR not working as expected because any editing to
About
component is not updating what is being displayed by the browser.Findings
Updating
<h1>original text</h1>
inAbout
component does not update the text displayed in the browser.But after removing/commenting out anything related to
withCounter
HOCAbout
component reacts to changes as it should:Same goes for removing/commenting out anything related to
withRandom
:However I see changes in network tab - the browser just does not update for some reason:
![](https://camo.githubusercontent.com/9b7ecdbd472761bbe170cb54ddbb5e3270acb884b9621ec768f36510d4062ccc/68747470733a2f2f696d6167652e70726e747363722e636f6d2f696d6167652f45523873774b504b5334324c4e766a64793770365f412e706e67)
Steps to reproduce
npm run vite:start
<h1>
tag ofAbout
componentReproduction
https://stackblitz.com/edit/node-tqfxtx?file=src%2FAbout.tsx
System Info
Used Package Manager
npm
Logs
Validations
The text was updated successfully, but these errors were encountered: