Ember.js QUnit仅测试可见元素find（）

我试图TDD我的第一个Ember应用程序。我想一次显示一个<article>元素。我从服务器上获得了几篇文章。我的显示视图定义了isVisible()，因此一次只能向用户显示一个<article>。Ember.js QUnit仅测试可见元素find（）

在我的测试，我想要做的事，如：

equal(find('article').text(), 'foobar');

的问题是，它发现所有的文章是否是可见或不可见。

我对Ember相当陌生，所以我对从这里做些什么有一些想法，但没有一个看起来很理想。

我可以寻找封闭的<div id="embernnn" class="ember-view>标签，并拒绝Ember应用嵌入式display:none样式的实例。但那会依赖于实现而不是抽象。

我可以使用视图向当前的<article>添加一个类，但如果我必须这样做，那么为什么Ember会在视图中提供isVisible属性？

我猜这有更好的办法吗？

来源

2014-12-29 davidkovsky

我不会使用内联样式 - 而是使用CSS类。在你的视图/组件中，只需添加classNameBindings: ['isVisible'],，在你的CSS中你可以使用.is-visible { display: block; }。我实际上会反转这个逻辑，因为除非隐藏，否则隐藏的东西应该是可见的，而不是隐藏的，除非可见，但我认为你得到了我的一般观点。

在您的测试案例中，您可以断言该元素具有所需的类别，或者选择find('article.is-visible')的活动文章。

来源

2014-12-29 21:18:35 mpowered

谢谢@mpowered。这就说得通了。 Ember让我在视图上定义isVisible（），如果我无法轻松测试它，这只是让人感到有趣。另外，不应该像你所建议的那样将classNameBindings放在视图中而不是控制器中？我同意，除非隐藏是最好的。 – davidkovsky

是的，我错过了，因为我倾向于几乎所有东西都使用组件。我现在真的只使用应用程序视图，并使用其他组件。对不起，如果我不清楚:-) – mpowered

不用担心，我只是想保持清晰的记录。我不确定在视图中定义isVisible（）的想法。按照我的问题所述，通过自动将内联样式的display：none添加到封闭的embernnn元素，它可以按需要工作。但是如果没有很好的测试支持，那么我会和你的答案一起去。 – davidkovsky

Ember.js QUnit仅测试可见元素find（）

回答

相关问题