Mobx reaction not tracking observable value passed from constructor parameter

Question

I have this class:

class Mother{
   @observable
   name: string
   child: Child = new Child(this)
   constructor(){
       makeObservable(this)
   }
}

class Child{
    constructor(mother: Mother){
       const disposer = reaction(() => [mother.name], ()=>{})
       console.log(getDependencyTree(disposer));
    }
}

The output shows that the disposer has no dependency on mother.name. What am I missing?

Answer 1

The problem is the order of initialization: Child object is initialized before makeObservable(this) is called, thus mother.name is not yet an observable when running in reaction. By moving the intialization of child object after calling makeObservable(this), I solved the problem.