javascript - 如何在 Jest 中进行单元测试并检查函数是否正在调用预期的 firebase 方法？

Question

在App.ts中，我正在调用firebase.auth().signInWithEmailAndPassword(email, password)方法

现在我想进行单元测试，以检查当从 App.spec.ts 调用 myAuthenticationPlugin.authenticate(email,password) 方法时，它还会调用 firebase.auth().signInWithEmailAndPassword(email, password) 方法，因为这就是 App.ts 本质上所做的..

我尝试了多种解决方法，但没有效果。

App.ts

const App= {
    authenticate: async (email, password) => {
        await firebase.auth().signInWithEmailAndPassword(email, password)
  },
}

App.spec.ts

import myAuthenticationPlugin from 'authenticationPlugin/App'
import firebase from 'firebase/app'
jest.mock('firebase/app', () => {
  const firebase = {
    auth: jest.fn(() => {
      return {
        currentUser: {
          email: 'test',
          uid: '123',
          emailVerified: true
        },

        signInWithEmailAndPassword: jest.fn().mockImplementation()
      }
    }),
    initializeApp: jest.fn()
  }
  return firebase
})

describe('Test for authenticate ()', () => {
    it('signInWithEmailAndPassword ()', () => {
      const email = 'test'
      const password = 'mypassword'
      myAuthenticationPlugin.authenticate(email, password)
      expect(firebase.auth().signInWithEmailAndPassword).toHaveBeenCalled()
    })
  })

我收到错误

● App.js (Authentication Plugin) › Test for authenticate () › signInWithEmailAndPassword ()

    expect(jest.fn()).toHaveBeenCalled()

    Expected number of calls: >= 1
    Received number of calls:    0

      44 |       const password = 'mypassword'
      45 |       myAuthenticationPlugin.authenticate(email, password)
    > 46 |       expect(firebase.auth().signInWithEmailAndPassword).toHaveBeenCalled()
         |                                                          ^
      47 |     })
      48 |   })
      49 | })

      at Object.<anonymous> (tests/unit/App.spec.ts:46:58)

Answer 1

这是统一测试解决方案:

app.ts:

import firebase from 'firebase/app';

const App = {
  authenticate: async (email, password) => {
    await firebase.auth().signInWithEmailAndPassword(email, password);
  },
};

export default App;

app.test.ts:

import App from './app';
import firebase from 'firebase/app';

jest.mock('firebase/app', () => {
  return {
    auth: jest.fn().mockReturnThis(),
    signInWithEmailAndPassword: jest.fn(),
  };
});

describe('61352544', () => {
  it('should pass', async () => {
    const email = '<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="1c79647d716c70795c7b717d7570327f7371" rel="noreferrer noopener nofollow">[email protected]</a>';
    const password = '123';
    await App.authenticate(email, password);
    expect(firebase.auth().signInWithEmailAndPassword).toBeCalledWith(email, password);
  });
});

100%覆盖率的单元测试结果:

 PASS  stackoverflow/61352544/app.test.ts (12.122s)
  61352544
    ✓ should pass (9ms)

----------|---------|----------|---------|---------|-------------------
File      | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
----------|---------|----------|---------|---------|-------------------
All files |     100 |      100 |     100 |     100 |                   
 app.ts   |     100 |      100 |     100 |     100 |                   
----------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        14.061s

源代码:https://github.com/mrdulin/react-apollo-graphql-starter-kit/tree/master/stackoverflow/61352544