Question

给出以下组件集成测试：

test('it has the correct tagName of aside', function(assert){
  this.render(hbs`{{my-component}}`);
  assert.equal(this.$().prop('tagName'), 'ASIDE');
});

尽管我更改了组件中的tagName，但div仍然是tagName失败了：

export default Ember.Component.extend({
  tagName: 'aside',
  ...
});

查看页面来源，它实际上是aside，但是整合测试没有看到它。

如果我尝试测试class属性，也会发生类似的失败。我将类名附加到组件中的classNames集合，但在查询时返回的所有内容都是ember-view。

测试这个的正确方法是什么？

Answer 1

在集成测试中，this.$()指的是整个内联呈现的Handlebars模板。其根元素始终为<div>。

要查找组件的元素，您需要this.$('> .my-component')之类的东西，将选择器基于组件的类名称。这应该允许你在标签名称属性上断言。

Ember：测试tagName的正确方法

1 个答案: