首页 > 解决方案 > 在 javascript 中测试使用 Firebase Auth 的 React 应用

问题描述

我导入登录组件进行测试,我收到此错误

 ● 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 />
    );
  });
});

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

标签: reactjsfirebaseauthenticationtestingjestjs

解决方案


我建议使用configProjects Firebase 控制台中的 。它看起来像这样:

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 />
    );
  });
});

应用程序初始化是同步的。


推荐阅读