mobx 7.0.0 → 7.0.2

package/dist/mobx.umd.development.js

@@ -265,7 +265,8 @@
       constructor(name_ = "Atom@" + getNextId() ) {
         this.name_ = void 0;
         this.flags_ = 0b000;
-        this.observers_ = new Set();
+        // Allocated lazily on first observer to save memory.
+        this.observers_ = null;
         this.lastAccessedBy_ = 0;
         this.lowestObserverState_ = -1 /* IDerivationState_.NOT_TRACKING_ */;
         // onBecomeObservedListeners
@@ -347,6 +348,10 @@
     const compareDefault = Object.is;
 
     function deepEnhancer(v, _, name) {
+      // primitives can never be made observable; skip the type checks below
+      if (v === null || typeof v !== "object" && typeof v !== "function") {
+        return v;
+      }
       // it is an observable already, done
       if (isObservable(v)) {
         return v;
@@ -1287,7 +1292,8 @@
         // nodes we are looking at. Our value depends on these nodes
         this.newObserving_ = null;
         // during tracking it's an array with new observed observers
-        this.observers_ = new Set();
+        // Lazily allocated on first observer - see Atom.observers_.
+        this.observers_ = null;
         this.runId_ = 0;
         this.lastAccessedBy_ = 0;
         this.lowestObserverState_ = 0 /* IDerivationState_.UP_TO_DATE_ */;
@@ -1370,9 +1376,9 @@
         if (this.isComputing) {
           die(32, this.name_, this.derivation);
         }
-        if (globalState.inBatch === 0 &&
+        if (globalState.inBatch === 0 && (
         // !globalState.trackingDerivatpion &&
-        this.observers_.size === 0 && !this.keepAlive_) {
+        !this.observers_ || this.observers_.size === 0) && !this.keepAlive_) {
           if (shouldCompute(this)) {
             this.warnAboutUntrackedRead_();
             startBatch(); // See perf test 'computed memoization'
@@ -1380,6 +1386,7 @@
             endBatch();
           }
         } else {
+          const wasBeingObserved = this.isBeingObserved;
           reportObserved(this);
           if (shouldCompute(this)) {
             let prevTrackingContext = globalState.trackingContext;
@@ -1390,6 +1397,10 @@
               propagateChangeConfirmed(this);
             }
             globalState.trackingContext = prevTrackingContext;
+          } else if (!wasBeingObserved && this.isBeingObserved) {
+            // We just became observed while serving a cached value, so the getter
+            // won't run and won't re-report our dependencies. Cascade to them. #4547
+            this.observing_.forEach(markObserved);
           }
         }
         const result = this.value_;
@@ -1558,7 +1569,7 @@
       return globalState.trackingDerivation !== null; // filter out actions inside computations
     }
     function checkIfStateModificationsAreAllowed(atom) {
-      const hasObservers = atom.observers_.size > 0;
+      const hasObservers = !!atom.observers_ && atom.observers_.size > 0;
       // Should not be possible to change observed state outside strict mode, except during initialization, see #563
       if (!globalState.allowStateChanges && (hasObservers || globalState.enforceActions === "always")) {
         console.warn("[MobX] " + (globalState.enforceActions ? "Since strict-mode is enabled, changing (observed) observable values without using an action is not allowed. Tried to modify: " : "Side effects like changing state are not allowed at this point. Are you trying to modify state from, for example, a computed value or the render function of a React component? You can wrap side effects in 'runInAction' (or decorate functions with 'action') if needed. Tried to modify: ") + atom.name_);
@@ -1781,6 +1792,13 @@
          * Are we currently processing reactions?
          */
         this.isRunningReactions = false;
+        /**
+         * Are we currently draining pendingUnobservations in endBatch?
+         * An onBecomeUnobserved handler can dispose a Reaction, which calls
+         * startBatch/endBatch again; this guards against re-entering the same
+         * drain loop recursively (see endBatch in observable.ts).
+         */
+        this.isRunningUnobservations = false;
         /**
          * Is it allowed to change observables at this point?
          * In general, MobX doesn't allow that when running computations and React.render.
@@ -1897,10 +1915,11 @@
     }
 
     function hasObservers(observable) {
-      return observable.observers_ && observable.observers_.size > 0;
+      return !!observable.observers_ && observable.observers_.size > 0;
     }
     function getObservers(observable) {
-      return observable.observers_;
+      var _observable$observers;
+      return (_observable$observers = observable.observers_) != null ? _observable$observers : new Set();
     }
     // function invariantObservers(observable: IObservable) {
     //     const list = observable.observers
@@ -1920,10 +1939,8 @@
     //     )
     // }
     function addObserver(observable, node) {
-      // invariant(node.dependenciesState !== -1, "INTERNAL ERROR, can add only dependenciesState !== -1");
-      // invariant(observable._observers.indexOf(node) === -1, "INTERNAL ERROR add already added node");
-      // invariantObservers(observable);
-      observable.observers_.add(node);
+      var _observable$observers2;
+      ((_observable$observers2 = observable.observers_) != null ? _observable$observers2 : observable.observers_ = new Set()).add(node);
       if (observable.lowestObserverState_ > node.dependenciesState_) {
         observable.lowestObserverState_ = node.dependenciesState_;
       }
@@ -1934,8 +1951,12 @@
       // invariant(globalState.inBatch > 0, "INTERNAL ERROR, remove should be called only inside batch");
       // invariant(observable._observers.indexOf(node) !== -1, "INTERNAL ERROR remove already removed node");
       // invariantObservers(observable);
-      observable.observers_.delete(node);
-      if (observable.observers_.size === 0) {
+      const observers = observable.observers_;
+      if (!observers) {
+        return;
+      }
+      observers.delete(node);
+      if (observers.size === 0) {
         // deleting last observer
         queueForUnobservation(observable);
       }
@@ -1961,26 +1982,59 @@
       if (--globalState.inBatch === 0) {
         runReactions();
         // the batch is actually about to finish, all unobserving should happen here.
-        const list = globalState.pendingUnobservations;
-        for (let i = 0; i < list.length; i++) {
-          const observable = list[i];
-          observable.isPendingUnobservation = false;
-          if (observable.observers_.size === 0) {
-            if (observable.isBeingObserved) {
-              // if this observable had reactive observers, trigger the hooks
-              observable.isBeingObserved = false;
-              observable.onBUO();
-            }
-            if (observable instanceof ComputedValue) {
-              // computed values are automatically teared down when the last observer leaves
-              // this process happens recursively, this computed might be the last observabe of another, etc..
-              observable.suspend_();
+        // Guard against re-entering this loop: an onBUO handler can dispose a Reaction,
+        // which calls startBatch/endBatch again while we're still iterating. Bail out of
+        // the nested call instead of recursing; the outer loop re-reads list.length on
+        // every iteration, so it picks up anything the nested dispose() pushes onto the
+        // same pendingUnobservations array.
+        if (!globalState.isRunningUnobservations) {
+          globalState.isRunningUnobservations = true;
+          try {
+            const list = globalState.pendingUnobservations;
+            for (let i = 0; i < list.length; i++) {
+              const observable = list[i];
+              observable.isPendingUnobservation = false;
+              if (!observable.observers_ || observable.observers_.size === 0) {
+                if (observable.isBeingObserved) {
+                  // if this observable had reactive observers, trigger the hooks
+                  observable.isBeingObserved = false;
+                  observable.onBUO();
+                }
+                if (observable instanceof ComputedValue) {
+                  // computed values are automatically teared down when the last observer leaves
+                  // this process happens recursively, this computed might be the last observabe of another, etc..
+                  observable.suspend_();
+                }
+              }
             }
+            globalState.pendingUnobservations = [];
+          } finally {
+            // Always release the guard, even if an onBUO handler (user code) threw,
+            // otherwise every future endBatch() would see isRunningUnobservations
+            // stuck true and silently stop draining pendingUnobservations forever.
+            globalState.isRunningUnobservations = false;
           }
         }
-        globalState.pendingUnobservations = [];
       }
     }
+    /**
+     * Marks an observable as observed, cascading into the dependencies of a ComputedValue.
+     * Unobservation already cascades (`suspend_` -> `clearObserving`), observation normally
+     * only does so by accident: a newly observed computed usually recomputes and re-reports
+     * its dependencies. When it serves a cached value instead nothing re-reports them, so the
+     * transition has to be propagated by hand. See #4547.
+     */
+    function markObserved(observable) {
+      var _observable$observing;
+      if (observable.isBeingObserved) {
+        return;
+      }
+      observable.isBeingObserved = true;
+      observable.onBO();
+      // No queueForUnobservation here: the observer links already exist, so the regular
+      // suspend_ -> clearObserving -> removeObserver teardown still delivers the onBUO.
+      (_observable$observing = observable.observing_) == null || _observable$observing.forEach(markObserved);
+    }
     function reportObserved(observable) {
       checkIfStateReadsAreAllowed(observable);
       const derivation = globalState.trackingDerivation;
@@ -2000,7 +2054,7 @@
           }
         }
         return observable.isBeingObserved;
-      } else if (observable.observers_.size === 0 && globalState.inBatch > 0) {
+      } else if ((!observable.observers_ || observable.observers_.size === 0) && globalState.inBatch > 0) {
         queueForUnobservation(observable);
       }
       return false;
@@ -2027,13 +2081,14 @@
      */
     // Called by Atom when its value changes
     function propagateChanged(observable) {
+      var _observable$observers3;
       // invariantLOS(observable, "changed start");
       if (observable.lowestObserverState_ === 2 /* IDerivationState_.STALE_ */) {
         return;
       }
       observable.lowestObserverState_ = 2 /* IDerivationState_.STALE_ */;
       // Ideally we use for..of here, but the downcompiled version is really slow...
-      observable.observers_.forEach(d => {
+      (_observable$observers3 = observable.observers_) == null || _observable$observers3.forEach(d => {
         if (d.dependenciesState_ === 0 /* IDerivationState_.UP_TO_DATE_ */) {
           d.onBecomeStale_();
         }
@@ -2043,12 +2098,13 @@
     }
     // Called by ComputedValue when it recalculate and its value changed
     function propagateChangeConfirmed(observable) {
+      var _observable$observers4;
       // invariantLOS(observable, "confirmed start");
       if (observable.lowestObserverState_ === 2 /* IDerivationState_.STALE_ */) {
         return;
       }
       observable.lowestObserverState_ = 2 /* IDerivationState_.STALE_ */;
-      observable.observers_.forEach(d => {
+      (_observable$observers4 = observable.observers_) == null || _observable$observers4.forEach(d => {
         if (d.dependenciesState_ === 1 /* IDerivationState_.POSSIBLY_STALE_ */) {
           d.dependenciesState_ = 2 /* IDerivationState_.STALE_ */;
         } else if (d.dependenciesState_ === 0 /* IDerivationState_.UP_TO_DATE_ */ // this happens during computing of `d`, just keep lowestObserverState up to date.
@@ -2060,12 +2116,13 @@
     }
     // Used by computed when its dependency changed, but we don't wan't to immediately recompute.
     function propagateMaybeChanged(observable) {
+      var _observable$observers5;
       // invariantLOS(observable, "maybe start");
       if (observable.lowestObserverState_ !== 0 /* IDerivationState_.UP_TO_DATE_ */) {
         return;
       }
       observable.lowestObserverState_ = 1 /* IDerivationState_.POSSIBLY_STALE_ */;
-      observable.observers_.forEach(d => {
+      (_observable$observers5 = observable.observers_) == null || _observable$observers5.forEach(d => {
         if (d.dependenciesState_ === 0 /* IDerivationState_.UP_TO_DATE_ */) {
           d.dependenciesState_ = 1 /* IDerivationState_.POSSIBLY_STALE_ */;
           d.onBecomeStale_();
@@ -4320,31 +4377,16 @@
         });
       }
       intersection(otherSet) {
-        if (isES6Set(otherSet) && !isObservableSet(otherSet)) {
-          return otherSet.intersection(this);
-        } else {
-          const dehancedSet = new Set(this);
-          return dehancedSet.intersection(otherSet);
-        }
+        return new Set(this).intersection(otherSet);
       }
       union(otherSet) {
-        if (isES6Set(otherSet) && !isObservableSet(otherSet)) {
-          return otherSet.union(this);
-        } else {
-          const dehancedSet = new Set(this);
-          return dehancedSet.union(otherSet);
-        }
+        return new Set(this).union(otherSet);
       }
       difference(otherSet) {
         return new Set(this).difference(otherSet);
       }
       symmetricDifference(otherSet) {
-        if (isES6Set(otherSet) && !isObservableSet(otherSet)) {
-          return otherSet.symmetricDifference(this);
-        } else {
-          const dehancedSet = new Set(this);
-          return dehancedSet.symmetricDifference(otherSet);
-        }
+        return new Set(this).symmetricDifference(otherSet);
       }
       isSubsetOf(otherSet) {
         return new Set(this).isSubsetOf(otherSet);
@@ -4353,28 +4395,46 @@
         return new Set(this).isSupersetOf(otherSet);
       }
       isDisjointFrom(otherSet) {
-        if (isES6Set(otherSet) && !isObservableSet(otherSet)) {
-          return otherSet.isDisjointFrom(this);
-        } else {
-          const dehancedSet = new Set(this);
-          return dehancedSet.isDisjointFrom(otherSet);
-        }
+        return new Set(this).isDisjointFrom(otherSet);
       }
       replace(other) {
         if (isObservableSet(other)) {
           other = new Set(other);
         }
-        transaction(() => {
-          if (Array.isArray(other)) {
-            this.clear();
-            other.forEach(value => this.add(value));
-          } else if (isES6Set(other)) {
-            this.clear();
-            other.forEach(value => this.add(value));
-          } else if (other !== null && other !== undefined) {
-            die(41, other);
-          }
-        });
+        if (Array.isArray(other) || isES6Set(other)) {
+          // Only emit `delete`/`add` events (and `reportChanged`) for values that
+          // actually change, instead of clearing and re-adding everything. `add` and
+          // `delete` are already no-ops for values that are respectively already
+          // present or already absent, so we just need to avoid deleting values that
+          // are part of the replacement. See #3761.
+          transaction(() => {
+            // Collect the desired values for quick lookup. `other` is already a Set
+            // here when it was passed (or snapshotted from an observable set) as one,
+            // so reuse it rather than allocating another; arrays are wrapped (which
+            // also dedupes them).
+            const replacementValues = isES6Set(other) ? other : new Set(other);
+            // Short-circuit the trivial cases: an empty replacement is just a clear,
+            // and replacing into an empty set only needs the adds.
+            if (replacementValues.size === 0) {
+              this.clear();
+              return;
+            }
+            if (this.data_.size === 0) {
+              replacementValues.forEach(value => this.add(value));
+              return;
+            }
+            // Delete values that are not part of the replacement.
+            for (const value of this.data_.values()) {
+              if (!replacementValues.has(this.dehanceValue_(value))) {
+                this.delete(value);
+              }
+            }
+            // Add new values; values that are already present are a no-op.
+            replacementValues.forEach(value => this.add(value));
+          });
+        } else if (other !== null && other !== undefined) {
+          die(41, other);
+        }
         return this;
       }
       toJSON() {