[react-native] removing event listener throws "Maximum call stack size exceeded" error | Community
Skip to main content

Howdy!

We're experiencing this issue after updating from 3.x SDK to 4.0.1 (https://github.com/intercom/intercom-react-native

 

react-native version: 0.70.5

 

 

Code sample (which is basically the same that you have in docs):

 

useEffect(() => { const subscription = Intercom.addEventListener( IntercomEvents.IntercomUnreadCountDidChange, (response) => { setCount(response.count); } );   return () => { try { subscription.remove(); } catch (e) { console.log(e); } }; }, []);

 

Calling subscription.remove on line 11 during effect cleanup triggers an exception.

Line 13 prints:

[RangeError: Maximum call stack size exceeded]

Without try/catch block the call just fails silently due to this - https://github.com/facebook/react-native/issues/32673(which doesn't contribute to the original problem, just makes it go unnoticed).

 

 

Let me know what other details you might need.

 

What can be done about it? Thanks.

Looping in @user1207​  in case he has any ideas on that 🙌


Hey @alex t​! Oséas here from the Customer Support Engineering team 🕵️

 

I've opened a bug report on our end for this issue so our Product Team can investigate this further. Could you please reach out to us via the Messenger so we can add the conversation to the report and, if necessary, request more info? Make sure to mention this thread when opening the conversation so my teammate who will get the convo knows which issue to link. Once we add it, any updates made will generate an internal notification in the convo and we'll be able to notify you.

 

Thank you very much for flagging this to us - really appreciate it!


Thank you, I will


We are experiencing the the exact same issue since updating to 4.0.1, we are using react-native. And it seems the crash only occurs when running android in debug mode and the component that has the subscription cleanup, dismounts. Not entirely sure yet if it's affecting the app in production. Ios seems to have no problems.


We are encountering the same issue: removing the subscription to the unread message count throws an error:

ERROR  Warning: Internal React error: Attempted to capture a commit phase error inside a detached tree. This indicates a bug in React. Likely causes include deleting the same fiber more than once, committing an already-finished tree, or an inconsistent return pointer.

Error message:

RangeError: Maximum call stack size exceeded.

For us it’s happening on iOS, both in the simulator and on device. RN 0.68, Intercom 4.0.1.


Any update on this issue? It’s marked as solved, but it doesn’t look solved!


Any update on this issue? It’s marked as solved, but it doesn’t look solved!

I have yet to try it myself, but it does look like they have merged a pull request that fixes the infite loop issue in their latest release of react-native (5.0.0).


Hey everyone!

 

Just wanted to leave a reply here in case anyone is still experiencing this issue. The issue was resolved as the PR here was merged. If you use a version 5.0.0 or newer, you will not experience this issue any longer.


Hi everyone!

We are getting this same error on our platform, and we use intercom web messenger for our react web app, instead of react-native (which is what this comment section is about). 

We used the javascript snippet to install intercom messenger into our web app. When we look at the stack trace, it’s difficult for us to pin down the cause of the error because the stack trace shows minified intercom code. 

I was wondering if anyone has received the same error on intercom web messenger. 

Thanks in advance!


This error often happens when the function reference passed to removeEventListener doesn't match the one used in addEventListener, especially if it's an anonymous or inline function. Ensuring you're storing the listener in a variable before attaching and removing it usually solves the issue. For more helpful coding practices and debugging tips, this visit site might be worth checking out.


 

This error often happens when the function reference passed to removeEventListener doesn't match the one used in addEventListener, especially if it's an anonymous or inline function. Ensuring you're storing the listener in a variable before attaching and removing it usually solves the issue. For more helpful coding practices and debugging tips, this visit site might be worth checking out.

The intercom javascript snippet installs into intercom into our platform. I noticed that it does have an addEventListener function. And the function we pass to the addEventListener function is already defined as a variable, before we pass it into the addEventListener function.

The snippet does not have a removeEventListener function...


Hey ​@Wandile Nyembe, Emily here from Support Engineering at Intercom 👋🏼

 

The Intercom JavaScript snippet does not provide a built-in removeEventListener function for its event callbacks. Instead, event callbacks like onHide are registered using the Intercom JavaScript API after the messenger is fully loaded.

 

The documentation and examples focus on registering callbacks (e.g., window.Intercom('onHide', callback)), but do not mention a way to remove or unregister these callbacks once set.