HMR not working on WSL2

[rbutera]

Describe the bug

This issue occurs in any fresh vite app (npm create vite@latest) on Windows Subsystem for Linux 2.

If I update the file _index.tsx, I get the following output in terminal:

13:57:46 [vite] hmr update /src/App.tsx

Interestingly, in the browser console, I CAN(!) see the following message:

[vite] hot updated: /src/App.tsx

However is no change to the browser contents at all. If I refresh the page manually then the changes are propagated as expected.

There is no error message in the browser console.

Out of curiosity, I have checked the Next.js dev server which works as expected.

I have tested the exact same repo on MacOS (same node.js version) and HMR works as expected in that environment.

I have tried setting server.hmr.host to both 127.0.0.1 and localhost in vite.config.ts but this does not fix the problem. usePolling also has no effect, I suspect because a file change IS detected.

Related Issues

Issue #5878

Please note this is not a duplicate of #5878 despite the same title. The project is NOT in the windows filesystem, it is in the linux filesystem.

Issue #12142

The response by @sapphi-red in #12142 is also not relevant. Vite detects a file change.

Reproduction

https://stackblitz.com/edit/vitejs-vite-yfza6z?file=index.html

Steps to reproduce

use wsl2

System Info

System:
    OS: Linux 5.15 Pengwin 12 (bookworm)
    CPU: (16) x64 AMD Ryzen 7 7800X3D 8-Core Processor
    Memory: 12.66 GB / 15.48 GB
    Container: Yes
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 21.7.3 - ~/.asdf/installs/nodejs/21.7.3/bin/node
    Yarn: 1.22.22 - /home/linuxbrew/.linuxbrew/bin/yarn
    npm: 10.5.0 - ~/.asdf/plugins/nodejs/shims/npm
    pnpm: 9.0.6 - ~/.asdf/installs/nodejs/21.7.3/bin/pnpm
    Watchman: 2024.03.18.00 - /home/linuxbrew/.linuxbrew/bin/watchman
  npmPackages:
    @vitejs/plugin-react-swc: ^3.5.0 => 3.6.0
    vite: ^5.2.11 => 5.2.11

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-yfza6z (Open reproduction)

[rbutera]

Nevermind. Turns out it was Adguard filtering out loopback connections in localhost.

In adguard settings, go to advanced settings and then disable Filter localhost