如何用 jest 模拟 firebase 分析？答案

【问题标题】：How do I mock firebase analitycs with jest?如何用 jest 模拟 firebase 分析？
【发布时间】：2020-11-10 11:39:30
【问题描述】：

我有一个使用 firebase.analytics() 的组件，我尝试模拟它。

//__mocks__/firebase/app.mocks.ts   
export const analytics = jest.fn();

当我试图在第二行这样调用它时出现错误：

firebase.initializeApp(clientCredentials);
firebase.analytics();

错误是 TypeError: _app.default.analytics is not a function

用玩笑来模拟这些：

jest.mock('firebase/app');
jest.mock('firebase/analytics');

我应该做更多的事情吗？

【问题讨论】：

标签： reactjs unit-testing mocking jestjs react-testing-library

【解决方案1】：

这是一个仅使用jest.mock(moduleName, factory, options) 方法而不创建__mocks__ 目录的示例。

index.ts:

import firebase from 'firebase';

function main() {
  const clientCredentials = {};
  firebase.initializeApp(clientCredentials);
  firebase.analytics();
}

export { main };

index.test.ts:

import { main } from './';
import firebase from 'firebase';

jest.mock('firebase', () => {
  return { initializeApp: jest.fn(), analytics: jest.fn() };
});

describe('63008620', () => {
  afterAll(() => {
    jest.resetAllMocks();
  });
  it('should pass', () => {
    main();
    expect(firebase.initializeApp).toBeCalledWith({});
    expect(firebase.analytics).toBeCalledTimes(1);
  });
});

单元测试结果：

 PASS  stackoverflow/63008620/index.test.ts (14.665s)
  63008620
    ✓ should pass (7ms)

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

【讨论】：