【问题标题】:Ava test setTimeout() on addEventListener()在 addEventListener() 上的 Ava 测试 setTimeout()
【发布时间】:2020-03-05 20:43:10
【问题描述】:

我有这个功能,我想用avabrowser-env 进行测试

function foo () {
  setTimeout(() => {
    const event = new CustomEvent('pushcommand', { detail: 'foo', bubbles: true })
    document.getElementById('command-history').dispatchEvent(event)
  }, 1)
}

我的测试代码是:

import test from 'ava'
import foo from 'foo.js'

test('foo', t => {
  document.body.innerHTML = '<ul id="command-history"></ul>'
  document.getElementById('command-history').addEventListener('pushcommand', event => {
    t.is(event.detail, 'foo')
  })
  foo()
})

但我在ava:Error: Test finished without running any assertions 中收到错误消息。 事件监听器的代码被执行,只是ava在退出测试之前没有到达它。

有人知道如何解决这个问题吗?

我试过test.serialasync awaitt.end() 无济于事。请帮忙。

【问题讨论】:

    标签: javascript unit-testing settimeout jsdom ava


    【解决方案1】:

    async-await 可能很棘手。测试可能在调用异步回调之前结束。因为没有返回承诺(异步),所以 ava 不知道要等到测试完成。像这样的东西应该有助于与 ava 沟通,等待承诺完成

    import test from 'ava'
    import foo from 'foo.js'
    
    function foo () {
      setTimeout(() => {
        const event = new CustomEvent('pushcommand', { detail: 'foo', bubbles: true })
        document.getElementById('command-history').dispatchEvent(event)
      }, 1)
    }
    
    test('foo', async (t) => {
      document.body.innerHTML = '<ul id="command-history"></ul>'
      await new Promise((resolve, reject) => {
        window.addEventListener('error', reject)
        document.getElementById('command-history').addEventListener('pushcommand', event => {
          t.is(event.detail, 'foo')
          resolve()
        })
        foo()
      })
    })
    

    【讨论】:

    • 它正在工作,谢谢。尽管window.addEventListener('error', reject) 代码实际上并没有做任何事情。我在foo() 中添加了throw new Error('error'),而ava 不会接它。
    • 如果您在一个文件中进行多个测试,还需要test.serial(...),因为在并行时(默认),事件侦听器会从一个值跳转到另一个值。
    • 如果您想要并行,应该很容易为每个测试使用不同的/随机事件名称。只需使用 beforeeach 钩子。如果您需要解释,请随时创建一个新问题
    • window.addEventListener('error', (e) => console.error('erred in handler', e)) document.body.addEventListener('click', (e) => { throw new Error('erred in body handler')}) 当你点击 body 时这个方法有效。但这可能只是您正在使用的软件包的限制
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-09-30
    • 1970-01-01
    • 1970-01-01
    • 2020-03-16
    • 1970-01-01
    相关资源
    最近更新 更多