mobx 6.10.0 → 6.10.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # mobx
 
+## 6.10.2
+
+### Patch Changes
+
+-   [`c8d9374d`](https://github.com/mobxjs/mobx/commit/c8d9374d4f3b05cfec0d690e0eb3ada4f619ff0b) [#3748](https://github.com/mobxjs/mobx/pull/3748) Thanks [@mweststrate](https://github.com/mweststrate)! - Fixed: #3747, computed values becoming stale if the underlying observable was created and updated outside a reactive context
+
+## 6.10.1
+
+### Patch Changes
+
+-   [`3ceeb865`](https://github.com/mobxjs/mobx/commit/3ceeb8651e328c4c7211c875696b3f5269fea834) [#3732](https://github.com/mobxjs/mobx/pull/3732) Thanks [@urugator](https://github.com/urugator)! - - fix: #3728: Observable initialization updates state version.
+    -   fix: Observable set initialization violates `enforceActions: "always"`.
+    -   fix: Changing keys of observable object does not respect `enforceActions`.
+
 ## 6.10.0
 
 ### Minor Changes

package/dist/core/atom.d.ts

@@ -2,13 +2,14 @@ import { IDerivationState_, IObservable, IDerivation, Lambda } from "../internal
 export declare const $mobx: unique symbol;
 export interface IAtom extends IObservable {
     reportObserved(): boolean;
-    reportChanged(): any;
+    reportChanged(): void;
 }
 export declare class Atom implements IAtom {
     name_: string;
     isPendingUnobservation_: boolean;
     isBeingObserved_: boolean;
     observers_: Set<IDerivation>;
+    batchId_: number;
     diffValue_: number;
     lastAccessedBy_: number;
     lowestObserverState_: IDerivationState_;

package/dist/core/globalstate.d.ts

@@ -37,6 +37,11 @@ export declare class MobXGlobals {
      * Are we in a batch block? (and how many of them)
      */
     inBatch: number;
+    /**
+     * ID of the latest batch. Used to suppress reportChanged of newly created atoms.
+     * Note the value persists even after batch ended.
+     */
+    batchId: number;
     /**
      * Observables that don't have observers anymore, and are about to be
      * suspended, unless somebody else accesses it in the same batch

package/dist/mobx.cjs.development.js

@@ -426,12 +426,14 @@ var Atom = /*#__PURE__*/function () {
     this.isPendingUnobservation_ = false;
     this.isBeingObserved_ = false;
     this.observers_ = new Set();
+    this.batchId_ = void 0;
     this.diffValue_ = 0;
     this.lastAccessedBy_ = 0;
     this.lowestObserverState_ = IDerivationState_.NOT_TRACKING_;
     this.onBOL = void 0;
     this.onBUOL = void 0;
     this.name_ = name_;
+    this.batchId_ = globalState.inBatch ? globalState.batchId : NaN;
   }
   // onBecomeObservedListeners
   var _proto = Atom.prototype;
@@ -460,11 +462,15 @@ var Atom = /*#__PURE__*/function () {
    * Invoke this method _after_ this method has changed to signal mobx that all its observers should invalidate.
    */;
   _proto.reportChanged = function reportChanged() {
+    if (!globalState.inBatch || this.batchId_ !== globalState.batchId) {
+      // We could update state version only at the end of batch,
+      // but we would still have to switch some global flag here to signal a change.
+      globalState.stateVersion = globalState.stateVersion < Number.MAX_SAFE_INTEGER ? globalState.stateVersion + 1 : Number.MIN_SAFE_INTEGER;
+      // Avoids the possibility of hitting the same globalState.batchId when it cycled through all integers (necessary?)
+      this.batchId_ = NaN;
+    }
     startBatch();
     propagateChanged(this);
-    // We could update state version only at the end of batch,
-    // but we would still have to switch some global flag here to signal a change.
-    globalState.stateVersion = globalState.stateVersion < Number.MAX_SAFE_INTEGER ? globalState.stateVersion + 1 : Number.MIN_SAFE_INTEGER;
     endBatch();
   };
   _proto.toString = function toString() {
@@ -993,7 +999,9 @@ var observableFactories = {
     return new ObservableSet(initialValues, getEnhancerFromOptions(o), o.name);
   },
   object: function object(props, decorators, options) {
-    return extendObservable(globalState.useProxies === false || (options == null ? void 0 : options.proxy) === false ? asObservableObject({}, options) : asDynamicObservableObject({}, options), props, decorators);
+    return initObservable(function () {
+      return extendObservable(globalState.useProxies === false || (options == null ? void 0 : options.proxy) === false ? asObservableObject({}, options) : asDynamicObservableObject({}, options), props, decorators);
+    });
   },
   ref: /*#__PURE__*/createDecoratorAnnotation(observableRefAnnotation),
   shallow: /*#__PURE__*/createDecoratorAnnotation(observableShallowAnnotation),
@@ -1815,6 +1823,7 @@ var MobXGlobals = function MobXGlobals() {
   this.runId = 0;
   this.mobxGuid = 0;
   this.inBatch = 0;
+  this.batchId = Number.MIN_SAFE_INTEGER;
   this.pendingUnobservations = [];
   this.pendingReactions = [];
   this.isRunningReactions = false;
@@ -1954,6 +1963,9 @@ function queueForUnobservation(observable) {
  * Avoids unnecessary recalculations.
  */
 function startBatch() {
+  if (globalState.inBatch === 0) {
+    globalState.batchId = globalState.batchId < Number.MAX_SAFE_INTEGER ? globalState.batchId + 1 : Number.MIN_SAFE_INTEGER;
+  }
   globalState.inBatch++;
 }
 function endBatch() {
@@ -2629,17 +2641,14 @@ function extendObservable(target, properties, annotations, options) {
   }
   // Pull descriptors first, so we don't have to deal with props added by administration ($mobx)
   var descriptors = getOwnPropertyDescriptors(properties);
-  var adm = asObservableObject(target, options)[$mobx];
-  startBatch();
-  try {
+  initObservable(function () {
+    var adm = asObservableObject(target, options)[$mobx];
     ownKeys(descriptors).forEach(function (key) {
       adm.extend_(key, descriptors[key],
       // must pass "undefined" for { key: undefined }
       !annotations ? true : key in annotations ? annotations[key] : true);
     });
-  } finally {
-    endBatch();
-  }
+  });
   return target;
 }
 
@@ -3325,10 +3334,9 @@ function notifyListeners(listenable, change) {
 }
 
 function makeObservable(target, annotations, options) {
-  var adm = asObservableObject(target, options)[$mobx];
-  startBatch();
-  try {
+  initObservable(function () {
     var _annotations;
+    var adm = asObservableObject(target, options)[$mobx];
     if ("development" !== "production" && annotations && target[storedAnnotationsSymbol]) {
       die("makeObservable second arg must be nullish when using decorators. Mixing @decorator syntax with annotations is not supported.");
     }
@@ -3338,9 +3346,7 @@ function makeObservable(target, annotations, options) {
     ownKeys(annotations).forEach(function (key) {
       return adm.make_(key, annotations[key]);
     });
-  } finally {
-    endBatch();
-  }
+  });
   return target;
 }
 // proto[keysSymbol] = new Set<PropertyKey>()
@@ -3359,26 +3365,23 @@ function makeAutoObservable(target, overrides, options) {
   if (isPlainObject(target)) {
     return extendObservable(target, target, overrides, options);
   }
-  var adm = asObservableObject(target, options)[$mobx];
-  // Optimization: cache keys on proto
-  // Assumes makeAutoObservable can be called only once per object and can't be used in subclass
-  if (!target[keysSymbol]) {
-    var proto = Object.getPrototypeOf(target);
-    var keys = new Set([].concat(ownKeys(target), ownKeys(proto)));
-    keys["delete"]("constructor");
-    keys["delete"]($mobx);
-    addHiddenProp(proto, keysSymbol, keys);
-  }
-  startBatch();
-  try {
+  initObservable(function () {
+    var adm = asObservableObject(target, options)[$mobx];
+    // Optimization: cache keys on proto
+    // Assumes makeAutoObservable can be called only once per object and can't be used in subclass
+    if (!target[keysSymbol]) {
+      var proto = Object.getPrototypeOf(target);
+      var keys = new Set([].concat(ownKeys(target), ownKeys(proto)));
+      keys["delete"]("constructor");
+      keys["delete"]($mobx);
+      addHiddenProp(proto, keysSymbol, keys);
+    }
     target[keysSymbol].forEach(function (key) {
       return adm.make_(key,
       // must pass "undefined" for { key: undefined }
       !overrides ? true : key in overrides ? overrides[key] : true);
     });
-  } finally {
-    endBatch();
-  }
+  });
   return target;
 }
 
@@ -3686,16 +3689,16 @@ function createObservableArray(initialValues, enhancer, name, owned) {
     owned = false;
   }
   assertProxies();
-  var adm = new ObservableArrayAdministration(name, enhancer, owned, false);
-  addHiddenFinalProp(adm.values_, $mobx, adm);
-  var proxy = new Proxy(adm.values_, arrayTraps);
-  adm.proxy_ = proxy;
-  if (initialValues && initialValues.length) {
-    var prev = allowStateChangesStart(true);
-    adm.spliceWithArray_(0, 0, initialValues);
-    allowStateChangesEnd(prev);
-  }
-  return proxy;
+  return initObservable(function () {
+    var adm = new ObservableArrayAdministration(name, enhancer, owned, false);
+    addHiddenFinalProp(adm.values_, $mobx, adm);
+    var proxy = new Proxy(adm.values_, arrayTraps);
+    adm.proxy_ = proxy;
+    if (initialValues && initialValues.length) {
+      adm.spliceWithArray_(0, 0, initialValues);
+    }
+    return proxy;
+  });
 }
 // eslint-disable-next-line
 var arrayExtensions = {
@@ -3891,11 +3894,13 @@ var ObservableMap = /*#__PURE__*/function () {
     if (!isFunction(Map)) {
       die(18);
     }
-    this.keysAtom_ = createAtom( this.name_ + ".keys()" );
-    this.data_ = new Map();
-    this.hasMap_ = new Map();
-    allowStateChanges(true, function () {
-      _this.merge(initialData);
+    initObservable(function () {
+      _this.keysAtom_ = createAtom("development" !== "production" ? _this.name_ + ".keys()" : "ObservableMap.keys()");
+      _this.data_ = new Map();
+      _this.hasMap_ = new Map();
+      if (initialData) {
+        _this.merge(initialData);
+      }
     });
   }
   var _proto = ObservableMap.prototype;
@@ -4279,6 +4284,7 @@ _Symbol$iterator$1 = Symbol.iterator;
 _Symbol$toStringTag$1 = Symbol.toStringTag;
 var ObservableSet = /*#__PURE__*/function () {
   function ObservableSet(initialData, enhancer, name_) {
+    var _this = this;
     if (enhancer === void 0) {
       enhancer = deepEnhancer;
     }
@@ -4297,13 +4303,15 @@ var ObservableSet = /*#__PURE__*/function () {
     if (!isFunction(Set)) {
       die(22);
     }
-    this.atom_ = createAtom(this.name_);
     this.enhancer_ = function (newV, oldV) {
       return enhancer(newV, oldV, name_);
     };
-    if (initialData) {
-      this.replace(initialData);
-    }
+    initObservable(function () {
+      _this.atom_ = createAtom(_this.name_);
+      if (initialData) {
+        _this.replace(initialData);
+      }
+    });
   }
   var _proto = ObservableSet.prototype;
   _proto.dehanceValue_ = function dehanceValue_(value) {
@@ -4313,12 +4321,12 @@ var ObservableSet = /*#__PURE__*/function () {
     return value;
   };
   _proto.clear = function clear() {
-    var _this = this;
+    var _this2 = this;
     transaction(function () {
       untracked(function () {
-        for (var _iterator = _createForOfIteratorHelperLoose(_this.data_.values()), _step; !(_step = _iterator()).done;) {
+        for (var _iterator = _createForOfIteratorHelperLoose(_this2.data_.values()), _step; !(_step = _iterator()).done;) {
           var value = _step.value;
-          _this["delete"](value);
+          _this2["delete"](value);
         }
       });
     });
@@ -4330,7 +4338,7 @@ var ObservableSet = /*#__PURE__*/function () {
     }
   };
   _proto.add = function add(value) {
-    var _this2 = this;
+    var _this3 = this;
     checkIfStateModificationsAreAllowed(this.atom_);
     if (hasInterceptors(this)) {
       var change = interceptChange(this, {
@@ -4347,8 +4355,8 @@ var ObservableSet = /*#__PURE__*/function () {
 
     if (!this.has(value)) {
       transaction(function () {
-        _this2.data_.add(_this2.enhancer_(value, undefined));
-        _this2.atom_.reportChanged();
+        _this3.data_.add(_this3.enhancer_(value, undefined));
+        _this3.atom_.reportChanged();
       });
       var notifySpy =  isSpyEnabled();
       var notify = hasListeners(this);
@@ -4372,7 +4380,7 @@ var ObservableSet = /*#__PURE__*/function () {
     return this;
   };
   _proto["delete"] = function _delete(value) {
-    var _this3 = this;
+    var _this4 = this;
     if (hasInterceptors(this)) {
       var change = interceptChange(this, {
         type: DELETE,
@@ -4397,8 +4405,8 @@ var ObservableSet = /*#__PURE__*/function () {
         spyReportStart(_change2);
       }
       transaction(function () {
-        _this3.atom_.reportChanged();
-        _this3.data_["delete"](value);
+        _this4.atom_.reportChanged();
+        _this4.data_["delete"](value);
       });
       if (notify) {
         notifyListeners(this, _change2);
@@ -4451,20 +4459,20 @@ var ObservableSet = /*#__PURE__*/function () {
     });
   };
   _proto.replace = function replace(other) {
-    var _this4 = this;
+    var _this5 = this;
     if (isObservableSet(other)) {
       other = new Set(other);
     }
     transaction(function () {
       if (Array.isArray(other)) {
-        _this4.clear();
+        _this5.clear();
         other.forEach(function (value) {
-          return _this4.add(value);
+          return _this5.add(value);
         });
       } else if (isES6Set(other)) {
-        _this4.clear();
+        _this5.clear();
         other.forEach(function (value) {
-          return _this4.add(value);
+          return _this5.add(value);
         });
       } else if (other !== null && other !== undefined) {
         die("Cannot initialize set from " + other);
@@ -4728,6 +4736,7 @@ var ObservableObjectAdministration = /*#__PURE__*/function () {
     if (proxyTrap === void 0) {
       proxyTrap = false;
     }
+    checkIfStateModificationsAreAllowed(this.keysAtom_);
     try {
       startBatch();
       // Delete
@@ -4775,6 +4784,7 @@ var ObservableObjectAdministration = /*#__PURE__*/function () {
     if (proxyTrap === void 0) {
       proxyTrap = false;
     }
+    checkIfStateModificationsAreAllowed(this.keysAtom_);
     try {
       startBatch();
       // Delete
@@ -4826,6 +4836,7 @@ var ObservableObjectAdministration = /*#__PURE__*/function () {
     if (proxyTrap === void 0) {
       proxyTrap = false;
     }
+    checkIfStateModificationsAreAllowed(this.keysAtom_);
     try {
       startBatch();
       // Delete
@@ -4881,6 +4892,7 @@ var ObservableObjectAdministration = /*#__PURE__*/function () {
     if (proxyTrap === void 0) {
       proxyTrap = false;
     }
+    checkIfStateModificationsAreAllowed(this.keysAtom_);
     // No such prop
     if (!hasProp(this.target_, key)) {
       return true;
@@ -5110,6 +5122,17 @@ function assertAnnotable(adm, annotation, key) {
 
 // Bug in safari 9.* (or iOS 9 safari mobile). See #364
 var ENTRY_0 = /*#__PURE__*/createArrayEntryDescriptor(0);
+var safariPrototypeSetterInheritanceBug = /*#__PURE__*/function () {
+  var v = false;
+  var p = {};
+  Object.defineProperty(p, "0", {
+    set: function set() {
+      v = true;
+    }
+  });
+  /*#__PURE__*/Object.create(p)["0"] = 1;
+  return v === false;
+}();
 /**
  * This array buffer contains two lists of properties, so that all arrays
  * can recycle their property definitions, which significantly improves performance of creating
@@ -5142,20 +5165,20 @@ var LegacyObservableArray = /*#__PURE__*/function (_StubArray, _Symbol$toStringT
       owned = false;
     }
     _this = _StubArray.call(this) || this;
-    var adm = new ObservableArrayAdministration(name, enhancer, owned, true);
-    adm.proxy_ = _assertThisInitialized(_this);
-    addHiddenFinalProp(_assertThisInitialized(_this), $mobx, adm);
-    if (initialValues && initialValues.length) {
-      var prev = allowStateChangesStart(true);
-      // @ts-ignore
-      _this.spliceWithArray(0, 0, initialValues);
-      allowStateChangesEnd(prev);
-    }
-    {
-      // Seems that Safari won't use numeric prototype setter untill any * numeric property is
-      // defined on the instance. After that it works fine, even if this property is deleted.
-      Object.defineProperty(_assertThisInitialized(_this), "0", ENTRY_0);
-    }
+    initObservable(function () {
+      var adm = new ObservableArrayAdministration(name, enhancer, owned, true);
+      adm.proxy_ = _assertThisInitialized(_this);
+      addHiddenFinalProp(_assertThisInitialized(_this), $mobx, adm);
+      if (initialValues && initialValues.length) {
+        // @ts-ignore
+        _this.spliceWithArray(0, 0, initialValues);
+      }
+      if (safariPrototypeSetterInheritanceBug) {
+        // Seems that Safari won't use numeric prototype setter untill any * numeric property is
+        // defined on the instance. After that it works fine, even if this property is deleted.
+        Object.defineProperty(_assertThisInitialized(_this), "0", ENTRY_0);
+      }
+    });
     return _this;
   }
   var _proto = LegacyObservableArray.prototype;
@@ -5310,6 +5333,24 @@ function getDebugName(thing, property) {
   }
   return named.name_;
 }
+/**
+ * Helper function for initializing observable structures, it applies:
+ * 1. allowStateChanges so we don't violate enforceActions.
+ * 2. untracked so we don't accidentaly subscribe to anything observable accessed during init in case the observable is created inside derivation.
+ * 3. batch to avoid state version updates
+ */
+function initObservable(cb) {
+  var derivation = untrackedStart();
+  var allowStateChanges = allowStateChangesStart(true);
+  startBatch();
+  try {
+    return cb();
+  } finally {
+    endBatch();
+    allowStateChangesEnd(allowStateChanges);
+    untrackedEnd(derivation);
+  }
+}
 
 var toString = objectPrototype.toString;
 function deepEqual(a, b, depth) {