我正在使用qUnit和mockjax来尝试处理一个简单的异步表单提交,但由于某种原因,异步POST似乎通过mockjax。
test 'RuleModal closes the modal on a successful form submission event', ->
$.mockjax
dataType: 'json'
url: '/url'
type: 'post'
responseText:
status: 'success'
$dom = $('<div class="show-modal"><form action="/url" method="post"></form></div>')
$form = $dom.find('form')
modal = new RuleModal($dom)
$form.submit()
equal $($dom).hasClass('show-modal'), false, 'closes the modal after form submission'
和实现
_bindSubmit: ->
modal = this
@$modal.find('form').on 'submit', (event) ->
event.preventDefault()
$.ajax
dataType: 'json'
url: @action
type: @method
data: $(this).serialize()
success: (data, status, xhr) ->
modal.close()
error: (xhr, status, error) ->
alert 'Something went wrong: ' + error
我尝试硬编码实现以完全匹配测试,但仍然不起作用。我做错了什么?
我的猜测是,这是因为您完成了表单提交,然后立即断言您遇到了竞争条件。$form.submit()
调用将会执行,并且在equal ...
运行时仍在运行。即使模拟了ajax调用,它仍然是异步的。不幸的是,浏览器本地事件(如submit
)在完成时没有任何类型的回调,因此您可能只需要在断言周围使用setTimeout()
:
$form.submit();
setTimeout(function() {
equal($($dom).hasClass('show-modal'), false, 'closes the modal after form submission');
}, 100); // I think the default in Mockjax is 50ms
或者你可以尝试在事件处理程序中这样做,但我认为这也可能产生竞争条件