首页 > 解决方案 > 使用 Jest 测试 Firebase RealtimeDatabase

问题描述

我的目的只是测试一个功能。我无法弄清楚如何正确模拟 firebase。我尝试使用来自 Jest 文档的 axios 模拟来保留示例。我有以下代码:

音乐服务.js

import { initializeApp } from "firebase/app";
import "firebase/database";

const firebase = initializeApp({
  apiKey: "<API_KEY>",
  authDomain: "<PROJECT_ID>.firebaseapp.com",
  databaseURL: "https://<DATABASE_NAME>.firebaseio.com",
  projectId: "<PROJECT_ID>",
  storageBucket: "<BUCKET>.appspot.com",
  messagingSenderId: "<SENDER_ID>",
});

export class MusicService {
  static getAlbums() {
    return firebase.database().ref("albums").once("value")
    .then(snapshot => Object.values(snapshot.val()));
  }
}

MusicService.test.js

import firebase from 'firebase/app';
import 'firebase/database';
import { MusicService } from './MusicService';

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

test("test", () => {
  firebase.initializeApp.mockImplementation(() => {
    database: jest.fn(() => {
      return {
        ref: jest.fn()
      }
    })
  });

  MusicService.getAlbums();
});

问题是我收到以下错误: 在此处输入图像描述

我试图模拟 firebase.database。

test("test", () => {
  firebase.mockImplementation(() => {
    return {
      database: {

      }
    }
  });
  MusicService.getAlbums();
});

但在这种情况下,我收到错误消息:

TypeError: _app.default.mockImplementation 不是函数。

我不希望给出工作示例,但是您能告诉我,我究竟应该模拟什么?整个 firebase 库或者我的函数开始的部分 - return firebase.database().

标签: javascriptfirebaseunit-testingfirebase-realtime-databasejestjs

解决方案


我已经想通了。我应该只模拟那些模块,一个我要测试的函数,取决于。例如,我想测试getAlbums功能。它使用initializeAppfirebase/app模块中导入的函数MusicService.js。因此,当initializeApp函数被调用时,它应该返回一个包含database函数的对象,该函数又返回一个带有refonce函数的对象。代码:

音乐服务.test.js

import { MusicService } from "./FirebaseService";

jest.mock("firebase/app", () => {
  const data = { name: "unnamed" };
  const snapshot = { val: () => data };
  return {
    initializeApp: jest.fn().mockReturnValue({
      database: jest.fn().mockReturnValue({
        ref: jest.fn().mockReturnThis(),
        once: jest.fn(() => Promise.resolve(snapshot))
      })
    })
  };
});

test("getAlbums function returns an array", async () => {
  const data = await MusicService.getAlbums();
  expect(data.constructor).toEqual(Array);
});

推荐阅读