Skip to content

Commit

Permalink
fix(hmr): multiple updates happened when invalidate is called while m…
Browse files Browse the repository at this point in the history
…ultiple tabs open (#16307)
  • Loading branch information
sapphi-red authored Mar 29, 2024
1 parent 01af308 commit 21cc10b
Show file tree
Hide file tree
Showing 4 changed files with 50 additions and 1 deletion.
1 change: 1 addition & 0 deletions packages/vite/src/node/server/hmr.ts
Original file line number Diff line number Diff line change
Expand Up @@ -533,6 +533,7 @@ export function handlePrunedModules(
const t = Date.now()
mods.forEach((mod) => {
mod.lastHMRTimestamp = t
mod.lastHMRInvalidationReceived = false
debugHmr?.(`[dispose] ${colors.dim(mod.file)}`)
})
hot.send({
Expand Down
8 changes: 7 additions & 1 deletion packages/vite/src/node/server/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -787,7 +787,13 @@ export async function _createServer(

hot.on('vite:invalidate', async ({ path, message }) => {
const mod = moduleGraph.urlToModuleMap.get(path)
if (mod && mod.isSelfAccepting && mod.lastHMRTimestamp > 0) {
if (
mod &&
mod.isSelfAccepting &&
mod.lastHMRTimestamp > 0 &&
!mod.lastHMRInvalidationReceived
) {
mod.lastHMRInvalidationReceived = true
config.logger.info(
colors.yellow(`hmr invalidate `) +
colors.dim(path) +
Expand Down
8 changes: 8 additions & 0 deletions packages/vite/src/node/server/moduleGraph.ts
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,13 @@ export class ModuleNode {
ssrModule: Record<string, any> | null = null
ssrError: Error | null = null
lastHMRTimestamp = 0
/**
* `import.meta.hot.invalidate` is called by the client.
* If there's multiple clients, multiple `invalidate` request is received.
* This property is used to dedupe those request to avoid multiple updates happening.
* @internal
*/
lastHMRInvalidationReceived = false
lastInvalidationTimestamp = 0
/**
* If the module only needs to update its imports timestamp (e.g. within an HMR chain),
Expand Down Expand Up @@ -199,6 +206,7 @@ export class ModuleGraph {

if (isHmr) {
mod.lastHMRTimestamp = timestamp
mod.lastHMRInvalidationReceived = false
} else {
// Save the timestamp for this invalidation, so we can avoid caching the result of possible already started
// processing being done for this module
Expand Down
34 changes: 34 additions & 0 deletions playground/hmr/__tests__/hmr.spec.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
import { beforeAll, describe, expect, it, test } from 'vitest'
import type { Page } from 'playwright-chromium'
import { hasWindowsUnicodeFsBug } from '../../hasWindowsUnicodeFsBug'
import {
addFile,
browser,
browserLogs,
editFile,
getBg,
Expand Down Expand Up @@ -175,6 +177,38 @@ if (!isBuild) {
await untilUpdated(() => el.textContent(), 'child updated')
})

test('invalidate works with multiple tabs', async () => {
let page2: Page
try {
page2 = await browser.newPage()
await page2.goto(viteTestUrl)

const el = await page.$('.invalidation')
await untilBrowserLogAfter(
() =>
editFile('invalidation/child.js', (code) =>
code.replace('child', 'child updated'),
),
[
'>>> vite:beforeUpdate -- update',
'>>> vite:invalidate -- /invalidation/child.js',
'[vite] invalidate /invalidation/child.js',
'[vite] hot updated: /invalidation/child.js',
'>>> vite:afterUpdate -- update',
// if invalidate dedupe doesn't work correctly, this beforeUpdate will be called twice
'>>> vite:beforeUpdate -- update',
'(invalidation) parent is executing',
'[vite] hot updated: /invalidation/parent.js',
'>>> vite:afterUpdate -- update',
],
true,
)
await untilUpdated(() => el.textContent(), 'child updated')
} finally {
await page2.close()
}
})

test('soft invalidate', async () => {
const el = await page.$('.soft-invalidation')
expect(await el.textContent()).toBe(
Expand Down

0 comments on commit 21cc10b

Please sign in to comment.