mobx 7.0.1 → 7.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "mobx",
-    "version": "7.0.1",
+    "version": "7.0.2",
     "description": "Simple, scalable state management.",
     "source": "src/mobx.ts",
     "type": "commonjs",

package/src/types/observableset.ts

@@ -265,17 +265,42 @@ export class ObservableSet<T = any> implements Set<T>, IInterceptable<ISetWillCh
             other = new Set(other)
         }
 
-        transaction(() => {
-            if (Array.isArray(other)) {
-                this.clear()
-                other.forEach(value => this.add(value))
-            } else if (isES6Set(other)) {
-                this.clear()
-                other.forEach(value => this.add(value))
-            } else if (other !== null && other !== undefined) {
-                die(41, other)
-            }
-        })
+        if (Array.isArray(other) || isES6Set(other)) {
+            // Only emit `delete`/`add` events (and `reportChanged`) for values that
+            // actually change, instead of clearing and re-adding everything. `add` and
+            // `delete` are already no-ops for values that are respectively already
+            // present or already absent, so we just need to avoid deleting values that
+            // are part of the replacement. See #3761.
+            transaction(() => {
+                // Collect the desired values for quick lookup. `other` is already a Set
+                // here when it was passed (or snapshotted from an observable set) as one,
+                // so reuse it rather than allocating another; arrays are wrapped (which
+                // also dedupes them).
+                const replacementValues: Set<T> = isES6Set(other)
+                    ? other
+                    : new Set<T>(other as Iterable<T>)
+                // Short-circuit the trivial cases: an empty replacement is just a clear,
+                // and replacing into an empty set only needs the adds.
+                if (replacementValues.size === 0) {
+                    this.clear()
+                    return
+                }
+                if (this.data_.size === 0) {
+                    replacementValues.forEach(value => this.add(value))
+                    return
+                }
+                // Delete values that are not part of the replacement.
+                for (const value of this.data_.values()) {
+                    if (!replacementValues.has(this.dehanceValue_(value))) {
+                        this.delete(value)
+                    }
+                }
+                // Add new values; values that are already present are a no-op.
+                replacementValues.forEach(value => this.add(value))
+            })
+        } else if (other !== null && other !== undefined) {
+            die(41, other)
+        }
 
         return this
     }