我将如何用 jest 测试这个基于 Promise 的代码？

Question

我将如何测试这段代码？我想确保根据需要调用传递的承诺的错误和成功。我敢肯定这有点简单，但它让我发疯。非常感谢。

handleStatusChangeRequest (changeEntryStatus) {
  return changeEntryStatus().then(() => {
    this.handleStatusChangeSuccess()
  }).catch(err => {
    this.handleErrorDisplay(err)
  })
}

Answer 1

如果您的代码使用 Promise，则有一种处理异步测试的好方法。只需从您的测试中返回 promise，Jest 将等待该 promise 解决。
如果承诺被拒绝，测试将自动失败。

例如，假设changeData 不使用回调，而是返回一个promise，它应该解析为字符串“状态已成功修改”。

请务必return promise - 如果您省略此返回语句，您的测试将在您的 changeData() -[async function] 完成之前完成.

这是一个方便且易于遵循的模式

test('if the data is changed', () => {
  return changeData().then((data) => {
    expect(data).toBe('status has been successfully modified');
  });
})

测试愉快:)

Answer 2

这可以重构，但为了演示，我把重复的位留在里面。

在example.spec.js 中，回调changeEntryStatus 被存根以返回一个promise。为了检查是否调用了其他实例方法（this.method），它们首先被模拟，然后在运行被测试的方法后在模拟上调用断言。在Jest docs 中了解更多信息。 （请参阅我对底部正在测试的单元的模拟方法的想法。）

Run the example on repl.it.

example.js：

class Example {
  handleStatusChangeRequest(changeEntryStatus) {
    return changeEntryStatus().then(() => {
      this.handleStatusChangeSuccess()
    }).catch(err => {
      this.handleErrorDisplay(err)
    })
  }

  handleStatusChangeSuccess() {
    console.log('stubbed handleStatusChangeSuccess')
  }

  handleErrorDisplay(error) {
    console.log('stubbed handleErrorDisplay:', error)
  }
}

module.exports = Example;

example.spec.js：

const Example = require('./entryStatus')
describe('handleStatusChangeRequest', () => {
  it('should run the changeEntryStatus callback', () => {
    const {handleStatusChangeRequest} = new Example()
    const stub = jest.fn().mockResolvedValue()

    handleStatusChangeRequest(stub)

    // must return because handleStatusChangeRequest is asynchronous
    return expect(stub).toHaveBeenCalled()
  });

  it('should call example.handleStatusChangeSuccess', async () => {
    const example = new Example()
    const stub = jest.fn().mockResolvedValue()
    example.handleStatusChangeSuccess = jest.fn()

    await example.handleStatusChangeRequest(stub)

    expect(example.handleStatusChangeSuccess).toHaveBeenCalled();
  })

  it('should call example.handleErrorDisplay', async () => {
    const example = new Example()
    const fakeError = { code: 'fake_error_code' }
    const stub = jest.fn().mockRejectedValue(fakeError)
    example.handleErrorDisplay = jest.fn()


    await example.handleStatusChangeRequest(stub)

    expect(example.handleErrorDisplay).toHaveBeenCalled()
    expect(example.handleErrorDisplay).toHaveBeenCalledWith(fakeError)
  });
});

Opinionated Disclaimer：被测单元的模拟方法是一种气味。考虑检查调用handleStatusChangeSuccess 和handleErrorDisplay 的预期效果，而不是检查它们是否被调用。然后甚至不要公开这些方法，除非类的消费者需要访问。

Answer 3

Opinionated Disclaimer: 被测单元的模拟方法是 闻。考虑检查调用的预期效果 handleStatusChangeSuccess 和 handleErrorDisplay 而不是检查 看看他们是否被召唤。然后甚至不要公开这些方法 公开，除非该类的消费者需要访问。

我完全同意 webprojohn 的免责声明。模拟是一种气味，因为测试应该断言代码的行为，而不是它的实现。测试后者会使代码变脆。

离开我的肥皂盒... :) 我们正在寻找一种测试异步方法的方法。我不确定您的测试应该做出哪些断言来验证 handleStatusChangeSuccess() 和 handleErrorDisplay(err) 内部的行为，因此下面的示例留下了这些断言所在的注释。以下使用Promise.resolve() 和Promise.reject() 来触发要测试的结果。我用过 async/await，Jest 有other async examples in their docs。

const Example = require('./example')

describe('handleStatusChangeRequest', () => {
  it('should resolve successfully', async () => {
    const {handleStatusChangeRequest} = new Example();
    const resolvePromise = () => Promise.resolve();

    await handleStatusChangeRequest(resolvePromise);

    // resolution assertions here
  });

  it('should resolve errors', async () => {
    const {handleStatusChangeRequest} = new Example();
    const fakeError = new Error('eep');
    const rejectPromise = () => Promise.reject(fakeError);

    // if your method doesn't throw, we can remove this try/catch
    // block and the fail() polyfill
    try {
      await example.handleStatusChangeRequest(rejectPromise);

      // if we don't throw our test shouldn't get here, so we
      // polyfill a fail() method since Jest doesn't give us one.
      // See https://github.com/facebook/jest/issues/2129
      expect(true).toBe(false);
    }
    catch (e) {
      // rejection assertions here
    }
  });
});

Answer 4

我的答案是这样的：

**Success tests
const instance = el.find(EntryToolBar).instance()
const spy = jest.spyOn(instance, 'handleStatusChangeSuccess')

await instance.handleStatusChangeRequest(() => Promise.resolve('cool man'))

expect(spy).toHaveBeenCalledTimes(1)

**Error tests
const instance = el.find(EntryToolBar).instance()
const spy = jest.spyOn(instance, 'handleErrorDisplay')

await instance.handleStatusChangeRequest(() => Promise.reject(Error('shit')))
expect(spy).toHaveBeenCalledTimes(1)

如上所述，handleStatusChangeSuccess 和 handleError 方法在其他地方使用一些快照进行测试（它们只是设置状态并渲染出一些不同的 jsx）。我对此感觉很好。我正在使用间谍/模拟，但我正在其他地方测试实现功能。够了吗？