1

我正在使用 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

我尝试对实现进行硬编码以完全匹配测试，但这仍然不起作用。我究竟做错了什么？

4

1 回答 1

1

我的猜测是，因为您提交了表单，然后立即断言您遇到了竞争条件。当您的线路运行时，该$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

或者您可以尝试在事件处理程序中执行此操作，但我认为这也可能产生竞争条件。

于 2014-08-09T18:10:57.020 回答