Testing Asynchronous Code

    Return a promise from your test, and Jest will wait for that promise to resolve. If the promise is rejected, the test will fail.

    For example, let’s say that fetchData returns a promise that is supposed to resolve to the string 'peanut butter'. We could test it with:

    Alternatively, you can use async and await in your tests. To write an async test, use the async keyword in front of the function passed to test. For example, the same fetchData scenario can be tested with:

    1. test('the data is peanut butter', async () => {
    2.   const data = await fetchData();
    3.   expect(data).toBe('peanut butter');
    4. });
    6. test('the fetch fails with an error', async () => {
    7.   expect.assertions(1);
    8.   try {
    9.   } catch (e) {
    10.     expect(e).toMatch('error');
    11.   }
    12. });

    You can combine async and await with .resolves or .rejects.

    In these cases, and await are effectively syntactic sugar for the same logic as the promises example uses.

    caution

    If you expect a promise to be rejected, use the .catch method. Make sure to add expect.assertions to verify that a certain number of assertions are called. Otherwise, a fulfilled promise would not fail the test.

    1. test('the fetch fails with an error', () => {
    2.   expect.assertions(1);
    3.   return fetchData().catch(e => expect(e).toMatch('error'));
    4. });

    If you don’t use promises, you can use callbacks. For example, let’s say that fetchData, instead of returning a promise, expects a callback, i.e. fetches some data and calls callback(null, data) when it is complete. You want to test that this returned data is the string 'peanut butter'.

    By default, Jest tests complete once they reach the end of their execution. That means this test will not work as intended:

    The problem is that the test will complete as soon as fetchData completes, before ever calling the callback.

    There is an alternate form of test that fixes this. Instead of putting the test in a function with an empty argument, use a single argument called done. Jest will wait until the done callback is called before finishing the test.

    1. test('the data is peanut butter', done => {
    2.   function callback(error, data) {
    3.     if (error) {
    4.       done(error);
    5.     }
    6.     try {
    8.       done();
    9.     } catch (error) {
    10.       done(error);
    11.     }
    12.   }
    14.   fetchData(callback);
    15. });

    If done() is never called, the test will fail (with timeout error), which is what you want to happen.

    Testing Asynchronous Code - 图2caution

    Jest will throw an error, if the same test function is passed a done() callback and returns a promise. This is done as a precaution to avoid memory leaks in your tests.

    You can also use the .resolves matcher in your expect statement, and Jest will wait for that promise to resolve. If the promise is rejected, the test will automatically fail.

    Be sure to return the assertion—if you omit this return statement, your test will complete before the promise returned from fetchData is resolved and then() has a chance to execute the callback.

    If you expect a promise to be rejected, use the .rejects matcher. It works analogically to the .resolves matcher. If the promise is fulfilled, the test will automatically fail.

    1. test('the fetch fails with an error', () => {
    2. });

    None of these forms is particularly superior to the others, and you can mix and match them across a codebase or even in a single file. It just depends on which style you feel makes your tests simpler.