Question

我已按照指南here使用纯JS / HTML / CSS创建了一个本地自定义元素作为Web组件。

现在，我想知道如何为这种组件编写单元测试。有一个出色的库Web组件测试器，但我相信它仅适用于用聚合物创建的组件。

由于我的组件不是聚合物纤维网组件，而是天然的组件，因此有人可以为我指明进行单元测试的正确方向。

Answer 1

您可以将Polymer的web-component-tester用于香草成分。这篇博客文章有一些示例：https://bendyworks.com/blog/native-web-components。

您可以像这样测试组件：

  <my-vanilla-component></my-vanilla-component>
  <script>
    suite('<my-vanilla-component>', function() {
      let component = document.querySelector('my-vanilla-component');
      test('renders div', () => {
        assert.isOk(component.shadowRoot.querySelector('div'));
      });
    });
  </script>

对带有影子dom的本地自定义元素v1 Web组件进行单元测试

1 个答案: