5

我正在尝试使用 jasmine 和 jasmine-jquery 测试一些 JavaScript

所以我在函数中有一点 Javascript

trackTransition = ()->
  $("#test").on "transitionend MSTransitionEnd webkitTransitionEnd oTransitionEnd", ()-> 
    console.log "trans End"

我在 spec.css 中应用了一些样式，添加了一个 css 转换并将一些 html 添加到一个夹具中，然后添加到 jasmine 规范中，如下所示：

   describe "Checks when animation finished", ->
      beforeEach ->
        @trans = spyOnEvent('#test', 'transitionend MSTransitionEnd webkitTransitionEnd oTransitionEnd')
        jasmine.Clock.useMock()
        trackTransition()

      it "Should check when transition ended", ->
        expect(@trans).not.toHaveBeenTriggered()
        jasmine.Clock.tick(1001)
        expect(@trans).toHaveBeenTriggered()

现在我已经在页面上对此进行了测试并且可以正常触发，但是在运行器上它失败了，甚至 console.log 也没有运行。你能测试转换吗？

4

1 回答 1

5

这个不能工作的原因jasmine.Clock不会改变时间或让测试等待 1000 毫秒。它只是覆盖window.setTimeout. 因此，无论何时调用setTimeout(someFunction, 1000)它都会保存传递的函数和时间。然后，当您调用tick它时，只需调用任何保存的函数，其时间低于您传递给tick调用的时间。

因此，测试您的 transitionEnd 事件的唯一方法是手动触发该事件。此外，测试在特定时间后触发事件也没有多大意义，因为这是您依赖的浏览器行为。

于 2013-05-02T18:38:30.157 回答