Safari 中的 Polymer 组件调度事件

Question

我有一个像这样的自定义 Polymer 2+ 组件：

<my-button id="my-button"></my-button>

在组件内部，我在几个地方（在ready()、鼠标按下等）有这个代码块用于测试：

this.dispatchEvent(new Event('test'));
this.dispatchEvent(new CustomEvent('testCustom', {detail: {hey:'hey'}, bubbles:true, composed: true}));

在 Chrome 中，这两个 都可以被捕获并记录在下面实现按钮的侦听器中：

var myEl = document.getElementById('my-button')

myEl.addEventListener('test', function(){
   console.log('test reached');
})

myEl.addEventListener('testCustom', function(ev){
   console.log('test custom reached');
})

但是，在 Safari 11 和 macOS Sierra 中，它们不是。 CustomEvent Safari 应该支持，我是不是在做傻事？

Answer 1

好吧，我想通了，但答案很奇怪。如果我更改此行：

var myEl = document.getElementById('my-button')

到

var myEl = document.querySelector('my-button')

它会突然在 Safari 中工作。我没有解释为什么，不应该有命名冲突，因为 getElementById() 应该仍然能够 select 元素。

Safari 中的 Polymer 组件调度事件

Polymer component dispatching event in Safari

javascript

polymer

polymer-2.x