Ionic4+Angular与BugSnag事件监听器冲突致ion-select多选失效求助

我最近在调试Angular/Ionic4应用时碰上个头疼的问题——多选ion-select彻底没法正常工作。翻来覆去排查后，才发现是BugSnag和Ionic的ion-select实现撞车了，具体情况如下：

冲突原因拆解 #

当ion-select弹出对应的ion-alert选择面板时，它的点击处理器会触发HostElement.forceUpdate。在这个更新流程里，Ionic会先移除原有的点击监听器，再重新绑定新的，对应的移除逻辑代码是这样的：

function (elm, eventName, cb, opts) { elm.removeEventListener(eventName, cb, opts); }

但BugSnag会拦截浏览器原生的addEventListener和removeEventListener方法。诡异的是，针对点击处理器的removeEventListener调用完全没生效——BugSnag的拦截逻辑开头是下面这样（冲突大概率出现在方法后续的处理里）：

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);
    // 更多拦截逻辑省略
  }
}

这么一来就炸锅了：每次点击选择面板里的选项，每个按钮都会被重复绑定点击处理器，直接导致复选框没法正常多次切换选择状态。

临时缓解方案 #

这个问题本质上得靠Ionic或者BugSnag官方修复，但眼下可以试试这些临时办法撑一下：

• 临时关闭BugSnag的事件拦截：如果应用场景允许，可以在用到ion-select的组件初始化时，临时禁用BugSnag对addEventListener和removeEventListener的拦截，等组件销毁时再恢复。不过得先摸清楚BugSnag对应的API开关。
• 自定义多选组件替代：要是时间充裕，完全可以用ion-checkbox配合自定义弹窗来实现多选功能，绕开原生ion-select和BugSnag的冲突点。
• 回退依赖版本：查一下Ionic和BugSnag的更新日志，找到这个冲突出现的版本节点，暂时回退到之前没有问题的版本，等官方修复后再升级。

内容的提问来源于stack exchange，提问作者ciekawy