Bug: ...TypeError: destroy is not a function...from commitHookEffectListUnmount()

This error pops up whenever I save to refresh (fast refresh)…it goes away when I make a different change only to re-appear in the next other change. appear-disappear-appear…

Unhandled Runtime Error
TypeError: destroy is not a function

Call Stack
commitHookEffectListUnmount
node_modules/react-dom/cjs/react-dom.development.js (19710:0)
commitPassiveHookEffects
/_next/static/chunks/main.js (40064:11)
HTMLUnknownElement.callCallback
node_modules/react-dom/cjs/react-dom.development.js (188:0)
Object.invokeGuardedCallbackDev
/_next/static/chunks/main.js (20533:16)
invokeGuardedCallback
node_modules/react-dom/cjs/react-dom.development.js (292:0)
flushPassiveEffectsImpl
/_next/static/chunks/main.js (43149:9)
unstable_runWithPriority
node_modules/scheduler/cjs/scheduler.development.js (653:0)
runWithPriority$1
/_next/static/chunks/main.js (31335:10)
flushPassiveEffects
node_modules/react-dom/cjs/react-dom.development.js (22820:0)
<unknown>
/_next/static/chunks/main.js (42995:11)
workLoop
node_modules/scheduler/cjs/scheduler.development.js (597:0)
flushWork
/_next/static/chunks/main.js (49188:16)
MessagePort.performWorkUntilDeadline
node_modules/scheduler/cjs/scheduler.development.js (164:0)

I’m running on…

 "react": "^16.13.1",
 "react-dom": "^16.13.1",

I believe it comes from here

function commitHookEffectListUnmount(tag, finishedWork) {
  var updateQueue = finishedWork.updateQueue;
  var lastEffect = updateQueue !== null ? updateQueue.lastEffect : null;

  if (lastEffect !== null) {
    var firstEffect = lastEffect.next;
    var effect = firstEffect;

    do {
      if ((effect.tag & tag) === tag) {
        // Unmount
        var destroy = effect.destroy;
        effect.destroy = undefined;

        // THIS IS WHERE IT HAPPENS...WHY NOT
        // CHECK IF IT'S AN ACTUAL FUNCTION ???
        if (destroy !== undefined) {
          destroy();
        }
      }

      effect = effect.next;
    } while (effect !== firstEffect);
  }
}

Scoped

        if (destroy !== undefined) {
          destroy();
        }

Even though it’s not undefined, it might also not be a function…I assume that’s the case so why not check to see if its an actual function before calling it?

[aberba]

Oops if (status === "collected" || status === "cancelled") return true; might be the devil

[eps1lon]

if (status === “collected” || status === “cancelled”) return true;

There you are returning something other than undefined or a function.

To return early you can return nothing:

-if (status === "collected" || status === "cancelled") return true;
+if (status === "collected" || status === "cancelled") return;