[React Fiber] EventPluginHub causes many crashes
See original GitHub issueDescription
After Upgrade to 0.43 and corresponding Fiber Update there got a new Bug introduced regarding Event Handling. If you press twice on a button and due to a lag or something like that the event get’s fired when the calling element got already unmounted the app crashes.
undefined is not an object (evaluating 'props[registrationName]') undefined is not an object (evaluating 'props[registrationName]')
( I symbolicated this by hand so here is the original issue and the corresponding minified line )
undefined is not an object (evaluating 'u[n]') undefined is not an object (evaluating 'u[n]')
[_d(function(e,n,t,r){"use strict";function u(e){return"button"===e||"input"===e||"select"===e||"textarea"===e}function o(e,n,t){switch(e){case"onClick":case"onClickCapture":case"onDoubleClick":case"onDoubleClickCapture":case"onMouseDown":case"onMouseDownCapture":case"onMouseMove":case"onMouseMoveCapture":case"onMouseUp":case"onMouseUpCapture":return!(!t.disabled||!u(n));default:return!1}}var s=n(95),i=n(96),c=n(97),a=n(98),l=n(99),p=n(22),f=null,v=function(e,n){e&&(i.executeDispatchesInOrder(e,n),e.isPersistent()||e.constructor.release(e))},d=function(e){return v(e,!0)},E=function(e){return v(e,!1)},g={injection:{injectEventPluginOrder:s.injectEventPluginOrder,injectEventPluginsByName:s.injectEventPluginsByName},getListener:function(e,n){var t;if("number"==typeof e.tag){var r=i.getFiberCurrentPropsFromNode(e.stateNode);if(!r)return null;if(t=r[n],o(n,e.type,r))return null}else{if("string"==typeof e._currentElement)return null;if(!e._rootNodeID)return null;var u=e._currentElement.props;if(t=u[n],o(n,e._currentElement.type,u))return null}return p(!t||"function"==typeof t,"Expected %s listener to be a function, instead got type %s",n,typeof t),t},extractEvents:function(e,n,t,r){for(var u,o=s.plugins,i=0;i<o.length;i++){var c=o[i];if(c){var l=c.extractEvents(e,n,t,r);l&&(u=a(u,l))}}return u},enqueueEvents:function(e){e&&(f=a(f,e))},processEventQueue:function(e){var n=f;f=null,e?l(n,d):l(n,E),p(!f,"processEventQueue(): Additional events were enqueued while processing an event queue. Support for this has not yet been implemented."),c.rethrowCaughtError()}};t.exports=g},94);](url)
Reproduction
What you need to Trigger this Bug:
a) Release Build b) A View with Button that is expensive to render - best on a different scene c) Now Switch fast between Scenes and Press Button ( Press Buttons like maniac 😉 ). At some point if there’s a lag or sth. and an Touch Event i too late an issue is thrown at that point and the whole app crashes:
Additional Information
- React Native version: 0.43
- Platform: Android
- Operating System: MacOS
Issue Analytics
- State:
- Created 7 years ago
- Reactions:10
- Comments:18 (9 by maintainers)
Top Results From Across the Web
مدیاویکی:Gadget-experimental-react.js - ویکیپدیا، دانشنامهٔ آزاد
We only expect // there to be two concurrent renderers at most: React Native ... 'EventPluginHub: More than one plugin attempted to publish...
Read more >Get started with React and Three.js using react three fiber
Whats up everybody, hope you all are off to a wonderful day. In this episode we are using react.js and three.js to create...
Read more >8 Practices In React That Will Crash Your App In The Future
Whatever makes you happy, right? 6. Destructuring When Rendering Lists. I've seen this happen to several people in the past and it isn't...
Read more >React 18's Concurrent Rendering for Stress Testing: A 3D ...
Please note that the demo might crash due to a task timeout. The timeout is caused by the slow experimental API call to...
Read more >What's New in React 16 and Fiber Explanation | by Trey Huffine
Features · Core Algorithm Rewrite · Error Handling · Return multiple elements from render · Portals.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I think I know why this is but I’d like to confirm. Do you have a small repo?
Did you possibly have a
number
that you were tapping instead of astring
?E.g.
<Text>{123}</Text>
I think this only happens for numeric text.
Sometimes this pattern can accidentally create numbers:
<Text>{number && 'Text'}</Text>
It’s fixed in 0.44.0-rc by these two commits https://github.com/facebook/react-native/commit/5f8e46b8b43c752642ded162b0d1a18ee46c13fa & https://github.com/facebook/react-native/commit/17cb70efdd1ed6378677e720a022c9d83ad87dd6