fix #3109: spy: computed shouldn't report update unless the value changed

.changeset/yellow-apples-move.md

@@ -0,0 +1,5 @@
+---
+"mobx": patch
+---
+
+fix #3109: spy: computed shouldn't report update unless the value changed

packages/mobx/__tests__/v5/base/spy.js

@@ -123,11 +123,51 @@ test("bound actions report correct object (discussions/3140)", () => {
     const appState = new AppState();
     const { actionBound, autoActionBound } = appState;
 
-    mobx.spy((event) => {
+    let events = [];
+    const disposeSpy = mobx.spy((event) => {
         if (event.type !== 'action') return;
-        expect(event.object).toBe(appState);
+        events.push(event);
     });
 
-    actionBound();
-    autoActionBound();
+    try {
+        actionBound();
+        expect(events.pop().object).toBe(appState)
+        autoActionBound();
+        expect(events.pop().object).toBe(appState)
+    } finally {
+        disposeSpy();
+    }
+})
+
+test("computed shouldn't report update unless the value changed #3109", () => {
+    const number = mobx.observable({
+        value: 0,
+        get isEven() {
+            return (this.value % 2) === 0;
+        }
+    })
+
+    const events = [];
+    const disposeSpy = mobx.spy(event => {
+        if (event.observableKind === 'computed' && event.type === 'update') {
+            events.push(event);
+        };
+    });
+
+    const disposeAutorun = mobx.autorun(() => number.isEven);
+
+    try {
+        expect(events.pop()).toMatchObject({ oldValue: { cause: null }, newValue: true });
+        number.value++; // 1        
+        expect(events.pop()).toMatchObject({ oldValue: true, newValue: false });
+        number.value++; // 2   
+        expect(events.pop()).toMatchObject({ oldValue: false, newValue: true });
+        number.value += 2; // 4       
+        expect(events.pop()).toBe(undefined);
+        number.value += 2; // 6
+        expect(events.pop()).toBe(undefined);
+    } finally {
+        disposeSpy();
+        disposeAutorun();
+    }
 })

packages/mobx/src/core/computedvalue.ts

@@ -204,17 +204,6 @@ export class ComputedValue<T> implements IObservable, IComputedValue<T>, IDeriva
             /* see #1208 */ this.dependenciesState_ === IDerivationState_.NOT_TRACKING_
         const newValue = this.computeValue_(true)
 
-        if (__DEV__ && isSpyEnabled()) {
-            spyReport({
-                observableKind: "computed",
-                debugObjectName: this.name_,
-                object: this.scope_,
-                type: "update",
-                oldValue: this.value_,
-                newValue
-            } as IComputedDidChange)
-        }
-
         const changed =
             wasSuspended ||
             isCaughtException(oldValue) ||
@@ -223,6 +212,17 @@ export class ComputedValue<T> implements IObservable, IComputedValue<T>, IDeriva
 
         if (changed) {
             this.value_ = newValue
+
+            if (__DEV__ && isSpyEnabled()) {
+                spyReport({
+                    observableKind: "computed",
+                    debugObjectName: this.name_,
+                    object: this.scope_,
+                    type: "update",
+                    oldValue,
+                    newValue
+                } as IComputedDidChange)
+            }
         }
 
         return changed