如何测试在连接时应该失败的 Polymer 元素

Question

我正在创建一个元素（路由器 - 但这并不重要），它会在附加特定其他自定义元素后立即扫描 DOM。我在某些情况下需要抛出错误，我想测试这些。

我构造的测试没有失败 - 但据我所知，测试在我的元素被附加之前已经失败了。我怀疑这是事物的异步性质。

这是相关测试的片段。有问题的测试夹具包含的元素会导致元素之一在 'dom-change' 事件发生后（它有一个侦听器）当它扫描 dom 以查找其他内容时失败。

    it('should fail if two route elements both designate thenselves as home', function(done) {
      var t= document.getElementById('multiple_home');
      function multiple () {
        t.create();
      }
      expect(multiple).to.throw(Error);
      t.restore();
      done();
    });

我认为这个问题与 fixture 是在 multiple 中创建的，但在 multiple 退出时还没有失败有关。我想知道我是否可以通过一个 Promise 来期待 - 除了我不确定如何将 mulitple 变成一个 Promise 来尝试它。

Answer 1

我最终找到了一种方法，但它需要对元素进行一些检测才能支持这一点。

在元素 "created" 回调中，我创建了一个 Promise 并将两个函数存储在 "this" 变量中以解决和拒绝它 - 因此：-

this.statusPromise = new Promise(function(resolve,reject){
  this.statusResolver = resolve;
  this.statusRejector = reject;
}.bind(this));

在 DOM 解析部分我使用了这样的 try catch 块

try {
  //parse the dom throwing errors if anything bad happens
  this.statusResolver('Any useful value I like');
} catch (error) {
  this.statusRejector(error);
}

然后我做了一个函数，returns promise

domOK: function() {
  return this.statusPromise;
}

终于在我的测试中我现在能够测试这样的东西（我在每个测试中加载夹具，而不是 beforeEach，因为我为每个测试使用不同的夹具。我再次清除它一个 afterEach）。注意使用 Promise 中的 .then 和 .catch 函数。

    it('should fail if two route elements declare the same path name',function(done){
      t = document.getElementById('multiple_path');
      t.create();
      r = document.getElementById('router')
      r.domOK().then(function(status){
        //We should not get here throw an error
        assert.fail('Did not error - status is: ' + status);
        done();
      }).catch(function(error){
        expect(error.message).to.equal('There are two nodes with the same name: /user');
        done();
      });

如何测试在连接时应该失败的 Polymer 元素

How do I test a Polymer element which should fail when it attaches

polymer

promise

web-component-tester