0

使用 Polymer 1.* 和 WCT,在测试我的元素时,<sp-veteran></sp-veteran>我无法删除方法._getSpComboBox()和函数。我明白了。._getItems()readyError thrown outside of test function: this._getSpComboBox(...)._getItems is not a function

由于它在就绪函数中,我需要使用 WCT apistub而不是sinon.stub因为后者需要我抓取我以前无法做到的元素fixture()

有什么建议么?

原始代码:

  _getSpComboBox: function() {
    return Polymer.dom(this.$.veteran.root).querySelector('sp-combo-box');
  },

  ready: function() {
    if (this.editMode) {
      this._getSpComboBox()._getItems();
    }
    this.$.veteranNoAjax.read();
    this._setStyle();
  }

测试:

<test-fixture id="sp-veteran">
  <template>
    <h2>edit veteran in edit mode</h2>
    <sp-app>
      <sp-toast></sp-toast>
      <sp-veteran edit-mode></sp-veteran>
    </sp-app>
  </template>
</test-fixture>

  before(() => {
      replace('sp-app').with('fake-sp-app');

      stub('sp-ajax', {read: ()=> entitiesMock});
      const _getItems = ()=> entitiesMock;
      stub('sp-veteran', {_getSpComboBox: ()=> _getItems});
4

1 回答 1

1

不幸的是,在 Polymer1 中准备好测试有点痛苦,或者至少我还没有找到一种没有奇怪副作用的简单方法。在附加存根/间谍后调用 ready 方法始终是一种选择,但正如我所提到的,它可能会导致一些奇怪的问题。这在 Polymer2 中得到了缓解,因为第一次为您的元素调用 connectedCallback 时调用了 ready,因此您可以创建元素然后绑定您的间谍并手动添加以触发它,只是不要忘记之后删除。

在 Polymer 元素中进行 DOM 操作的情况下,您应该改用附加的生命周期,这将解决我上面提到的测试问题,但它也为您在未来节省了一个奇怪的潜在用例。由于 ready 仅针对元素的实例运行一次,因此如果该元素稍后被重新使用,ready 语句中的任何逻辑都不会重新运行,而是如果将该元素从DOM 然后稍后在另一个位置再次添加,它将重新运行它的逻辑以获取它的新子项。

于 2018-03-05T20:10:31.367 回答