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
I also have the same problem just in 3.0.1; I am not sure if it is a plugin bug.
The error is coming from the
?
in the "Elvis" operatorCounting 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.becomes
I have submitted a pull request
https://github.com/prescottprue/cypress-firebase/pull/900