Having difficulty integrating plugins like Lighthouse into my Cypress project

I need assistance with integrating the cypress automation plugin into my project. I made changes to my index.js file in the plugin folder, but now I am receiving this error:

cy.lighthouse() is not a function 

Here is my index.js file content:

const { lighthouse, pa11y, prepareAudit } = require("cypress-audit");
module.exports = (on, config) => {
  // `on` is used to hook into various events Cypress emits
  // `config` is the resolved Cypress config
};

If anyone can provide guidance on resolving this issue, I would greatly appreciate it. Thank you!

Answer №1

Upon reviewing the documentation, you will find the complete cypress/plugins/index.js

Cypress v9 - cypress/plugins/index.js

const { lighthouse, pa11y, prepareAudit } = require("cypress-audit");

module.exports = (on, config) => {
  on("before:browser:launch", (browser = {}, launchOptions) => {
    prepareAudit(launchOptions);
  });

  on("task", {
    lighthouse: lighthouse(), // remember to call the function
    pa11y: pa11y(), // remember to call the function
  });
};

However, if you encounter the error message "cy.lighthouse() is not a function," it may be due to a missing line in cypress/support/index.js, which you should also include

Cypress v9 - cypress/support/index.js

import "cypress-audit/commands";

For the most recent version of Cypress

Cypress v10 - cypress.config.js

const { defineConfig } = require('cypress')
const { lighthouse, pa11y, prepareAudit } = require("cypress-audit");

module.exports = defineConfig({
  e2e: {
    baseUrl: 'http://localhost:1234',
    setupNodeEvents(on, config) {

    on("before:browser:launch", (browser = {}, launchOptions) => {
      prepareAudit(launchOptions);
    });

    on("task", {
      lighthouse: lighthouse(), // calling the function is crucial
      pa11y: pa11y(), // calling the function is crucial
    }); 
  },
})

Cypress v10 - cypress/support/e2e.js

import "cypress-audit/commands";

Answer №2

I have found a solution that works perfectly for the given problem:

const { lighthouse, pa11y, prepareAudit } = require("cypress-audit");

module.exports = (on, config) => {
  on("before:browser:launch", (browser = {}, launchOptions) => {
    prepareAudit(launchOptions);
  });

  on("task", {
    lighthouse: lighthouse(), // invoking the function is crucial
    pa11y: pa11y(), // invoking the function is crucial
  });
};

Using Cypress v9 - cypress/support/index.js

import "cypress-audit/commands";

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Jest test encountering an issue where FileReader, File, and TextDecoder are not defined

While I have primarily used Jasmine for tests in the past, I am now experimenting with Jest. However, I have encountered an issue where classes like FileReader, File, and TextDecoder are not defined in my tests. How can I incorporate these classes with t ...

Leveraging AJAX, PHP, and MySQL for showcasing tabular information

My goal is to dynamically display a column of data labeled as [pin], depending on the values of [plan] and [order_id]. Specifically, when plan=9 and order_id=0. I am looking to achieve this without having to reload the entire page by utilizing Ajax. Below ...

Having trouble with npm on Windows 8? Getting an error message like "nodejs- Error: ENOENT

Just updated to the latest version of node.js on my Windows 8 system. When I enter npm -version in the command prompt, it correctly displays 1.4.23 However, every time I try to use the install command, no matter what argument I provide, I encounter t ...

Clicking on an element triggers the addition of a class, and the newly

Once the page has finished loading, I am able to utilize jQuery to add a specific class in the following way. $(document).ready(function() { $("#parent").click(function(){ $(".child").addClass("active"); }); }) ...

The npm installation error is indicating that the localeCompare method cannot be called on an undefined object

After installing nodemailer, I encountered an error indicating that it was not configured correctly. I then updated it to version 0.7.1, only to receive a message stating that the mimelib module could not be found. Upon attempting to reinstall nodemailer o ...

Are mutations in Vuex guaranteed to be atomic?

I'm currently investigating the atomicity of mutations in Vuex. The code snippet I'm reviewing has me questioning whether the CHANGE_A mutation could potentially be triggered while CHANGE_B is still in progress: const mutations = { [CHANGE_A]( ...

Exploring React: Opening a new page without rendering the SideBar component

I currently have an application with a sidebar that navigates to three different pages, all of which include a navigation bar and the sidebar. However, for the next page I want to exclude the sidebar but still include the navigation bar. How can I configur ...

Can you create a while loop that continuously asks for user input, stores the responses, and then makes them accessible in an array?

When developing a Yeoman generator, the necessary dependencies can be found at https://github.com/sboudrias/mem-fs-editor#copytplfrom-to-context-settings and https://github.com/SBoudrias/Inquirer.js/. The main goal is to prompt the user with a question an ...

What methods does Angular use to handle bounded values?

Consider this straightforward Angular snippet: <input type="text" ng-model="name" /> <p>Hello {{name}}</p> When entering the text <script>document.write("Hello World!");</script>, it appears to be displayed as is without bei ...

Tips for creating text that adjusts to the size of a div element

I'm currently working on developing my e-commerce website. Each product is showcased in its own separate div, but I've encountered a challenge. The issue arises when the product description exceeds the limits of the div, causing it to overflow ou ...

Having trouble resolving issues with Selenium's Java WebDriver and ChromeDriver?

Hello! I'm encountering an error even after adding all the necessary jar files to the classpath. I have an interview coming up on Monday, so I really need to resolve this issue as soon as possible. My Java version is 21 and Chrome version is 122. Can ...

Issue: self-signed certificate detected in the certificate chain within Node.js

I'm having trouble installing the nuclide package in atom for my react-native development. I can't figure out why I'm getting the error message below. Can anyone provide some guidance on how to fix this? Thank you in advance. npm ERR! fetc ...

What is the origin of this mysterious error?

I'm working on a function to format various types of variables and utilize a toString() method. It's handling complex objects, arrays, and circular references flawlessly. However, when testing it on a jQuery object using format($("body")) with l ...

Stealthy access using the Facebook API log-in

I'm currently developing an app that features Facebook login functionality. I'm wondering if there's a way to keep a device authorized so that users don't have to go through the process of logging in with Facebook each time they use the ...

Utilizing ng-disabled with a custom directive

Is it possible to achieve the following: <directiveName parameter1=value1 parameter2=value2 ng-disabled="true"> </directiveName> I tried this but couldn't get it to work and didn't find many examples of its use. However, I can togg ...

When the onload event is triggered, the jscript function called var data is loaded, without any interruption in

I encountered an issue while trying to preview an image from a BBCode decoder. The code works fine, but I need the image to be inside an <a> href link, so that people can click on it and get the image source. Additionally, I want to display a message ...

The toggle checkbox feature in AngularJS seems to be malfunctioning as it is constantly stuck in the "off"

I am trying to display the on and off status based on a scope variable. However, it always shows as off, even when it should be on or checked. In the console window, it shows as checked, but on the toggle button it displays as off Here is the HTML code: ...

What could be causing the JavaScript array to not successfully transfer to PHP?

Despite searching for solutions, I am unable to get the desired outcome. When I check my JavaScript array in the console, it appears like this: [] 0:Object stock:27 createdtime:"2016-04-08T04:00:00+0000" id:"693852404037393999" units:438 ...

Are non-local variables in Node.js considered safe to use?

Would it be secure to implement this code in Node.js/Express.js? // using Object.create(null) to avoid key collisions // refer http://www.devthought.com/2012/01/18/an-object-is-not-a-hash/ var theHash = Object.create(null); exports.store = function (req, ...

Accessing state in Vuex modules is crucial for managing and manipulating data effectively

Feeling a bit lost here... I'm utilizing Vuex in my project and have a module called common stored in the file common.js: const initState = { fruits: [] } export default { state: initState, mutations: { SET_FRUITS(state, fruits) { cons ...