Potential Vite HMR Bug

[desessein]

Hi everyone.

I came across a bug in my application that caused the wrong component to be reloaded. Given two components, a Parent.vue and Child.vue, it happens that when I modify the Child.vue component, the one that gets hot-module reloaded is the Parent.vue component.

It seems to be something related to the length of its path. For example, given these two paths (from my real project):

/@fs/C:/Users/leonardo.silva/Documents/Projects/SISPREV_MAIS/web/apps/cadastro/src/components/cadastro/terceiro/juridica/dados-bancarios/tabela/Tabela.vue /@fs/C:/Users/leonardo.silva/Documents/Projects/SISPREV_MAIS/web/apps/cadastro/src/components/cadastro/terceiro/juridica/dados-bancarios/tabela/T.vue

The second second one, which is shorter, will be correctly updated, while the first won't. In the first case, the parent component will be updated instead.

Looking at the source code and debugging it I found it out to be related to these lines on the hmr.ts file
for (const hook of config.getSortedPluginHooks('handleHotUpdate')) { const filteredModules = await hook(hmrContext) if (filteredModules) { hmrContext.modules = filteredModules } }

The filteredModules variable will host both the Child.vue and Parent.vue modules, but, as it is written, it only matters for the last one. If the last module returned by await hook(hmrContext) is Parent.vue, it will override the module to be reloaded, which is my Child.vue component.

TL;DR:
This line causes a bug in my application if (filteredModules) { hmrContext.modules = filteredModules }, overriding the component to be updated with the last component returned by this line await hook(hmrContext). Seems to be a bug related to the path length of the component and the order returned by config.getSortedPluginHooks

I just want to know if this is expected or is it actually a bug? A reproduction repo would take me some time to set up, since I'm not sure what specifically causes it.