在 javascript 中测试使用 Firebase Auth 的 React 应用

Question

我导入登录组件进行测试，我得到这个错误

 ● Test suite failed to run

    FIREBASE FATAL ERROR: Can't determine Firebase Database URL. Be sure to include  a Project ID when calling firebase.initializeApp().

到目前为止我有这个

import React from "react";
import { render} from "@testing-library/react/pure";
import "@testing-library/jest-dom";
import Login from "../src/components/auth/Login";
import * as firebase from "@firebase/testing";

const PROJECT_ID = "connect-four-development";

describe("Login", () => {
  it("renders Login.js without crashing", async () => {
    await firebase.initializeTestApp({ projectId: PROJECT_ID }).firestore();

    render(
        <Login />
    );
  });
});

我应该如何正确初始化应用程序以进行测试？

Answer 1

我建议使用 Projects Firebase 控制台中的 config。它看起来像这样：

var firebaseConfig = {
  apiKey: "API_KEY",
  authDomain: "PROJECT_ID.firebaseapp.com",
  databaseURL: "https://PROJECT_ID.firebaseio.com",
  projectId: "PROJECT_ID",
  storageBucket: "PROJECT_ID.appspot.com",
  messagingSenderId: "SENDER_ID",
  appId: "APP_ID",
  measurementId: "G-MEASUREMENT_ID",
};

您可以在控制台的以下位置找到您的项目配置：项目设置 -> 常规。在那里你应该创建一个 Web 应用程序，你会得到一个很好的说明如何初始化你的应用程序和配置。

然后你像这样初始化你的应用程序：

const firebaseConfig = {
  // ...
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);

对于测试套件，有特定的初始化。

云防火墙：

firebase.initializeTestApp({
  projectId: "my-test-project",
  auth: { uid: "alice", email: "alice@example.com" }
});

实时数据库：

firebase.initializeTestApp({
  databaseName: "my-database",
  auth: { uid: "alice" }
});

和存储：

firebase.initializeTestApp({
  storageBucket: "my-bucket",
  auth: { uid: "alice" }
});

您还可以将代码更改为：

describe("Login", () => {
  it("renders Login.js without crashing", async () => {
    firebase.initializeTestApp({ projectId: PROJECT_ID })
    firebase.firestore();

    render(
        <Login />
    );
  });
});

应用初始化是同步的。