6.1.1 behaviour change: no longer possible to reassign functions in observables

[yl92]

---

Update: here is a repo with runnable code for quicker inspection:
https://github.com/troydraws/playground-mobx

---

I had been on MobX 6.0.4 before; after updating to MobX 6.1.1, In the following example, reassigning a new function to the normalFunc property will throw, but not actionFunc:

import { observable, action, isAction } from 'mobx';

const obj = observable({
  value: 1,
  actionFunc: action(() => obj.value++),
  normalFunc: () => console.log('this is a func'),
})

console.log(isAction(obj.actionFunc)); // <- true
console.log(isAction(obj.normalFunc)); // <- true

obj.actionFunc = () => {
  console.log('this is a new actionFunc');
  obj.value++
} // <- runs fine with or without wrapping into action()

obj.normalFunc = () => {
  console.log('this is a new normalFunc')
} // <- TypeError: 'set' on proxy: trap returned falsish for property 'normalFunc'

Previously I had been thinking of functions in observables like normalFunc and actionFunc as observable references to functions. I treat them just like other keys with primitive values and can be overridden any time and trigger updates, which I had been doing extensively... Went to check the 6.1 changelog, and found out that "All annotated and non-observable props (action/flow) are non-writable. Previously writable.". I guess that's why this is now throwing?

Not sure if this was an intended behaviour as a result of the change?

[danielkcz]

If you think you have found a bug, creating an issue is generally better than a discussion. Either way, can you provide runnable reproduction that we can inspect?

[yl92]

Thanks Fredy, I wasn't sure if it is a bug or if it was intended behaviour so thought it'd be more fitting to post a question instead. The code snippet inside the question is directly runnable :)

[yl92]

https://github.com/troydraws/playground-mobx <- So i made one with a bit more details & experiments, have a play! It all works fine with 6.0.4.

[mweststrate]

But yes the behaviour has been made explicit. So what you might be looking for to have observable actions is: annotate the field with observable, and wrap the value in action.

…

On Thu, 28 Jan 2021, 20:03 Daniel K., ***@***.***> wrote: If you think you have found a bug, creating an issue is generally better than a discussion. Either way, can you provide runnable reproduction that we can inspect? — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#2760 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAN4NBFUT6NP5ZB6IK5XQZ3S4G7J3ANCNFSM4WXRE4CA> .

[yl92]

Thanks Michel, that sounds like quite a bit of extra work... haha for the time being I might just stick with an older version. I've updated with a little demo repo to show the differences if you are interested to see, though I guess you'd be expecting to see the results anyways: https://github.com/troydraws/playground-mobx

[urugator]

Since mobx 6.0 all functions are auto converted to action (unless you specify otherwise). Action fields were never observable.
Since mobx 6.1 these non-observable fields are not writable to prevent errors where you would assume that changing the value (function) would notify observers.
If the function is already an action, we simply ignore the field, sort of assuming it's already set-up properly... However I agree that may not be an ideal behavior as you end up in a similar situation which we want to prevent by making actions non-writable ... not entirely sure about this...
We are also considering that auto converted functions become both observable and actions... (therefore writable and additionally enumerable)

[yl92]

thanks, that thread does give a bit more insight, i'll have a think/play later on... I've added the isAction & isObservableProp logs now.

[yl92]

^^ logs with 6.0.4

[yl92]

^^ 6.1.1

[urugator]

As you can see there is a "bug" in 6.0 ... firstly the observer somehow subscribes for prop that is not observable and then the property suddenly becomes observable on assigment. What would be the point of making field non-observable if it can't prevent subscription and becomes observable on assigment...
Also you would probably get different behavior with proxy: false option (on 6.0).

[yl92]

I saw that yeah, a little funny 😅 Let me have a play this weekend to figure things out a bit more... thanks for the help!