useEffect not working with NODE_ENV=production

[gjuchault]

As soon as you add NODE_ENV=production and call useEffect in a functional component, here is the error I get:

(node:77890) UnhandledPromiseRejectionWarning: TypeError: effect.cancel is not a function
    at cancel (/Users/user/project/node_modules/react-blessed/src/fiber/fiber.js:217:47)
    at Array.forEach (<anonymous>)
    at forEach (/Users/user/project/node_modules/react-blessed/src/fiber/fiber.js:217:22)
    at nc (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:130:268)
    at Ef (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:158:1)
    at Object.updateContainer (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:160:48)
    at updateContainer (/Users/user/project/node_modules/react-blessed/src/fiber/fiber.js:239:23)
    at Object.exports.renderApp (/Users/user/project/src/index.tsx:16:3)
    at /Users/user/project/src/store/index.ts:29:3
    at /Users/user/project/node_modules/redux-thunk/lib/index.js:14:16
(node:77890) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:77890) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

[gjuchault]

Adding a console.trace into scheduledPassiveEffects give the following:

(NODE_ENV=production)

Trace: function () { [native code] }
    at runningEffects (/Users/user/project/node_modules/react-blessed/src/fiber/fiber.js:213:7)
    at /Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:132:384
    at Object.exports.unstable_runWithPriority (/Users/user/project/node_modules/scheduler/cjs/scheduler.production.min.js:18:163)
    at Ze (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:132:315)
    at /Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:156:268
    at Object.exports.unstable_runWithPriority (/Users/user/project/node_modules/scheduler/cjs/scheduler.production.min.js:18:163)
    at Df (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:156:203)
    at Bf (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:155:383)
    at U (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:154:136)
    at Ye (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.production.min.js:151:258)

(NODE_ENV=development)

Trace: function wrapped() {
    var prevInteractions = exports.__interactionsRef.current;
    exports.__interactionsRef.current = wrappedInteractions;

    subscriber = exports.__subscriberRef.current;

    try {
      var returnValue = void 0;

      try {
        if (subscriber !== null) {
          subscriber.onWorkStarted(wrappedInteractions, threadID);
        }
      } finally {
        try {
          returnValue = callback.apply(undefined, arguments);
        } finally {
          exports.__interactionsRef.current = prevInteractions;

          if (subscriber !== null) {
            subscriber.onWorkStopped(wrappedInteractions, threadID);
          }
        }
      }

      return returnValue;
    } finally {
      if (!hasRun) {
        // We only expect a wrapped function to be executed once,
        // But in the event that it's executed more than once–
        // Only decrement the outstanding interaction counts once.
        hasRun = true;

        // Update pending async counts for all wrapped interactions.
        // If this was the last scheduled async work for any of them,
        // Mark them as completed.
        wrappedInteractions.forEach(function (interaction) {
          interaction.__count--;

          if (subscriber !== null && interaction.__count === 0) {
            subscriber.onInteractionScheduledWorkCompleted(interaction);
          }
        });
      }
    }
  }
    at runningEffects (/Users/user/project/node_modules/react-blessed/src/fiber/fiber.js:213:7)
    at /Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:10959:14
    at Object.unstable_runWithPriority (/Users/user/project/node_modules/scheduler/cjs/scheduler.development.js:255:12)
    at commitRoot (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:10958:45)
    at /Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:12401:5
    at Object.unstable_runWithPriority (/Users/user/project/node_modules/scheduler/cjs/scheduler.development.js:255:12)
    at completeRoot (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:12400:13)
    at performWorkOnRoot (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:12329:9)
    at performWork (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:12237:7)
    at performSyncWork (/Users/user/project/node_modules/react-reconciler/cjs/react-reconciler.development.js:12211:3)

[Yomguithereal]

That's quite strange indeed. Maybe they added some methods to the scheduler related to hooks and we did not add those.

Side question: does the function you give to useEffect in your case returns a unsubscribing function?

[gjuchault]

@Yomguithereal Some do, some don't. It seems somehow unrelated. You can find the code here (all three useEffect cause the error)