fix(vuebugger): no memory leak on module level debugs and HMR

Author: vinpogo

.changeset/strict-lights-love.md

@@ -0,0 +1,5 @@
+---
+"@vingy/vuebugger": patch
+---
+
+fix: module level debug calls no longer leak on HMR

packages/vuebugger/src/debug.ts

@@ -20,6 +20,11 @@ export type DebugOptions = {
   enable?: MaybeRefOrGetter<boolean>
 }
 
+export const moduleScopes = new Map<
+  string,
+  ReturnType<typeof effectScope>
+>()
+
 const createDebugScope = <T extends Record<string, any>>(
   groupId: VuebuggerEntry['groupId'],
   state: T,
@@ -41,11 +46,24 @@ const createDebugScope = <T extends Record<string, any>>(
     debugState: state,
   }
 
-  const scope = getCurrentScope() ?? effectScope()
-  scope.run(() => {
-    onScopeDispose(() => remove(entry))
-    run(entry)
-  })
+  const currentScope = getCurrentScope()
+
+  if (currentScope) {
+    currentScope.run(() => {
+      onScopeDispose(() => remove(entry))
+      run(entry)
+    })
+  } else {
+    const existing = moduleScopes.get(groupId)
+    if (existing) existing.stop()
+
+    const scope = effectScope()
+    moduleScopes.set(groupId, scope)
+    scope.run(() => {
+      onScopeDispose(() => remove(entry))
+      run(entry)
+    })
+  }
 }
 
 export const debug = <T extends Record<string, any>>(

packages/vuebugger/src/debug.unit.test.ts

@@ -1,7 +1,11 @@
 import { expect, test, vi } from 'vitest'
 import { effectScope, nextTick, ref } from 'vue'
 
-import { debug, setUidGenerator } from './debug'
+import {
+  debug,
+  moduleScopes,
+  setUidGenerator,
+} from './debug'
 import { byGroupId, byUid } from './registry'
 
 // ---- helpers ----------------------------------------------------------------
@@ -17,6 +21,7 @@ const setup = () => {
 const teardown = () => {
   byUid.clear()
   byGroupId.clear()
+  moduleScopes.clear()
 }
 
 // ---- debug() without options ------------------------------------------------
@@ -341,6 +346,47 @@ test('enable boolean false — never registers', async () => {
   teardown()
 })
 
+// ---- module-level / HMR -----------------------------------------------------
+
+test('HMR: re-executing debug outside a scope with same groupId stops old scope and keeps only one entry', async () => {
+  setup()
+  const state = { count: 1 }
+
+  // First "module execution"
+  debug('myStore', state)
+  await nextTick()
+  expect(byUid.size).toBe(1)
+  expect(moduleScopes.size).toBe(1)
+  const firstScope = moduleScopes.get('myStore')
+
+  // Simulate HMR: module re-executes, same groupId
+  setup()
+  const state2 = { count: 2 }
+  debug('myStore', state2)
+  await nextTick()
+
+  // Old scope should be stopped, only one entry remains
+  expect(firstScope?.active).toBe(false)
+  expect(byUid.size).toBe(1)
+  expect(moduleScopes.size).toBe(1)
+  expect(moduleScopes.get('myStore')).not.toBe(firstScope)
+
+  teardown()
+})
+
+test('module-level: registers entry outside a component scope', async () => {
+  setup()
+  const state = { count: 1 }
+
+  debug('myStore', state)
+  await nextTick()
+
+  expect(byUid.size).toBe(1)
+  expect(moduleScopes.has('myStore')).toBe(true)
+
+  teardown()
+})
+
 // ---- production guard -------------------------------------------------------
 
 test('production guard: returns state but registers nothing when DEV is false', async () => {