Question

我正在尝试使用jasmine和amp;来测试一些JavaScript。茉莉的jquery

所以我在函数中有这个Javascript

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

我在spec.css中应用了一些styes，它们添加了一个css转换并在一个fixture中添加了一些html，然后添加了茉莉花规格，如下所示：

   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都没有运行。你能测试过渡吗？

Answer 1

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

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

测试CSS Transition在Jasmine中完成

1 个答案: