mobx 5.10.1 → 5.14.0

package/lib/mobx.es6.js

@@ -512,6 +512,274 @@ const computed = function computed(arg1, arg2, arg3) {
 };
 computed.struct = computedStructDecorator;
 
+var IDerivationState;
+(function (IDerivationState) {
+    // before being run or (outside batch and not being observed)
+    // at this point derivation is not holding any data about dependency tree
+    IDerivationState[IDerivationState["NOT_TRACKING"] = -1] = "NOT_TRACKING";
+    // no shallow dependency changed since last computation
+    // won't recalculate derivation
+    // this is what makes mobx fast
+    IDerivationState[IDerivationState["UP_TO_DATE"] = 0] = "UP_TO_DATE";
+    // some deep dependency changed, but don't know if shallow dependency changed
+    // will require to check first if UP_TO_DATE or POSSIBLY_STALE
+    // currently only ComputedValue will propagate POSSIBLY_STALE
+    //
+    // having this state is second big optimization:
+    // don't have to recompute on every dependency change, but only when it's needed
+    IDerivationState[IDerivationState["POSSIBLY_STALE"] = 1] = "POSSIBLY_STALE";
+    // A shallow dependency has changed since last computation and the derivation
+    // will need to recompute when it's needed next.
+    IDerivationState[IDerivationState["STALE"] = 2] = "STALE";
+})(IDerivationState || (IDerivationState = {}));
+var TraceMode;
+(function (TraceMode) {
+    TraceMode[TraceMode["NONE"] = 0] = "NONE";
+    TraceMode[TraceMode["LOG"] = 1] = "LOG";
+    TraceMode[TraceMode["BREAK"] = 2] = "BREAK";
+})(TraceMode || (TraceMode = {}));
+class CaughtException {
+    constructor(cause) {
+        this.cause = cause;
+        // Empty
+    }
+}
+function isCaughtException(e) {
+    return e instanceof CaughtException;
+}
+/**
+ * Finds out whether any dependency of the derivation has actually changed.
+ * If dependenciesState is 1 then it will recalculate dependencies,
+ * if any dependency changed it will propagate it by changing dependenciesState to 2.
+ *
+ * By iterating over the dependencies in the same order that they were reported and
+ * stopping on the first change, all the recalculations are only called for ComputedValues
+ * that will be tracked by derivation. That is because we assume that if the first x
+ * dependencies of the derivation doesn't change then the derivation should run the same way
+ * up until accessing x-th dependency.
+ */
+function shouldCompute(derivation) {
+    switch (derivation.dependenciesState) {
+        case IDerivationState.UP_TO_DATE:
+            return false;
+        case IDerivationState.NOT_TRACKING:
+        case IDerivationState.STALE:
+            return true;
+        case IDerivationState.POSSIBLY_STALE: {
+            const prevUntracked = untrackedStart(); // no need for those computeds to be reported, they will be picked up in trackDerivedFunction.
+            const obs = derivation.observing, l = obs.length;
+            for (let i = 0; i < l; i++) {
+                const obj = obs[i];
+                if (isComputedValue(obj)) {
+                    if (globalState.disableErrorBoundaries) {
+                        obj.get();
+                    }
+                    else {
+                        try {
+                            obj.get();
+                        }
+                        catch (e) {
+                            // we are not interested in the value *or* exception at this moment, but if there is one, notify all
+                            untrackedEnd(prevUntracked);
+                            return true;
+                        }
+                    }
+                    // if ComputedValue `obj` actually changed it will be computed and propagated to its observers.
+                    // and `derivation` is an observer of `obj`
+                    // invariantShouldCompute(derivation)
+                    if (derivation.dependenciesState === IDerivationState.STALE) {
+                        untrackedEnd(prevUntracked);
+                        return true;
+                    }
+                }
+            }
+            changeDependenciesStateTo0(derivation);
+            untrackedEnd(prevUntracked);
+            return false;
+        }
+    }
+}
+// function invariantShouldCompute(derivation: IDerivation) {
+//     const newDepState = (derivation as any).dependenciesState
+//     if (
+//         process.env.NODE_ENV === "production" &&
+//         (newDepState === IDerivationState.POSSIBLY_STALE ||
+//             newDepState === IDerivationState.NOT_TRACKING)
+//     )
+//         fail("Illegal dependency state")
+// }
+function isComputingDerivation() {
+    return globalState.trackingDerivation !== null; // filter out actions inside computations
+}
+function checkIfStateModificationsAreAllowed(atom) {
+    const hasObservers = atom.observers.size > 0;
+    // Should never be possible to change an observed observable from inside computed, see #798
+    if (globalState.computationDepth > 0 && hasObservers)
+        fail(process.env.NODE_ENV !== "production" &&
+            `Computed values are not allowed to cause side effects by changing observables that are already being observed. Tried to modify: ${atom.name}`);
+    // Should not be possible to change observed state outside strict mode, except during initialization, see #563
+    if (!globalState.allowStateChanges && (hasObservers || globalState.enforceActions === "strict"))
+        fail(process.env.NODE_ENV !== "production" &&
+            (globalState.enforceActions
+                ? "Since strict-mode is enabled, changing observed observable values outside actions is not allowed. Please wrap the code in an `action` if this change is intended. Tried to modify: "
+                : "Side effects like changing state are not allowed at this point. Are you trying to modify state from, for example, the render function of a React component? Tried to modify: ") +
+                atom.name);
+}
+function checkIfStateReadsAreAllowed(observable) {
+    if (process.env.NODE_ENV !== "production" &&
+        !globalState.allowStateReads &&
+        globalState.observableRequiresReaction) {
+        console.warn(`[mobx] Observable ${observable.name} being read outside a reactive context`);
+    }
+}
+/**
+ * Executes the provided function `f` and tracks which observables are being accessed.
+ * The tracking information is stored on the `derivation` object and the derivation is registered
+ * as observer of any of the accessed observables.
+ */
+function trackDerivedFunction(derivation, f, context) {
+    const prevAllowStateReads = allowStateReadsStart(true);
+    // pre allocate array allocation + room for variation in deps
+    // array will be trimmed by bindDependencies
+    changeDependenciesStateTo0(derivation);
+    derivation.newObserving = new Array(derivation.observing.length + 100);
+    derivation.unboundDepsCount = 0;
+    derivation.runId = ++globalState.runId;
+    const prevTracking = globalState.trackingDerivation;
+    globalState.trackingDerivation = derivation;
+    let result;
+    if (globalState.disableErrorBoundaries === true) {
+        result = f.call(context);
+    }
+    else {
+        try {
+            result = f.call(context);
+        }
+        catch (e) {
+            result = new CaughtException(e);
+        }
+    }
+    globalState.trackingDerivation = prevTracking;
+    bindDependencies(derivation);
+    warnAboutDerivationWithoutDependencies(derivation);
+    allowStateReadsEnd(prevAllowStateReads);
+    return result;
+}
+function warnAboutDerivationWithoutDependencies(derivation) {
+    if (process.env.NODE_ENV === "production")
+        return;
+    if (derivation.observing.length !== 0)
+        return;
+    if (globalState.reactionRequiresObservable || derivation.requiresObservable) {
+        console.warn(`[mobx] Derivation ${derivation.name} is created/updated without reading any observable value`);
+    }
+}
+/**
+ * diffs newObserving with observing.
+ * update observing to be newObserving with unique observables
+ * notify observers that become observed/unobserved
+ */
+function bindDependencies(derivation) {
+    // invariant(derivation.dependenciesState !== IDerivationState.NOT_TRACKING, "INTERNAL ERROR bindDependencies expects derivation.dependenciesState !== -1");
+    const prevObserving = derivation.observing;
+    const observing = (derivation.observing = derivation.newObserving);
+    let lowestNewObservingDerivationState = IDerivationState.UP_TO_DATE;
+    // Go through all new observables and check diffValue: (this list can contain duplicates):
+    //   0: first occurrence, change to 1 and keep it
+    //   1: extra occurrence, drop it
+    let i0 = 0, l = derivation.unboundDepsCount;
+    for (let i = 0; i < l; i++) {
+        const dep = observing[i];
+        if (dep.diffValue === 0) {
+            dep.diffValue = 1;
+            if (i0 !== i)
+                observing[i0] = dep;
+            i0++;
+        }
+        // Upcast is 'safe' here, because if dep is IObservable, `dependenciesState` will be undefined,
+        // not hitting the condition
+        if (dep.dependenciesState > lowestNewObservingDerivationState) {
+            lowestNewObservingDerivationState = dep.dependenciesState;
+        }
+    }
+    observing.length = i0;
+    derivation.newObserving = null; // newObserving shouldn't be needed outside tracking (statement moved down to work around FF bug, see #614)
+    // Go through all old observables and check diffValue: (it is unique after last bindDependencies)
+    //   0: it's not in new observables, unobserve it
+    //   1: it keeps being observed, don't want to notify it. change to 0
+    l = prevObserving.length;
+    while (l--) {
+        const dep = prevObserving[l];
+        if (dep.diffValue === 0) {
+            removeObserver(dep, derivation);
+        }
+        dep.diffValue = 0;
+    }
+    // Go through all new observables and check diffValue: (now it should be unique)
+    //   0: it was set to 0 in last loop. don't need to do anything.
+    //   1: it wasn't observed, let's observe it. set back to 0
+    while (i0--) {
+        const dep = observing[i0];
+        if (dep.diffValue === 1) {
+            dep.diffValue = 0;
+            addObserver(dep, derivation);
+        }
+    }
+    // Some new observed derivations may become stale during this derivation computation
+    // so they have had no chance to propagate staleness (#916)
+    if (lowestNewObservingDerivationState !== IDerivationState.UP_TO_DATE) {
+        derivation.dependenciesState = lowestNewObservingDerivationState;
+        derivation.onBecomeStale();
+    }
+}
+function clearObserving(derivation) {
+    // invariant(globalState.inBatch > 0, "INTERNAL ERROR clearObserving should be called only inside batch");
+    const obs = derivation.observing;
+    derivation.observing = [];
+    let i = obs.length;
+    while (i--)
+        removeObserver(obs[i], derivation);
+    derivation.dependenciesState = IDerivationState.NOT_TRACKING;
+}
+function untracked(action) {
+    const prev = untrackedStart();
+    try {
+        return action();
+    }
+    finally {
+        untrackedEnd(prev);
+    }
+}
+function untrackedStart() {
+    const prev = globalState.trackingDerivation;
+    globalState.trackingDerivation = null;
+    return prev;
+}
+function untrackedEnd(prev) {
+    globalState.trackingDerivation = prev;
+}
+function allowStateReadsStart(allowStateReads) {
+    const prev = globalState.allowStateReads;
+    globalState.allowStateReads = allowStateReads;
+    return prev;
+}
+function allowStateReadsEnd(prev) {
+    globalState.allowStateReads = prev;
+}
+/**
+ * needed to keep `lowestObserverState` correct. when changing from (2 or 1) to 0
+ *
+ */
+function changeDependenciesStateTo0(derivation) {
+    if (derivation.dependenciesState === IDerivationState.UP_TO_DATE)
+        return;
+    derivation.dependenciesState = IDerivationState.UP_TO_DATE;
+    const obs = derivation.observing;
+    let i = obs.length;
+    while (i--)
+        obs[i].lowestObserverState = IDerivationState.UP_TO_DATE;
+}
+
 function createAction(actionName, fn, ref) {
     if (process.env.NODE_ENV !== "production") {
         invariant(typeof fn === "function", "`action` can only be invoked on functions");
@@ -525,25 +793,19 @@ function createAction(actionName, fn, ref) {
     return res;
 }
 function executeAction(actionName, fn, scope, args) {
-    const runInfo = startAction(actionName, fn, scope, args);
-    let shouldSupressReactionError = true;
+    const runInfo = _startAction(actionName, scope, args);
     try {
-        const res = fn.apply(scope, args);
-        shouldSupressReactionError = false;
-        return res;
+        return fn.apply(scope, args);
+    }
+    catch (err) {
+        runInfo.error = err;
+        throw err;
     }
     finally {
-        if (shouldSupressReactionError) {
-            globalState.suppressReactionErrors = shouldSupressReactionError;
-            endAction(runInfo);
-            globalState.suppressReactionErrors = false;
-        }
-        else {
-            endAction(runInfo);
-        }
+        _endAction(runInfo);
     }
 }
-function startAction(actionName, fn, scope, args) {
+function _startAction(actionName, scope, args) {
     const notifySpy = isSpyEnabled() && !!actionName;
     let startTime = 0;
     if (notifySpy && process.env.NODE_ENV !== "production") {
@@ -563,19 +825,35 @@ function startAction(actionName, fn, scope, args) {
     const prevDerivation = untrackedStart();
     startBatch();
     const prevAllowStateChanges = allowStateChangesStart(true);
-    return {
+    const prevAllowStateReads = allowStateReadsStart(true);
+    const runInfo = {
         prevDerivation,
         prevAllowStateChanges,
+        prevAllowStateReads,
         notifySpy,
-        startTime
+        startTime,
+        actionId: globalState.nextActionId++,
+        parentActionId: globalState.currentActionId
     };
+    globalState.currentActionId = runInfo.actionId;
+    return runInfo;
 }
-function endAction(runInfo) {
+function _endAction(runInfo) {
+    if (globalState.currentActionId !== runInfo.actionId) {
+        fail("invalid action stack. did you forget to finish an action?");
+    }
+    globalState.currentActionId = runInfo.parentActionId;
+    if (runInfo.error !== undefined) {
+        globalState.suppressReactionErrors = true;
+    }
     allowStateChangesEnd(runInfo.prevAllowStateChanges);
+    allowStateReadsEnd(runInfo.prevAllowStateReads);
     endBatch();
     untrackedEnd(runInfo.prevDerivation);
-    if (runInfo.notifySpy && process.env.NODE_ENV !== "production")
+    if (runInfo.notifySpy && process.env.NODE_ENV !== "production") {
         spyReportEnd({ time: Date.now() - runInfo.startTime });
+    }
+    globalState.suppressReactionErrors = false;
 }
 function allowStateChanges(allowStateChanges, func) {
     const prev = allowStateChangesStart(allowStateChanges);
@@ -823,351 +1101,110 @@ class ComputedValue {
                 this.setter.call(this.scope, value);
             }
             finally {
-                this.isRunningSetter = false;
-            }
-        }
-        else
-            invariant(false, process.env.NODE_ENV !== "production" &&
-                `[ComputedValue '${this.name}'] It is not possible to assign a new value to a computed value.`);
-    }
-    trackAndCompute() {
-        if (isSpyEnabled() && process.env.NODE_ENV !== "production") {
-            spyReport({
-                object: this.scope,
-                type: "compute",
-                name: this.name
-            });
-        }
-        const oldValue = this.value;
-        const wasSuspended = 
-        /* see #1208 */ this.dependenciesState === IDerivationState.NOT_TRACKING;
-        const newValue = this.computeValue(true);
-        const changed = wasSuspended ||
-            isCaughtException(oldValue) ||
-            isCaughtException(newValue) ||
-            !this.equals(oldValue, newValue);
-        if (changed) {
-            this.value = newValue;
-        }
-        return changed;
-    }
-    computeValue(track) {
-        this.isComputing = true;
-        globalState.computationDepth++;
-        let res;
-        if (track) {
-            res = trackDerivedFunction(this, this.derivation, this.scope);
-        }
-        else {
-            if (globalState.disableErrorBoundaries === true) {
-                res = this.derivation.call(this.scope);
-            }
-            else {
-                try {
-                    res = this.derivation.call(this.scope);
-                }
-                catch (e) {
-                    res = new CaughtException(e);
-                }
-            }
-        }
-        globalState.computationDepth--;
-        this.isComputing = false;
-        return res;
-    }
-    suspend() {
-        if (!this.keepAlive) {
-            clearObserving(this);
-            this.value = undefined; // don't hold on to computed value!
-        }
-    }
-    observe(listener, fireImmediately) {
-        let firstTime = true;
-        let prevValue = undefined;
-        return autorun(() => {
-            let newValue = this.get();
-            if (!firstTime || fireImmediately) {
-                const prevU = untrackedStart();
-                listener({
-                    type: "update",
-                    object: this,
-                    newValue,
-                    oldValue: prevValue
-                });
-                untrackedEnd(prevU);
-            }
-            firstTime = false;
-            prevValue = newValue;
-        });
-    }
-    warnAboutUntrackedRead() {
-        if (process.env.NODE_ENV === "production")
-            return;
-        if (this.requiresReaction === true) {
-            fail(`[mobx] Computed value ${this.name} is read outside a reactive context`);
-        }
-        if (this.isTracing !== TraceMode.NONE) {
-            console.log(`[mobx.trace] '${this.name}' is being read outside a reactive context. Doing a full recompute`);
-        }
-        if (globalState.computedRequiresReaction) {
-            console.warn(`[mobx] Computed value ${this.name} is being read outside a reactive context. Doing a full recompute`);
-        }
-    }
-    toJSON() {
-        return this.get();
-    }
-    toString() {
-        return `${this.name}[${this.derivation.toString()}]`;
-    }
-    valueOf() {
-        return toPrimitive(this.get());
-    }
-    [Symbol.toPrimitive]() {
-        return this.valueOf();
-    }
-}
-const isComputedValue = createInstanceofPredicate("ComputedValue", ComputedValue);
-
-var IDerivationState;
-(function (IDerivationState) {
-    // before being run or (outside batch and not being observed)
-    // at this point derivation is not holding any data about dependency tree
-    IDerivationState[IDerivationState["NOT_TRACKING"] = -1] = "NOT_TRACKING";
-    // no shallow dependency changed since last computation
-    // won't recalculate derivation
-    // this is what makes mobx fast
-    IDerivationState[IDerivationState["UP_TO_DATE"] = 0] = "UP_TO_DATE";
-    // some deep dependency changed, but don't know if shallow dependency changed
-    // will require to check first if UP_TO_DATE or POSSIBLY_STALE
-    // currently only ComputedValue will propagate POSSIBLY_STALE
-    //
-    // having this state is second big optimization:
-    // don't have to recompute on every dependency change, but only when it's needed
-    IDerivationState[IDerivationState["POSSIBLY_STALE"] = 1] = "POSSIBLY_STALE";
-    // A shallow dependency has changed since last computation and the derivation
-    // will need to recompute when it's needed next.
-    IDerivationState[IDerivationState["STALE"] = 2] = "STALE";
-})(IDerivationState || (IDerivationState = {}));
-var TraceMode;
-(function (TraceMode) {
-    TraceMode[TraceMode["NONE"] = 0] = "NONE";
-    TraceMode[TraceMode["LOG"] = 1] = "LOG";
-    TraceMode[TraceMode["BREAK"] = 2] = "BREAK";
-})(TraceMode || (TraceMode = {}));
-class CaughtException {
-    constructor(cause) {
-        this.cause = cause;
-        // Empty
-    }
-}
-function isCaughtException(e) {
-    return e instanceof CaughtException;
-}
-/**
- * Finds out whether any dependency of the derivation has actually changed.
- * If dependenciesState is 1 then it will recalculate dependencies,
- * if any dependency changed it will propagate it by changing dependenciesState to 2.
- *
- * By iterating over the dependencies in the same order that they were reported and
- * stopping on the first change, all the recalculations are only called for ComputedValues
- * that will be tracked by derivation. That is because we assume that if the first x
- * dependencies of the derivation doesn't change then the derivation should run the same way
- * up until accessing x-th dependency.
- */
-function shouldCompute(derivation) {
-    switch (derivation.dependenciesState) {
-        case IDerivationState.UP_TO_DATE:
-            return false;
-        case IDerivationState.NOT_TRACKING:
-        case IDerivationState.STALE:
-            return true;
-        case IDerivationState.POSSIBLY_STALE: {
-            const prevUntracked = untrackedStart(); // no need for those computeds to be reported, they will be picked up in trackDerivedFunction.
-            const obs = derivation.observing, l = obs.length;
-            for (let i = 0; i < l; i++) {
-                const obj = obs[i];
-                if (isComputedValue(obj)) {
-                    if (globalState.disableErrorBoundaries) {
-                        obj.get();
-                    }
-                    else {
-                        try {
-                            obj.get();
-                        }
-                        catch (e) {
-                            // we are not interested in the value *or* exception at this moment, but if there is one, notify all
-                            untrackedEnd(prevUntracked);
-                            return true;
-                        }
-                    }
-                    // if ComputedValue `obj` actually changed it will be computed and propagated to its observers.
-                    // and `derivation` is an observer of `obj`
-                    // invariantShouldCompute(derivation)
-                    if (derivation.dependenciesState === IDerivationState.STALE) {
-                        untrackedEnd(prevUntracked);
-                        return true;
-                    }
-                }
-            }
-            changeDependenciesStateTo0(derivation);
-            untrackedEnd(prevUntracked);
-            return false;
+                this.isRunningSetter = false;
+            }
         }
+        else
+            invariant(false, process.env.NODE_ENV !== "production" &&
+                `[ComputedValue '${this.name}'] It is not possible to assign a new value to a computed value.`);
     }
-}
-// function invariantShouldCompute(derivation: IDerivation) {
-//     const newDepState = (derivation as any).dependenciesState
-//     if (
-//         process.env.NODE_ENV === "production" &&
-//         (newDepState === IDerivationState.POSSIBLY_STALE ||
-//             newDepState === IDerivationState.NOT_TRACKING)
-//     )
-//         fail("Illegal dependency state")
-// }
-function isComputingDerivation() {
-    return globalState.trackingDerivation !== null; // filter out actions inside computations
-}
-function checkIfStateModificationsAreAllowed(atom) {
-    const hasObservers = atom.observers.size > 0;
-    // Should never be possible to change an observed observable from inside computed, see #798
-    if (globalState.computationDepth > 0 && hasObservers)
-        fail(process.env.NODE_ENV !== "production" &&
-            `Computed values are not allowed to cause side effects by changing observables that are already being observed. Tried to modify: ${atom.name}`);
-    // Should not be possible to change observed state outside strict mode, except during initialization, see #563
-    if (!globalState.allowStateChanges && (hasObservers || globalState.enforceActions === "strict"))
-        fail(process.env.NODE_ENV !== "production" &&
-            (globalState.enforceActions
-                ? "Since strict-mode is enabled, changing observed observable values outside actions is not allowed. Please wrap the code in an `action` if this change is intended. Tried to modify: "
-                : "Side effects like changing state are not allowed at this point. Are you trying to modify state from, for example, the render function of a React component? Tried to modify: ") +
-                atom.name);
-}
-/**
- * Executes the provided function `f` and tracks which observables are being accessed.
- * The tracking information is stored on the `derivation` object and the derivation is registered
- * as observer of any of the accessed observables.
- */
-function trackDerivedFunction(derivation, f, context) {
-    // pre allocate array allocation + room for variation in deps
-    // array will be trimmed by bindDependencies
-    changeDependenciesStateTo0(derivation);
-    derivation.newObserving = new Array(derivation.observing.length + 100);
-    derivation.unboundDepsCount = 0;
-    derivation.runId = ++globalState.runId;
-    const prevTracking = globalState.trackingDerivation;
-    globalState.trackingDerivation = derivation;
-    let result;
-    if (globalState.disableErrorBoundaries === true) {
-        result = f.call(context);
-    }
-    else {
-        try {
-            result = f.call(context);
+    trackAndCompute() {
+        if (isSpyEnabled() && process.env.NODE_ENV !== "production") {
+            spyReport({
+                object: this.scope,
+                type: "compute",
+                name: this.name
+            });
         }
-        catch (e) {
-            result = new CaughtException(e);
+        const oldValue = this.value;
+        const wasSuspended = 
+        /* see #1208 */ this.dependenciesState === IDerivationState.NOT_TRACKING;
+        const newValue = this.computeValue(true);
+        const changed = wasSuspended ||
+            isCaughtException(oldValue) ||
+            isCaughtException(newValue) ||
+            !this.equals(oldValue, newValue);
+        if (changed) {
+            this.value = newValue;
         }
+        return changed;
     }
-    globalState.trackingDerivation = prevTracking;
-    bindDependencies(derivation);
-    return result;
-}
-/**
- * diffs newObserving with observing.
- * update observing to be newObserving with unique observables
- * notify observers that become observed/unobserved
- */
-function bindDependencies(derivation) {
-    // invariant(derivation.dependenciesState !== IDerivationState.NOT_TRACKING, "INTERNAL ERROR bindDependencies expects derivation.dependenciesState !== -1");
-    const prevObserving = derivation.observing;
-    const observing = (derivation.observing = derivation.newObserving);
-    let lowestNewObservingDerivationState = IDerivationState.UP_TO_DATE;
-    // Go through all new observables and check diffValue: (this list can contain duplicates):
-    //   0: first occurrence, change to 1 and keep it
-    //   1: extra occurrence, drop it
-    let i0 = 0, l = derivation.unboundDepsCount;
-    for (let i = 0; i < l; i++) {
-        const dep = observing[i];
-        if (dep.diffValue === 0) {
-            dep.diffValue = 1;
-            if (i0 !== i)
-                observing[i0] = dep;
-            i0++;
+    computeValue(track) {
+        this.isComputing = true;
+        globalState.computationDepth++;
+        let res;
+        if (track) {
+            res = trackDerivedFunction(this, this.derivation, this.scope);
         }
-        // Upcast is 'safe' here, because if dep is IObservable, `dependenciesState` will be undefined,
-        // not hitting the condition
-        if (dep.dependenciesState > lowestNewObservingDerivationState) {
-            lowestNewObservingDerivationState = dep.dependenciesState;
+        else {
+            if (globalState.disableErrorBoundaries === true) {
+                res = this.derivation.call(this.scope);
+            }
+            else {
+                try {
+                    res = this.derivation.call(this.scope);
+                }
+                catch (e) {
+                    res = new CaughtException(e);
+                }
+            }
         }
+        globalState.computationDepth--;
+        this.isComputing = false;
+        return res;
     }
-    observing.length = i0;
-    derivation.newObserving = null; // newObserving shouldn't be needed outside tracking (statement moved down to work around FF bug, see #614)
-    // Go through all old observables and check diffValue: (it is unique after last bindDependencies)
-    //   0: it's not in new observables, unobserve it
-    //   1: it keeps being observed, don't want to notify it. change to 0
-    l = prevObserving.length;
-    while (l--) {
-        const dep = prevObserving[l];
-        if (dep.diffValue === 0) {
-            removeObserver(dep, derivation);
+    suspend() {
+        if (!this.keepAlive) {
+            clearObserving(this);
+            this.value = undefined; // don't hold on to computed value!
         }
-        dep.diffValue = 0;
     }
-    // Go through all new observables and check diffValue: (now it should be unique)
-    //   0: it was set to 0 in last loop. don't need to do anything.
-    //   1: it wasn't observed, let's observe it. set back to 0
-    while (i0--) {
-        const dep = observing[i0];
-        if (dep.diffValue === 1) {
-            dep.diffValue = 0;
-            addObserver(dep, derivation);
+    observe(listener, fireImmediately) {
+        let firstTime = true;
+        let prevValue = undefined;
+        return autorun(() => {
+            let newValue = this.get();
+            if (!firstTime || fireImmediately) {
+                const prevU = untrackedStart();
+                listener({
+                    type: "update",
+                    object: this,
+                    newValue,
+                    oldValue: prevValue
+                });
+                untrackedEnd(prevU);
+            }
+            firstTime = false;
+            prevValue = newValue;
+        });
+    }
+    warnAboutUntrackedRead() {
+        if (process.env.NODE_ENV === "production")
+            return;
+        if (this.requiresReaction === true) {
+            fail(`[mobx] Computed value ${this.name} is read outside a reactive context`);
+        }
+        if (this.isTracing !== TraceMode.NONE) {
+            console.log(`[mobx.trace] '${this.name}' is being read outside a reactive context. Doing a full recompute`);
+        }
+        if (globalState.computedRequiresReaction) {
+            console.warn(`[mobx] Computed value ${this.name} is being read outside a reactive context. Doing a full recompute`);
         }
     }
-    // Some new observed derivations may become stale during this derivation computation
-    // so they have had no chance to propagate staleness (#916)
-    if (lowestNewObservingDerivationState !== IDerivationState.UP_TO_DATE) {
-        derivation.dependenciesState = lowestNewObservingDerivationState;
-        derivation.onBecomeStale();
+    toJSON() {
+        return this.get();
     }
-}
-function clearObserving(derivation) {
-    // invariant(globalState.inBatch > 0, "INTERNAL ERROR clearObserving should be called only inside batch");
-    const obs = derivation.observing;
-    derivation.observing = [];
-    let i = obs.length;
-    while (i--)
-        removeObserver(obs[i], derivation);
-    derivation.dependenciesState = IDerivationState.NOT_TRACKING;
-}
-function untracked(action) {
-    const prev = untrackedStart();
-    try {
-        return action();
+    toString() {
+        return `${this.name}[${this.derivation.toString()}]`;
     }
-    finally {
-        untrackedEnd(prev);
+    valueOf() {
+        return toPrimitive(this.get());
+    }
+    [Symbol.toPrimitive]() {
+        return this.valueOf();
     }
 }
-function untrackedStart() {
-    const prev = globalState.trackingDerivation;
-    globalState.trackingDerivation = null;
-    return prev;
-}
-function untrackedEnd(prev) {
-    globalState.trackingDerivation = prev;
-}
-/**
- * needed to keep `lowestObserverState` correct. when changing from (2 or 1) to 0
- *
- */
-function changeDependenciesStateTo0(derivation) {
-    if (derivation.dependenciesState === IDerivationState.UP_TO_DATE)
-        return;
-    derivation.dependenciesState = IDerivationState.UP_TO_DATE;
-    const obs = derivation.observing;
-    let i = obs.length;
-    while (i--)
-        obs[i].lowestObserverState = IDerivationState.UP_TO_DATE;
-}
+const isComputedValue = createInstanceofPredicate("ComputedValue", ComputedValue);
 
 /**
  * These values will persist if global state is reset
@@ -1177,6 +1214,9 @@ const persistentKeys = [
     "spyListeners",
     "enforceActions",
     "computedRequiresReaction",
+    "reactionRequiresObservable",
+    "observableRequiresReaction",
+    "allowStateReads",
     "disableErrorBoundaries",
     "runId",
     "UNCHANGED"
@@ -1237,6 +1277,11 @@ class MobXGlobals {
          * To ensure that those functions stay pure.
          */
         this.allowStateChanges = true;
+        /**
+         * Is it allowed to read observables at this point?
+         * Used to hold the state needed for `observableRequiresReaction`
+         */
+        this.allowStateReads = true;
         /**
          * If strict mode is enabled, state changes are by default not allowed
          */
@@ -1253,16 +1298,39 @@ class MobXGlobals {
          * Warn if computed values are accessed outside a reactive context
          */
         this.computedRequiresReaction = false;
+        /**
+         * (Experimental)
+         * Warn if you try to create to derivation / reactive context without accessing any observable.
+         */
+        this.reactionRequiresObservable = false;
+        /**
+         * (Experimental)
+         * Warn if observables are accessed outside a reactive context
+         */
+        this.observableRequiresReaction = false;
+        /**
+         * Allows overwriting of computed properties, useful in tests but not prod as it can cause
+         * memory leaks. See https://github.com/mobxjs/mobx/issues/1867
+         */
+        this.computedConfigurable = false;
         /*
          * Don't catch and rethrow exceptions. This is useful for inspecting the state of
          * the stack when an exception occurs while debugging.
          */
         this.disableErrorBoundaries = false;
         /*
-         * If true, we are already handling an exception in an action. Any errors in reactions should be supressed, as
+         * If true, we are already handling an exception in an action. Any errors in reactions should be suppressed, as
          * they are not the cause, see: https://github.com/mobxjs/mobx/issues/1836
          */
         this.suppressReactionErrors = false;
+        /*
+         * Current action id.
+         */
+        this.currentActionId = 0;
+        /*
+         * Next action id.
+         */
+        this.nextActionId = 1;
     }
 }
 let canMergeGlobalState = true;
@@ -1318,8 +1386,15 @@ function resetGlobalState() {
             globalState[key] = defaultGlobals[key];
     globalState.allowStateChanges = !globalState.enforceActions;
 }
+const mockGlobal = {};
 function getGlobal() {
-    return typeof window !== "undefined" ? window : global;
+    if (typeof window !== "undefined") {
+        return window;
+    }
+    if (typeof global !== "undefined") {
+        return global;
+    }
+    return mockGlobal;
 }
 
 function hasObservers(observable) {
@@ -1407,6 +1482,7 @@ function endBatch() {
     }
 }
 function reportObserved(observable) {
+    checkIfStateReadsAreAllowed(observable);
     const derivation = globalState.trackingDerivation;
     if (derivation !== null) {
         /**
@@ -1534,10 +1610,11 @@ function printDepTree(tree, lines, depth) {
 }
 
 class Reaction {
-    constructor(name = "Reaction@" + getNextId(), onInvalidate, errorHandler) {
+    constructor(name = "Reaction@" + getNextId(), onInvalidate, errorHandler, requiresObservable = false) {
         this.name = name;
         this.onInvalidate = onInvalidate;
         this.errorHandler = errorHandler;
+        this.requiresObservable = requiresObservable;
         this.observing = []; // nodes we are looking at. Our value depends on these nodes
         this.newObserving = [];
         this.dependenciesState = IDerivationState.NOT_TRACKING;
@@ -1896,7 +1973,7 @@ function autorun(view, opts = EMPTY_OBJECT) {
         // normal autorun
         reaction = new Reaction(name, function () {
             this.track(reactionRunner);
-        }, opts.onError);
+        }, opts.onError, opts.requiresObservable);
     }
     else {
         const scheduler = createSchedulerFromOptions(opts);
@@ -1911,7 +1988,7 @@ function autorun(view, opts = EMPTY_OBJECT) {
                         reaction.track(reactionRunner);
                 });
             }
-        }, opts.onError);
+        }, opts.onError, opts.requiresObservable);
     }
     function reactionRunner() {
         view(reaction);
@@ -1950,7 +2027,7 @@ function reaction(expression, effect, opts = EMPTY_OBJECT) {
             isScheduled = true;
             scheduler(reactionRunner);
         }
-    }, opts.onError);
+    }, opts.onError, opts.requiresObservable);
     function reactionRunner() {
         isScheduled = false; // Q: move into reaction runner?
         if (r.isDisposed)
@@ -1989,8 +2066,8 @@ function onBecomeUnobserved(thing, arg2, arg3) {
     return interceptHook("onBecomeUnobserved", thing, arg2, arg3);
 }
 function interceptHook(hook, thing, arg2, arg3) {
-    const atom = typeof arg2 === "string" ? getAtom(thing, arg2) : getAtom(thing);
-    const cb = typeof arg2 === "string" ? arg3 : arg2;
+    const atom = typeof arg3 === "function" ? getAtom(thing, arg2) : getAtom(thing);
+    const cb = typeof arg3 === "function" ? arg3 : arg2;
     const listenersKey = `${hook}Listeners`;
     if (atom[listenersKey]) {
         atom[listenersKey].add(cb);
@@ -2013,7 +2090,7 @@ function interceptHook(hook, thing, arg2, arg3) {
 }
 
 function configure(options) {
-    const { enforceActions, computedRequiresReaction, disableErrorBoundaries, reactionScheduler } = options;
+    const { enforceActions, computedRequiresReaction, computedConfigurable, disableErrorBoundaries, reactionScheduler, reactionRequiresObservable, observableRequiresReaction } = options;
     if (options.isolateGlobalState === true) {
         isolateGlobalState();
     }
@@ -2043,6 +2120,16 @@ function configure(options) {
     if (computedRequiresReaction !== undefined) {
         globalState.computedRequiresReaction = !!computedRequiresReaction;
     }
+    if (reactionRequiresObservable !== undefined) {
+        globalState.reactionRequiresObservable = !!reactionRequiresObservable;
+    }
+    if (observableRequiresReaction !== undefined) {
+        globalState.observableRequiresReaction = !!observableRequiresReaction;
+        globalState.allowStateReads = !globalState.observableRequiresReaction;
+    }
+    if (computedConfigurable !== undefined) {
+        globalState.computedConfigurable = !!computedConfigurable;
+    }
     if (disableErrorBoundaries !== undefined) {
         if (disableErrorBoundaries === true)
             console.warn("WARNING: Debug feature only. MobX will NOT recover from errors when `disableErrorBoundaries` is enabled.");
@@ -2094,8 +2181,7 @@ function extendObservableObjectWithProperties(target, properties, decorators, de
         invariant(!isObservable(properties), "Extending an object with another observable (object) is not supported. Please construct an explicit propertymap, using `toJS` if need. See issue #540");
         if (decorators) {
             const keys = getPlainObjectKeys(decorators);
-            for (let i in keys) {
-                const key = keys[i];
+            for (const key of keys) {
                 if (!(key in properties))
                     fail(`Trying to declare a decorator for unspecified property '${stringifyKey(key)}'`);
             }
@@ -2104,10 +2190,11 @@ function extendObservableObjectWithProperties(target, properties, decorators, de
     startBatch();
     try {
         const keys = getPlainObjectKeys(properties);
-        for (let i in keys) {
-            const key = keys[i];
+        for (const key of keys) {
             const descriptor = Object.getOwnPropertyDescriptor(properties, key);
             if (process.env.NODE_ENV !== "production") {
+                if (!isPlainObject(properties))
+                    fail(`'extendObservabe' only accepts plain objects as second argument`);
                 if (Object.getOwnPropertyDescriptor(target, key))
                     fail(`'extendObservable' can only be used to introduce new properties. Use 'set' or 'decorate' instead. The property '${stringifyKey(key)}' already exists on '${target}'`);
                 if (isComputed(descriptor.value))
@@ -2813,17 +2900,18 @@ const arrayTraps = {
     set(target, name, value) {
         if (name === "length") {
             target[$mobx].setArrayLength(value);
-            return true;
         }
         if (typeof name === "number") {
             arrayExtensions.set.call(target, name, value);
-            return true;
         }
-        if (!isNaN(name)) {
+        if (typeof name === "symbol" || isNaN(name)) {
+            target[name] = value;
+        }
+        else {
+            // numeric string
             arrayExtensions.set.call(target, parseInt(name), value);
-            return true;
         }
-        return false;
+        return true;
     },
     preventExtensions(target) {
         fail(`Observable arrays cannot be frozen`);
@@ -3069,7 +3157,7 @@ const arrayExtensions = {
         // which makes it both a 'derivation' and a 'mutation'.
         // so we deviate from the default and just make it an dervitation
         if (process.env.NODE_ENV !== "production") {
-            console.warn("[mobx] `observableArray.reverse()` will not update the array in place. Use `observableArray.slice().reverse()` to supress this warning and perform the operation on a copy, or `observableArray.replace(observableArray.slice().reverse())` to reverse & update in place");
+            console.warn("[mobx] `observableArray.reverse()` will not update the array in place. Use `observableArray.slice().reverse()` to suppress this warning and perform the operation on a copy, or `observableArray.replace(observableArray.slice().reverse())` to reverse & update in place");
         }
         const clone = this.slice();
         return clone.reverse.apply(clone, arguments);
@@ -3078,7 +3166,7 @@ const arrayExtensions = {
         // sort by default mutates in place before returning the result
         // which goes against all good practices. Let's not change the array in place!
         if (process.env.NODE_ENV !== "production") {
-            console.warn("[mobx] `observableArray.sort()` will not update the array in place. Use `observableArray.slice().sort()` to supress this warning and perform the operation on a copy, or `observableArray.replace(observableArray.slice().sort())` to sort & update in place");
+            console.warn("[mobx] `observableArray.sort()` will not update the array in place. Use `observableArray.slice().sort()` to suppress this warning and perform the operation on a copy, or `observableArray.replace(observableArray.slice().sort())` to sort & update in place");
         }
         const clone = this.slice();
         return clone.sort.apply(clone, arguments);
@@ -3188,9 +3276,16 @@ class ObservableMap {
         return this._data.has(key);
     }
     has(key) {
-        if (this._hasMap.has(key))
-            return this._hasMap.get(key).get();
-        return this._updateHasMapEntry(key, false).get();
+        if (!globalState.trackingDerivation)
+            return this._has(key);
+        let entry = this._hasMap.get(key);
+        if (!entry) {
+            // todo: replace with atom (breaking change)
+            const newEntry = (entry = new ObservableValue(this._has(key), referenceEnhancer, `${this.name}.${stringifyKey(key)}?`, false));
+            this._hasMap.set(key, newEntry);
+            onBecomeUnobserved(newEntry, () => this._hasMap.delete(key));
+        }
+        return entry.get();
     }
     set(key, value) {
         const hasKey = this._has(key);
@@ -3252,16 +3347,10 @@ class ObservableMap {
         return false;
     }
     _updateHasMapEntry(key, value) {
-        // optimization; don't fill the hasMap if we are not observing, or remove entry if there are no observers anymore
         let entry = this._hasMap.get(key);
         if (entry) {
             entry.setNewValue(value);
         }
-        else {
-            entry = new ObservableValue(value, referenceEnhancer, `${this.name}.${stringifyKey(key)}?`, false);
-            this._hasMap.set(key, entry);
-        }
-        return entry;
     }
     _updateValue(key, newValue) {
         const observable = this._data.get(key);
@@ -3896,7 +3985,7 @@ function getAdministrationForComputedPropOwner(owner) {
 function generateComputedPropConfig(propName) {
     return (computedPropertyConfigs[propName] ||
         (computedPropertyConfigs[propName] = {
-            configurable: false,
+            configurable: globalState.computedConfigurable,
             enumerable: false,
             get() {
                 return getAdministrationForComputedPropOwner(this).read(propName);
@@ -4122,17 +4211,17 @@ function has$1(a, key) {
 }
 
 function makeIterable(iterator) {
-    iterator[Symbol.iterator] = self;
+    iterator[Symbol.iterator] = getSelf;
     return iterator;
 }
-function self() {
+function getSelf() {
     return this;
 }
 
 /*
 The only reason for this file to exist is pure horror:
 Without it rollup can make the bundling fail at any point in time; when it rolls up the files in the wrong order
-it will cause undefined errors (for example because super classes or local variables not being hosted).
+it will cause undefined errors (for example because super classes or local variables not being hoisted).
 With this file that will still happen,
 but at least in this file we can magically reorder the imports with trial and error until the build succeeds again.
 */
@@ -4164,7 +4253,7 @@ try {
     process.env.NODE_ENV;
 }
 catch (e) {
-    const g = typeof window !== "undefined" ? window : global;
+    const g = getGlobal();
     if (typeof process === "undefined")
         g.process = {};
     g.process.env = {};
@@ -4190,4 +4279,4 @@ if (typeof __MOBX_DEVTOOLS_GLOBAL_HOOK__ === "object") {
     });
 }
 
-export { $mobx, IDerivationState, ObservableMap, ObservableSet, Reaction, allowStateChanges as _allowStateChanges, allowStateChangesInsideComputed as _allowStateChangesInsideComputed, getAdministration as _getAdministration, getGlobalState as _getGlobalState, interceptReads as _interceptReads, isComputingDerivation as _isComputingDerivation, resetGlobalState as _resetGlobalState, action, autorun, comparer, computed, configure, createAtom, decorate, entries, extendObservable, flow, get, getAtom, getDebugName, getDependencyTree, getObserverTree, has, intercept, isAction, isArrayLike, isObservableValue as isBoxedObservable, isComputed, isComputedProp, isObservable, isObservableArray, isObservableMap, isObservableObject, isObservableProp, isObservableSet, keys, observable, observe, onBecomeObserved, onBecomeUnobserved, onReactionError, reaction, remove, runInAction, set, spy, toJS, trace, transaction, untracked, values, when };
+export { $mobx, IDerivationState, ObservableMap, ObservableSet, Reaction, allowStateChanges as _allowStateChanges, allowStateChangesInsideComputed as _allowStateChangesInsideComputed, _endAction, getAdministration as _getAdministration, getGlobalState as _getGlobalState, interceptReads as _interceptReads, isComputingDerivation as _isComputingDerivation, resetGlobalState as _resetGlobalState, _startAction, action, autorun, comparer, computed, configure, createAtom, decorate, entries, extendObservable, flow, get, getAtom, getDebugName, getDependencyTree, getObserverTree, has, intercept, isAction, isArrayLike, isObservableValue as isBoxedObservable, isComputed, isComputedProp, isObservable, isObservableArray, isObservableMap, isObservableObject, isObservableProp, isObservableSet, keys, observable, observe, onBecomeObserved, onBecomeUnobserved, onReactionError, reaction, remove, runInAction, set, spy, toJS, trace, transaction, untracked, values, when };