下面是一个显然在Ember.js 2.15中有效,但在3.0版本中似乎无效的测试:* 无法在“元素”上执行“querySelector”:'a:contains(' Contact ')'不是有效的选取器 *。
import { module, test } from 'qunit';
import { visit, currentURL, click } from '@ember/test-helpers';
import { setupApplicationTest } from 'ember-qunit';
module('Acceptance | list rentals', function(hooks) {
setupApplicationTest(hooks);
test('should show link to contact', async function(assert){
await visit('/');
await click("a:contains('Contact')");
assert.equal(currentURL(),'/contact','should navigate to contact');
});
});
如何在Ember.js 3.0中做到这一点?
我在网上的Ember指南中找不到它。教程似乎参考了以前的版本。
PS:应用程序的模板文件包含
{{#link-to "contact"}}
Contact
{{/link-to}}
PS:使用这样一个选择器的想法来自Ember版本3.0的教程!(请看这里的结尾https://guides.emberjs.com/v3.0.0/tutorial/routes-and-templates/)
编辑:Emberjs 3.1指南已经可用,教程示例最终与新代码匹配:
https://guides.emberjs.com/v3.1.0/tutorial/model-hook/
3条答案
按热度按时间flmtquvp1#
我会将自定义类名添加到{{#link-to}},并使用该类名作为Click事件选择器
在我的验收测试中,我将调用
xam8gpfp2#
@ember/test-helpers
的新find
助手在后台使用浏览器的原生document.querySelector
而不是jQuery。不幸的是,由于:contains不是一个真实的的CSS选择器,因此没有任何浏览器支持它。如果您使用
moduleForAcceptance
而不是setupApplicationTest
,那么旧的全局find
助手仍然可用。我不知道将来是否有计划弃用它。就我个人而言,我建议在元素上放置一个类或
data-test-
属性,并以这种方式搜索它。s5a0g9ez3#
我在升级的时候遇到了这个问题,我想有一种方法可以恢复jQuery伪选择器。这有点笨拙,所以考虑一下是否应该按照其他人的建议重写。
1.使用
$(your-old-selector-string)[0]
获取一个普通DOM元素1.将元素传递给测试助手
我不相信这是健壮的或未来的证明,但它可能是有趣的升级过程中,以获得绿色测试之前,处理弃用和诸如此类的。
以最初的例子为例,并将我在3.8版应用程序中所做的应用程序更新为: