skip to Main Content

I am writing cypress e2e tests for my nextjs web app, which uses firebase on the back end. I have followed the guide in the docs for setting it up using the cypress-firebase package (https://www.npmjs.com/package/cypress-firebase), but I am getting an error relating to webpack:

Webpack Compilation Error
./node_modules/cypress-firebase/lib-esm/plugin.js 18:27
Module parse failed: Unexpected token (18:27)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| export default function pluginWithTasks(cypressOnFunc, cypressConfig, adminInstance, overrideConfig) {
|     // Only initialize admin instance if it hasn't already been initialized
>     if (adminInstance.apps?.length === 0) {
|         initializeFirebase(adminInstance, overrideConfig);
|     }

Here is the contents of my cypress/support/commands.js file (I am using firebase version 9.15.0, hence the imports from firebase/compat/*):

import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/database';
import 'firebase/compat/firestore';
import { attachCustomCommands } from 'cypress-firebase';


const fbConfig = {
  apiKey: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
  authDomain: process.env.NEXT_PUBLIC_AUTH_DOMAIN,
  projectId: process.env.NEXT_PUBLIC_PROJECT_ID,
  storageBucket: process.env.NEXT_PUBLIC_STORAGE_BUCKET,
  messagingSenderId: process.env.NEXT_PUBLIC_MESSAGING_SENDER_ID,
  appId: process.env.NEXT_PUBLIC_APP_ID
};

firebase.initializeApp(fbConfig);

attachCustomCommands({ Cypress, cy, firebase });

Here is the contents of my cypress.config.js file:

const { defineConfig } = require('cypress');
const cypressFirebasePlugin = require('cypress-firebase').plugin;
const admin = require('firebase-admin');


module.exports = defineConfig({
  e2e: {
    baseUrl: 'http://localhost:3000',
    chromeWebSecurity: false,
    setupNodeEvents(on, config) {
      return cypressFirebasePlugin(on, config, admin, { projectId: process.env.NEXT_PUBLIC_PROJECT_ID });
    },
  },
});

I have a CYPRESS_TEST_UID in my .env file and have downloaded the serviceAccount.json file required by firebase-admin. I am not sure what is causing this error; any help would be much appreciated.

2

Answers


  1. I also have the same problem just in 3.0.1; I am not sure if it is a plugin bug.

    Login or Signup to reply.
  2. The error is coming from the ? in the "Elvis" operator

         if (adminInstance.apps?.length === 0) {
    ^                          ^
    #0                         #27
    

    Counting from #0, character #27 is the ?. This operator, ?., was added recently to Javascript, and is not expected by Webpack.

    I am submitting a pull request to fix this

    There are a few dozen other uses of ?. in the package. We can work around this problem by rewriting them in the older format, e.g.

    a ?. b
    

    becomes

    a && a.b
    

    I have submitted a pull request

    https://github.com/prescottprue/cypress-firebase/pull/900

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search