fix(reactive): fix computed/tracker did not recollect dependencies

Author: janryWang

packages/reactive/src/__tests__/annotations.spec.ts

@@ -248,3 +248,26 @@ test('computed with computed array length', () => {
   obs.arr = []
   expect(handler).toBeCalledWith(false)
 })
+
+test('computed recollect dependencies', () => {
+  const computed = jest.fn()
+  const obs = model({
+    aa: 'aaa',
+    bb: 'bbb',
+    cc: 'ccc',
+    get compute() {
+      computed()
+      if (this.aa === 'aaa') {
+        return this.bb
+      }
+      return this.cc
+    },
+  })
+  const handler = jest.fn()
+  autorun(() => {
+    handler(obs.compute)
+  })
+  obs.aa = '111'
+  obs.bb = '222'
+  expect(computed).toBeCalledTimes(2)
+})

packages/reactive/src/__tests__/autorun.spec.ts

@@ -563,3 +563,60 @@ test('atom mutate value by computed depend', () => {
   expect(handler).toBeCalledWith(undefined, undefined)
   expect(handler).toBeCalledWith(123, 321)
 })
+
+test('autorun recollect dependencies', () => {
+  const obs = observable<any>({
+    aa: 'aaa',
+    bb: 'bbb',
+    cc: 'ccc',
+  })
+  const fn = jest.fn()
+  autorun(() => {
+    fn()
+    if (obs.aa === 'aaa') {
+      return obs.bb
+    }
+    return obs.cc
+  })
+  obs.aa = '111'
+  obs.bb = '222'
+  expect(fn).toBeCalledTimes(2)
+})
+
+test('reaction recollect dependencies', () => {
+  const obs = observable<any>({
+    aa: 'aaa',
+    bb: 'bbb',
+    cc: 'ccc',
+  })
+  const fn1 = jest.fn()
+  const fn2 = jest.fn()
+  const trigger1 = jest.fn()
+  const trigger2 = jest.fn()
+  reaction(() => {
+    fn1()
+    if (obs.aa === 'aaa') {
+      return obs.bb
+    }
+    return obs.cc
+  }, trigger1)
+  reaction(
+    () => {
+      fn2()
+      if (obs.aa === 'aaa') {
+        return obs.bb
+      }
+      return obs.cc
+    },
+    trigger2,
+    {
+      fireImmediately: true,
+    }
+  )
+  obs.aa = '111'
+  obs.bb = '222'
+  expect(fn1).toBeCalledTimes(2)
+  expect(trigger1).toBeCalledTimes(1)
+  expect(fn2).toBeCalledTimes(2)
+  expect(trigger2).toBeCalledTimes(2)
+})

packages/reactive/src/__tests__/tracker.spec.ts

@@ -37,3 +37,29 @@ test('nested tracker', () => {
   expect(fn).toBeCalledTimes(2)
   tracker.dispose()
 })
+
+test('tracker recollect dependencies', () => {
+  const obs = observable<any>({
+    aa: 'aaa',
+    bb: 'bbb',
+    cc: 'ccc',
+  })
+  const fn = jest.fn()
+  const view = () => {
+    fn()
+    if (obs.aa === 'aaa') {
+      return obs.bb
+    }
+    return obs.cc
+  }
+  const handler = () => {
+    tracker.track(view)
+  }
+  const tracker = new Tracker(handler)
+
+  tracker.track(view)
+  obs.aa = '111'
+  obs.bb = '222'
+  expect(fn).toBeCalledTimes(2)
+  tracker.dispose()
+})

packages/reactive/src/annotations/computed.ts

@@ -9,6 +9,7 @@ import {
   isUntracking,
   batchStart,
   batchEnd,
+  releaseBindingReactions,
 } from '../reaction'
 
 interface IValue<T = any> {
@@ -55,6 +56,7 @@ export const computed: IComputed = createAnnotation(
     }
     function reaction() {
       if (ReactionStack.indexOf(reaction) === -1) {
+        releaseBindingReactions(reaction)
         try {
           ReactionStack.push(reaction)
           compute()

packages/reactive/src/tracker.ts

@@ -1,7 +1,12 @@
 import { ReactionStack } from './environment'
 import { isFn } from './checkers'
 import { Reaction } from './types'
-import { batchEnd, batchStart, disposeBindingReactions } from './reaction'
+import {
+  batchEnd,
+  batchStart,
+  disposeBindingReactions,
+  releaseBindingReactions,
+} from './reaction'
 
 export class Tracker {
   private results: any
@@ -21,6 +26,7 @@ export class Tracker {
     if (!isFn(tracker)) return this.results
     if (this.track._boundary > 0) return
     if (ReactionStack.indexOf(this.track) === -1) {
+      releaseBindingReactions(this.track)
       try {
         batchStart()
         ReactionStack.push(this.track)