如何在Jasmine中测试表单提交?

时间:2011-09-14 14:41:47

标签: javascript unit-testing jasmine form-submit

我有一个表单可以在最终POST到它的ACTION URL之前执行一些广泛的Javascript工作。我正在编写一些Jasmine单元测试,并希望确保在提交表单时发生Javascript事件。但是,当我进行单元测试时,我绝对不希望页面转到ACTION URL。

我在这里看到了一个好的建议: http://groups.google.com/group/jasmine-js/browse_thread/thread/a010eced8db17c1a?pli=1

...但是,由于我对Jasmine还不熟悉,我不确定如何实现它,也无法在网上找到任何相关的例子。有没有人有一些我能看到的样本代码可以实现我的需要?

谢谢!

2 个答案:

答案 0 :(得分:38)

也许这段代码可以帮助你...

it('calls ajax post on export button click', function() {
  view.render();
  var form = $('#export_images_xml_form');
  var submitCallback = jasmine.createSpy().andReturn(false);
  form.submit(submitCallback);

  $('#export_images_xml_button').click();

  expect(form.attr('action')).toEqual('/export');
  expect($('#export_images_xml_form input').attr('value')).toEqual('22,33,44');
  expect(submitCallback).toHaveBeenCalled();
});

我所做的基本上是停止给定表单的每个提交在相关的回调中返回false(请参阅submitCallback行为)。

然后我也可以测试回调已被调用...

希望它有所帮助!

答案 1 :(得分:2)

如果您不想测试submit被调用,则您不需要创建间谍。使用简单的jQuery,您还可以获得不提交表单的效果。我将以下代码放在所有测试之外,这样它就适用于文件中的所有测试。

$('form').on('submit', function() {
    return false;
});