fix(reactivity): avoid duplicate raw/proxy entries in Set.add (#14545)

Author: edison1105

packages/reactivity/__tests__/collections/Set.spec.ts

@@ -1,4 +1,11 @@
-import { effect, isReactive, reactive, toRaw } from '../../src'
+import {
+  effect,
+  isReactive,
+  reactive,
+  readonly,
+  shallowReactive,
+  toRaw,
+} from '../../src'
 
 describe('reactivity/collections', () => {
   function coverCollectionFn(collection: Set<any>, fnName: string) {
@@ -403,6 +410,34 @@ describe('reactivity/collections', () => {
       expect(dummy).toBe(false)
     })
 
+    it('should not add readonly versions of existing raw values', () => {
+      const rawValue = {}
+      const wrappedValue = readonly(rawValue)
+      const set = reactive(new Set([rawValue]))
+
+      expect(set.has(wrappedValue)).toBe(true)
+
+      set.add(wrappedValue)
+
+      expect(set.size).toBe(1)
+      expect(toRaw(set).has(rawValue)).toBe(true)
+      expect(toRaw(set).has(wrappedValue)).toBe(false)
+    })
+
+    it('should not add proxy versions of existing raw values to shallow sets', () => {
+      const rawValue = {}
+      const wrappedValue = reactive(rawValue)
+      const set = shallowReactive(new Set([rawValue]))
+
+      expect(set.has(wrappedValue)).toBe(true)
+
+      set.add(wrappedValue)
+
+      expect(set.size).toBe(1)
+      expect(toRaw(set).has(rawValue)).toBe(true)
+      expect(toRaw(set).has(wrappedValue)).toBe(false)
+    })
+
     it('should warn when set contains both raw and reactive versions of the same object', () => {
       const raw = new Set()
       const rawKey = {}

packages/reactivity/src/collectionHandlers.ts

@@ -169,13 +169,17 @@ function createInstrumentations(
           add(this: SetTypes, value: unknown) {
             const target = toRaw(this)
             const proto = getProto(target)
+            const rawValue = toRaw(value)
             const valueToAdd =
               !shallow && !isShallow(value) && !isReadonly(value)
-                ? toRaw(value)
+                ? rawValue
                 : value
             const hadKey =
               proto.has.call(target, valueToAdd) ||
-              (value !== valueToAdd && proto.has.call(target, value))
+              (hasChanged(value, valueToAdd) &&
+                proto.has.call(target, value)) ||
+              (hasChanged(rawValue, valueToAdd) &&
+                proto.has.call(target, rawValue))
             if (!hadKey) {
               target.add(valueToAdd)
               trigger(target, TriggerOpTypes.ADD, valueToAdd, valueToAdd)