My react app started failing with error `Uncaught TypeError: Cannot read property 'forEach' of undefined` and not giving any stacktrace related to my application's code. I have updated to latest react also tried deleting `node_modules` folder still the error persists ```javascript Uncaught TypeError: Cannot read property 'forEach' of undefined at startWorkOnPendingInteractions (react-dom.development.js:26047) at performSyncWorkOnRoot (react-dom.development.js:24256) at react-dom.development.js:12199 at unstable_runWithPriority (scheduler.development.js:697) at runWithPriority$2 (react-dom.development.js:12149) at flushSyncCallbackQueueImpl (react-dom.development.js:12194) at flushSyncCallbackQueue (react-dom.development.js:12182) at scheduleUpdateOnFiber (react-dom.development.js:23709) at updateContainer (react-dom.development.js:27103) at legacyRenderSubtreeIntoContainer (react-dom.development.js:27544) at Object.render (react-dom.development.js:27608) at Object../src/index.js (index.js:105) at __webpack_require__ (bootstrap 6cea5049fc4d597a00c7:678) at fn (bootstrap 6cea5049fc4d597a00c7:88) at Object.0 (utils.js:270) at __webpack_require__ (bootstrap 6cea5049fc4d597a00c7:678) at bootstrap 6cea5049fc4d597a00c7:724 at bootstrap 6cea5049fc4d597a00c7:724 TypeError: Cannot read property 'forEach' of undefined startWorkOnPendingInteractions node_modules/react-dom/cjs/react-dom.development.js:25997 25994 | 25995 | 25996 | var interactions = new Set(); > 25997 | root.pendingInteractionMap.forEach(function (scheduledInteractions, scheduledExpirationTime) { 25998 | if (scheduledExpirationTime >= expirationTime) { 25999 | scheduledInteractions.forEach(function (interaction) { 26000 | return interactions.add(interaction); View compiled performSyncWorkOnRoot node_modules/react-dom/cjs/react-dom.development.js:24168 24165 | 24166 | if (root !== workInProgressRoot || expirationTime !== renderExpirationTime) { 24167 | prepareFreshStack(root, expirationTime); > 24168 | startWorkOnPendingInteractions(root, expirationTime); 24169 | } // If we have a work-in-progress fiber, it means there's still work to do 24170 | // in this root. 24171 | View compiled (anonymous function) node_modules/react-dom/cjs/react-dom.development.js:12238 12235 | var callback = queue[i]; 12236 | 12237 | do { > 12238 | callback = callback(_isSync); 12239 | } while (callback !== null); 12240 | } 12241 | }); View compiled unstable_runWithPriority node_modules/scheduler/cjs/scheduler.development.js:815 812 | currentPriorityLevel = priorityLevel; 813 | 814 | try { > 815 | return eventHandler(); 816 | } finally { 817 | currentPriorityLevel = previousPriorityLevel; 818 | } View compiled runWithPriority$2 node_modules/react-dom/cjs/react-dom.development.js:12188 12185 | 12186 | function runWithPriority$2(reactPriorityLevel, fn) { 12187 | var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel); > 12188 | return Scheduler_runWithPriority(priorityLevel, fn); 12189 | } 12190 | function scheduleCallback(reactPriorityLevel, callback, options) { 12191 | var priorityLevel = reactPriorityToSchedulerPriority(reactPriorityLevel); View compiled flushSyncCallbackQueueImpl node_modules/react-dom/cjs/react-dom.development.js:12233 12230 | try { 12231 | var _isSync = true; 12232 | var queue = syncQueue; > 12233 | runWithPriority$2(ImmediatePriority, function () { 12234 | for (; i < queue.length; i++) { 12235 | var callback = queue[i]; 12236 | View compiled flushSyncCallbackQueue node_modules/react-dom/cjs/react-dom.development.js:12221 12218 | Scheduler_cancelCallback(node); 12219 | } 12220 | > 12221 | flushSyncCallbackQueueImpl(); 12222 | } 12223 | 12224 | function flushSyncCallbackQueueImpl() { View compiled scheduleUpdateOnFiber node_modules/react-dom/cjs/react-dom.development.js:23601 23598 | // scheduleCallbackForFiber to preserve the ability to schedule a callback 23599 | // without immediately flushing it. We only do this for user-initiated 23600 | // updates, to preserve historical behavior of sync mode. > 23601 | flushSyncCallbackQueue(); 23602 | } 23603 | } 23604 | } else { View compiled scheduleRootUpdate node_modules/react-dom/cjs/react-dom.development.js:26945 26942 | } 26943 | 26944 | enqueueUpdate(current$$1, update); > 26945 | scheduleWork(current$$1, expirationTime); 26946 | return expirationTime; 26947 | } 26948 | View compiled updateContainerAtExpirationTime node_modules/react-dom/cjs/react-dom.development.js:26973 26970 | container.pendingContext = context; 26971 | } 26972 | > 26973 | return scheduleRootUpdate(current$$1, element, expirationTime, suspenseConfig, callback); 26974 | } 26975 | 26976 | function findHostInstance(component) { View compiled updateContainer node_modules/react-dom/cjs/react-dom.development.js:27075 27072 | 27073 | var suspenseConfig = requestCurrentSuspenseConfig(); 27074 | var expirationTime = computeExpirationForFiber(currentTime, current$$1, suspenseConfig); > 27075 | return updateContainerAtExpirationTime(element, container, parentComponent, expirationTime, suspenseConfig, callback); 27076 | } 27077 | function getPublicRootInstance(container) { 27078 | var containerFiber = container.current; View compiled legacyRenderSubtreeIntoContainer node_modules/react-dom/cjs/react-dom.development.js:27679 27676 | } // Update 27677 | 27678 | > 27679 | updateContainer(children, fiberRoot, parentComponent, callback); 27680 | } 27681 | 27682 | return getPublicRootInstance(fiberRoot); View compiled render node_modules/react-dom/cjs/react-dom.development.js:27756 27753 | !!container._reactHasBeenPassedToCreateRootDEV ? warningWithoutStack$1(false, 'You are calling ReactDOM.render() on a container that was previously ' + 'passed to ReactDOM.%s(). This is not supported. ' + 'Did you mean to call root.render(element)?', enableStableConcurrentModeAPIs ? 'createRoot' : 'unstable_createRoot') : void 0; 27754 | } 27755 | > 27756 | return legacyRenderSubtreeIntoContainer(null, element, container, false, callback); 27757 | }, 27758 | unstable_renderSubtreeIntoContainer: function (parentComponent, element, containerNode, callback) { 27759 | (function () { View compiled ./src/index.js src/index.js:105 102 | }); 103 | 104 | > 105 | ReactDOM.render( 106 | <Provider store={store}> 107 | <MuiThemeProvider theme={theme}> 108 | <CssBaseline /> View compiled ▶ 6 stack frames were collapsed. This screen is visible only in development. It will not appear if the app crashes in production. Open your browser’s developer console to further inspect this error. ```

React application failing with Uncaught TypeError: Cannot read property 'forEach' of undefined

6083

+ 4

My react app started failing with error Uncaught TypeError: Cannot read property 'forEach' of undefined and not giving any stacktrace related to my application's code.
I have updated to latest react also tried deleting node_modules folder still the error persists

4 Answers

5 years ago by VD

0

did you manage to fix the problem?

4 years ago by Vlad T

0

Could you fix this problem?

4 years ago by Varsha Teckchandani

+ 2

I managed to solve, in my case was the index.html file in public that was minified by webpack. After restoring it from a clean index.html file, everything went back to normal.

Consider that in my case, and I don't know why, webpack decided to push a lot of minified JS into the index.html file.

I hope it helps someone, since I could not find any tip in my DuckDuckGo searchs. Had a really bad time with this issue.

4 years ago by Diego Morais

0

thanks diego, your suggestion worked. Don't know why yet.

3 years ago by palash

React application failing with Uncaught TypeError: Cannot read property 'forEach' of undefined

+ 4

4 Answers

0

0

+ 2

0

Your Answer

OneCompiler.com

Languages

More