Search code examples
angularionic-frameworkionic4bugsnag

event listeners not removed as Ionic 4 & Angular conflicts with BugSnag addEventListener / removeEventListener


Was trying to resolve an issue with non working multiple choice ion-select in my Angular / Ionic 4 app. What I found is that this is combination of BugSnag which I use and ion-select implementation:

  • ion-alert (used to display ion-select) click handler triggers HostElement.forceUpdate and during the update click listeners are removed and re-added. @ionic/angular click handler removal code fragment:
function (elm, eventName, cb, opts) {
  elm.removeEventListener(eventName, cb, opts);
}
  • Bugsnag intercepts addEventListener and removeEventListener methods and for some reason removeEventListener calls (at least for click handlers) has no effect. Bugsnag beginning of eventListener handling interception code (just for reference, I believe the conflict is in other place and the method is long):
   function __traceOriginalScript(fn, callbackAccessor) {
      return function () {
        var args = Array.prototype.slice.call(arguments);
        var cba = callbackAccessor(args);
        var cb = cba.get();
        if (typeof cb !== 'function') return fn.apply(this, args);
  • in consequence after each click there new duplicated click handler are added to each button and checkbox click handles are not working correctly (i.e. it is not possible to do more than one change)

I believe there is some conflict in the handlers registering/deregistering code yet not sure how to proceed - possibly some fix is required in either Ionic or Bugsnag.


Solution

  • Just found that updating @bugsnag/js to version 6.4.3 solved the issue.