cor*_*lls 5 jquery jasmine jasmine-jquery
jQuery的
$(".theme-picker").click(function () {
$('head').append('<link rel="stylesheet" href="" type="text/css" media="screen" id="theme_switcher"/>');
});
茉莉花
describe("style.switcher", function() {
beforeEach( function() {
jasmine.getFixtures().set(
'<head></head>' +
'<div class="switcher">' +
'<a class="theme-picker" title="theme-picker"></a>' +
'<a class="folder-picker" title="folder-picker"></a>' +
'<a class="font-picker" title="font-picker"></a>' +
'<a class="color-picker" title="color-picker"></a>' +
'</div>' );
});
it("loads themes switcher link in head", function() {
$('.theme-picker').trigger('click');
expect( $('head') ).toContain("theme_switcher");
});
});
我是茉莉花的新手,目前测试失败了.我不确定它是固定装置,触发器事件还是完全不同的东西.
我认为所选择的答案(即使它是由OP!)是误导和错误的.我不确定为什么测试一段JavaScript对某些目标HTML的影响会是"糟糕的形式".通常,这是唯一可用于验证方法是否有效的输出.
用作示例的测试实际上并没有证明什么:当然点击是触发的,你只是触发了它!你想要做的是证明从点击中得到的东西,例如DOM或其他数据结构的变化,这是原始的(IMO正确的)本能.
你想要的是使用异步测试来等待DOM中的更改然后放弃,类似于Ruby库Capybara的工作方式:
it('loads themes switcher link in head', function() {
$('.theme-picker').trigger('click');
waitsFor(function() {
return $('head').contains('theme_switcher');
}, 'theme switcher never loaded', 10000);
});