单击处理程序不在位置上触发：已修复;在Firefox

Question

我正在创建一个<select />元素的替代品，它运行得很好 - 即使在Firefox中也是如此。简而言之，我创建了一个<div class="option">列表，并为每个列表添加了一个点击监听器，处理设置正确的选定值等等。

但是，如果列表太长而无法在屏幕上显示，我会将选项的容器元素的position从absolute切换为fixed。

突然，在Firefox 45中，我的选项的点击处理程序没有被触发。适用于Chrome和Safari以及IE浏览器。

知道为什么？

Here's a codepen包含我的所有代码（其中有很多代码）。当我删除每个元素的周围div而不是它们时，它可以用于某些原因。

未被触发的代码是_initEvents()方法中的以下内容：

this.$options.forEach((option, index) => {
    option.addEventListener('click', e => {
        console.log('this never fires');
        this.currentIndex = index;
        this._changeOption();
        this._toggleDropdown();
    });
});

编辑：添加html, body { height: 100% }可修复CodePen上的问题，但不会修复我的网站。知道为什么吗？

编辑2：原来它有效......有时候。但是这很糟糕 - 它选择了错误的选项而不是。