🐛 BUG: Vite's HMR not working with client-side scripts in new Beta

[kylesloper]

What version of astro are you using?

1.0.0-beta.50

Are you using an SSR adapter? If so, which one?

N/A

What package manager are you using?

npm

What operating system are you using?

Windows

Describe the Bug

To be clear, I have searched the docs to see if this is intended behaviour but I can't see anything noting on it. Using any Astro project returns the same result in which the Vite server must be restarted for changes in client side scripts to take effect.

I have only tested this on my Windows machine - not sure if this is OS related.

Link to Minimal Reproducible Example

N/A: issue present on every Astro project

Participation

• [ ] I am willing to submit a pull request for this issue.

[bholmesdev]

Thanks for reporting @kylesloper! So far, I've tested:

• A React component using any client: directive
• Hoisted scripts using a standard script tag (triggers full-page refresh)
• Inline scripts using is:inline (triggers full-page refresh)

Could you share which features are failing for you specifically? I'm interested if this is a windows issue...

[kylesloper]

• Svelte component with any client directive: works as expected

• Scripts with vanilla JS and no hoisted import etc:

<script>
   console.log("Hello World")
</script>

and then when making changes to this client script

<script>
    console.log("Goodbye World")
</script>

Vite does not do a full page refresh or HMR. To see new changes you must restart the server.

• Inline client scripts does the same. No refresh.

[bholmesdev]

Got it, so hoisted and inline scripts specifically. I'm still unable to replicate on my end (tried multiple browsers to be sure), so I'm not sure if this is a windows issue. I'll try replicating on a windows machine to see if that's the culprit.

In the meantime, would you mind sending a reproduction on stackblitz to be 100% sure?

[kylesloper]

Hmm that's strange. Stackblitz working as expected but not locally in VS code. Do you have any suggestions @bholmesdev.

https://stackblitz.com/edit/withastro-astro-9uu85z?file=src/pages/index.astro

[silveltman]

Having the same issue here. Made a reproduction: https://github.com/withastro/astro/issues/3832

I get the issue in all browsers while on my windows machine. It seemed to suddenly have arrised, earlier I wasn't having this problem.

[arimgibson]

Can confirm that this seems Windows-specific. I decided to give it a shot using Windows Subsystem for Linux (i.e. running linux on Windows) and everything worked as expected.

Trying WSL or a Linux VM could be a temporary solution @kylesloper @silveltman . Using WSL (don't want to explain detailed VM networking), you should be able to run the actual astro server on Linux, and then continue coding/viewing on Windows

[tusamni]

Yup, this is happening to me on Windows 11 and is very frustrating when doing development with client side scripts.

[micvolo]

me too, i also have the same problem on windows 11 and astro 1.1.1. WIth WSL everything works as expected. So its a windows-related bug. Does someone found a solution or we are bound to WSL?

[nomorejalapenos]

this is the last thing that keeps me from fully enjoying astro

[FredKSchott]

Bumping this up to urgent to make sure this gets looked at. Thanks everyone who has reported this so far

[matthewp]

https://user-images.githubusercontent.com/361671/189226996-c71f67c4-dd9b-49fb-84b0-8edd217c1758.mp4

What am I missing here, it seems to be HMRing just fine.

[tusamni]

I did a simple test, and it does indeed work with is:inline.

It didn't work for me with a hoisted script. That might be by design, I'm no expert.

[matthewp]

Ok great, so it's hoisted scripts specifically, I can see that now @tusamni, thank you.

[arimgibson]

Strange @matthewp ... Personally I was using command prompt instead of PowerShell, what about others? Wouldn't have guessed that as a potential issue; will try with PowerShell later today

Edit: seems like the consensus is that it's a hoisted scripts problem, not dependant on the type of Windows shell :)

[matthewp]

Found the problem.

[matthewp]

PR will go out today: https://github.com/withastro/astro/pull/4645/

[matthewp]

This fix is going out with 1.1.8 right now.