Improved error logging, suppress reaction errors if action is already…

… throwing. Fixes #1836

src/core/action.ts

@@ -31,10 +31,19 @@ export function createAction(actionName: string, fn: Function): Function & IActi
 
 export function executeAction(actionName: string, fn: Function, scope?: any, args?: IArguments) {
     const runInfo = startAction(actionName, fn, scope, args)
+    let shouldSupressReactionError = true
     try {
-        return fn.apply(scope, args)
+        const res = fn.apply(scope, args)
+        shouldSupressReactionError = false
+        return res
     } finally {
-        endAction(runInfo)
+        if (shouldSupressReactionError) {
+            globalState.suppressReactionErrors = shouldSupressReactionError
+            endAction(runInfo)
+            globalState.suppressReactionErrors = false
+        } else {
+            endAction(runInfo)
+        }
     }
 }
 

src/core/globalstate.ts

@@ -106,6 +106,12 @@ export class MobXGlobals {
      * the stack when an exception occurs while debugging.
      */
     disableErrorBoundaries = false
+
+    /*
+     * If true, we are already handling an exception in an action. Any errors in reactions should be supressed, as 
+     * they are not the cause, see: https://github.com/mobxjs/mobx/issues/1836
+     */
+    suppressReactionErrors = false
 }
 
 let canMergeGlobalState = true

src/core/reaction.ts

@@ -153,9 +153,13 @@ export class Reaction implements IDerivation, IReactionPublic {
 
         if (globalState.disableErrorBoundaries) throw error
 
-        const message = `[mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: '${this}`
-        console.error(message, error)
-        /** If debugging brought you here, please, read the above message :-). Tnx! */
+        const message = `[mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: '${this}'`
+        if (globalState.suppressReactionErrors) {
+            console.warn(`[mobx] (error in reaction '${this.name}' suppressed, fix error of causing action below)`) // prettier-ignore
+        } else {
+            console.error(message, error)
+            /** If debugging brought you here, please, read the above message :-). Tnx! */
+        }
 
         if (isSpyEnabled()) {
             spyReport({

test/base/__snapshots__/action.js.snap

@@ -1,7 +1,14 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`error logging, #1836 1`] = `
-", [mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: 'Reaction[Autorun@71], Error: Reaction error
-, Error: Action error
-"
+exports[`error logging, #1836 - 1 1`] = `
+Array [
+  "[warn] [mobx] (error in reaction 'Autorun@71' suppressed, fix error of causing action below)",
+  "[error] Error: Action error",
+]
+`;
+
+exports[`error logging, #1836 - 2 1`] = `
+Array [
+  "[error] [mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: 'Reaction[Autorun@74]'",
+]
 `;

test/base/__snapshots__/spy.js.snap

@@ -33,7 +33,7 @@ Array [
   },
   Object {
     "error": "Oops",
-    "message": "[mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: 'Reaction[autorun]",
+    "message": "[mobx] Encountered an uncaught exception that was thrown by a reaction or observer component, in: 'Reaction[autorun]'",
     "name": "autorun",
     "type": "error",
   },

test/base/action.js

@@ -507,8 +507,8 @@ test("Fix #1367", () => {
     expect(mobx.isAction(x.method)).toBe(true)
 })
 
-test("error logging, #1836", () => {
-    const messages = utils.consoleError(() => {
+test("error logging, #1836 - 1", () => {
+    const messages = utils.supressConsole(() => {
         try {
             const a = mobx.observable.box(3)
             mobx.autorun(() => {
@@ -520,6 +520,27 @@ test("error logging, #1836", () => {
                 throw new Error("Action error")
             })()
         } catch (e) {
+            expect(e.toString()).toEqual("Error: Action error")
+            console.error(e)
+        }
+    })
+
+    expect(messages).toMatchSnapshot()
+})
+
+test("error logging, #1836 - 2", () => {
+    const messages = utils.supressConsole(() => {
+        try {
+            const a = mobx.observable.box(3)
+            mobx.autorun(() => {
+                if (a.get() === 4) throw new Error("Reaction error")
+            })
+
+            mobx.action(() => {
+                a.set(4)
+            })()
+        } catch (e) {
+            expect(e.toString()).toEqual("Error: Action error")
             console.error(e)
         }
     })