Firebase - 使用 Jest 进行测试会引发错误“内部断言失败:需要类定义”

Ann*_*nne 6 firebase reactjs jestjs

我正在使用 Jest 和 Enzyme 测试我的 React 应用程序。我也使用 Firebase,当我尝试为使用 Header 组件和 Firebase 登录的页面编写测试时,出现以下错误:

测试套件运行失败

INTERNAL ASSERTION FAILED: Expected a class definition

  42 | firebase.initializeApp(config);
  43 |
> 44 | export const auth = firebase.auth();
     |                              ^
  45 | export const firestore = firebase.firestore();
  46 |
  47 | const provider = new firebase.auth.GoogleAuthProvider();

  at debugFail (node_modules/@firebase/auth/src/core/util/assert.ts:256:9)
  at debugAssert (node_modules/@firebase/auth/src/core/util/assert.ts:271:5)
  at Object._getInstance (node_modules/@firebase/auth/src/core/util/instantiator.ts:34:3)
  at new CompatPopupRedirectResolver (node_modules/@firebase/auth-compat/src/popup_redirect.ts:29:9)
  at _getInstance (node_modules/@firebase/auth/src/core/util/instantiator.ts:45:14)
  at AuthImpl.Object.<anonymous>.AuthImpl._initializeWithPersistence (node_modules/@firebase/auth/src/core/auth/auth_impl.ts:121:37)
  at _initializeAuthInstance (node_modules/@firebase/auth/src/core/auth/initialize.ts:86:8)
  at node_modules/@firebase/auth/src/core/auth/register.ts:87:11
  at Component.instanceFactory (node_modules/@firebase/auth/src/core/auth/register.ts:90:10)
  at Provider.Object.<anonymous>.Provider.getOrInitializeService (node_modules/@firebase/component/src/provider.ts:318:33)
  at Provider.Object.<anonymous>.Provider.initialize (node_modules/@firebase/component/src/provider.ts:242:27)
  at new Auth (node_modules/@firebase/auth-compat/src/auth.ts:68:31)
  at Component.instance.INTERNAL.registerComponent.component.Component.setServiceProps.ActionCodeInfo.Operation.EMAIL_SIGNIN [as instanceFactory] (node_modules/@firebase/auth-compat/index.ts:82:16)
  at Provider.Object.<anonymous>.Provider.getOrInitializeService (node_modules/@firebase/component/src/provider.ts:318:33)
  at Provider.Object.<anonymous>.Provider.getImmediate (node_modules/@firebase/component/src/provider.ts:115:21)
  at FirebaseAppImpl.Object.<anonymous>.FirebaseAppImpl._getService (node_modules/@firebase/app-compat/src/firebaseApp.ts:138:21)
  at FirebaseAppImpl.firebaseAppImpl.<computed> [as auth] (node_modules/@firebase/app-compat/src/firebaseNamespaceCore.ts:185:29)
  at Object.auth (node_modules/@firebase/app-compat/src/firebaseNamespaceCore.ts:166:59)
  at Object.<anonymous> (src/firebase/firebase.utils.js:44:30)
  at Object.<anonymous> (src/components/header/header.component.jsx:6:1)
  at Object.<anonymous> (src/pages/finder/finder.component.jsx:5:1)
  at Object.<anonymous> (src/pages/finder/finder.test.js:3:1)
Run Code Online (Sandbox Code Playgroud)

这是我的 Firebase 配置文件:

import firebase from 'firebase/compat/app';
import 'firebase/compat/firestore';
import 'firebase/compat/auth';

const config = {
    ...
  }

export const createUserProfileDocument = async (userAuth, additionalData) => {
  if (!userAuth) return;

  const userRef = firestore.doc(`users/${userAuth.uid}`); 
  
  const snapShot = await userRef.get();

  if(!snapShot.exist) {
    const { displayName, email } = userAuth;
    const createdAt = new Date();

    try {
      await userRef.set({
        displayName,
        email,
        createdAt,
        ...additionalData
      })
    } catch (error) {
      console.log("error creating user", error.message);
    }
  }

  return userRef;

}

firebase.initializeApp(config);

export const auth = firebase.auth();
export const firestore = firebase.firestore();

const provider = new firebase.auth.GoogleAuthProvider();
provider.setCustomParameters({ prompt: 'select_account' });
export const signInWithGoogle = () => auth.signInWithPopup(provider);

export default firebase;
Run Code Online (Sandbox Code Playgroud)

我使用的是 Firebase 9.8.0。

我缺少什么想法吗?应用程序本身和身份验证流程运行良好。

小智 2

我遇到了同样的问题,这可能是使用紧凑版本的 firebase 的问题。只需使用模块化版本。进口

import { getAuth,signInWithPopup } from 'firebase/auth'; 
Run Code Online (Sandbox Code Playgroud)

而不是

export const auth = firebase.auth();

从 getAuth 函数获取身份验证,如下所示

export const auth = getAuth();

然后您应该从“firebase/auth”导入signIn或signUp方法并将auth作为第一个参数传递。就像在这里您使用的signInWithPopup:

export const signInWithGoogle = () => auth.signInWithPopup(provider);
Run Code Online (Sandbox Code Playgroud)

你应该将其替换为:

export const signInWithGoogle = () => signInWithPopup(auth,provider)
Run Code Online (Sandbox Code Playgroud)

如果您有从 firebase/auth 导入它们并将 auth 作为第一个参数传递,那么请记住替换 firebase/auth 的 signInWithEmailAndPassword 或 createUserWithEmailAndPassword 或其他方法,这样您的应用程序和测试将毫无错误地运行。