fix(devtools): preserve shared connections during store cleanup#3580 (GitHub)

diff --git a/src/middleware/devtools.ts b/src/middleware/devtools.ts
index cc4561c..0038d77 100644
--- a/src/middleware/devtools.ts
+++ b/src/middleware/devtools.ts
@@ -156,10 +156,11 @@ const extractConnectionInformation = (
 const removeStoreFromTrackedConnections = (
   name: string | undefined,
   store: string | undefined,
+  api: StoreInformation,
 ) => {
   if (store === undefined) return
   const connectionInfo = trackedConnections.get(name)
-  if (!connectionInfo) return
+  if (connectionInfo?.stores[store] !== api) return
   delete connectionInfo.stores[store]
   if (Object.keys(connectionInfo.stores).length === 0) {
     trackedConnections.delete(name)
@@ -243,15 +244,19 @@ const devtoolsImpl: DevtoolsImpl =
       )
       return r
     }) as NamedSet<S>
+    let unsubscribeFromStore: (() => void) | undefined
     ;(api as StoreApi<S> & StoreDevtools<S>).devtools = {
       cleanup: () => {
+        unsubscribeFromStore?.()
+        unsubscribeFromStore = undefined
+        removeStoreFromTrackedConnections(options.name, store, api)
         if (
+          (store === undefined || !trackedConnections.has(options.name)) &&
           connection &&
           typeof (connection as any).unsubscribe === 'function'
         ) {
           ;(connection as any).unsubscribe()
         }
-        removeStoreFromTrackedConnections(options.name, store)
       },
     }
 
@@ -298,7 +303,7 @@ const devtoolsImpl: DevtoolsImpl =
       }
     }
 
-    ;(
+    unsubscribeFromStore = (
       connection as unknown as {
         // FIXME https://github.com/reduxjs/redux-devtools/issues/1097
         subscribe: (

Truncated excerpt: showing 80 of 156 lines

diff --git a/tests/devtools.test.tsx b/tests/devtools.test.tsx
index 3778ab9..f4d8554 100644
--- a/tests/devtools.test.tsx
+++ b/tests/devtools.test.tsx
@@ -96,9 +96,12 @@ const extensionConnector = {
     const api: Connection['api'] = {
       subscribe: vi.fn((f: (m: unknown) => void) => {
         subscribers.push(f)
-        return () => {}
+        return () => {
+          subscribers.splice(subscribers.indexOf(f), 1)
+        }
       }),
       unsubscribe: vi.fn(() => {
+        subscribers.splice(0)
         connectionMap.delete(
           areNameUndefinedMapsNeeded ? options.testConnectionId : key,
         )
@@ -2687,6 +2690,136 @@ describe('when create devtools was called multiple times with `name` and `store`
 })
 
 describe('cleanup', () => {
+  it('should preserve a replacement store when the original store is cleaned up', () => {
+    const options = {
+      name: 'replacement-before-cleanup',
+      store: 'shared',
+      enabled: true,
+    }
+    const original = createStore(devtools(() => ({ count: 0 }), options))
+    const replacement = createStore(devtools(() => ({ count: 0 }), options))
+    const [connection] = getNamedConnectionApis(options.name)
+
+    original.devtools.cleanup()
+
+    expect(connection.unsubscribe).not.toHaveBeenCalled()
+    const [subscriber] = getNamedConnectionSubscribers(options.name)
+    subscriber({
+      type: 'DISPATCH',
+      payload: { type: 'JUMP_TO_STATE' },
+      state: JSON.stringify({ shared: { count: 20 } }),
+    })
+    expect(replacement.getState()).toEqual({ count: 20 })
+    expect(original.getState()).toEqual({ count: 0 })
+
+    original.devtools.cleanup()
+    expect(connection.unsubscribe).not.toHaveBeenCalled()
+    replacement.devtools.cleanup()
+    expect(connection.unsubscribe).toHaveBeenCalledTimes(1)
+  })
+
+  it.each([1, 2])(
+    'should preserve other stores on a shared connection after %i cleanup calls',
+    (cleanupCalls) => {
+      const name = `shared-cleanup-${cleanupCalls}`
+      const store1 = createStore(
+        devtools(() => ({ count: 0 }), { name, store: 'first', enabled: true }),
+      )
+      const store2 = createStore(
+        devtools(() => ({ count: 0 }), {
+          name,
+          store: 'second',
+          enabled: true,
+        }),
+      )
+      const subscribers = namedConnections.get(name)!.subscribers
+
+      for (let i = 0; i < cleanupCalls; i++) {
+        store1.devtools.cleanup()
+      }
+      subscribers.forEach((subscriber) =>
+        subscriber({
+          type: 'DISPATCH',
+          payload: { type: 'JUMP_TO_STATE' },
+          state: JSON.stringify({
+            first: { count: 10 },
+            second: { count: 20 },
+          }),
+        }),
+      )
+