Save the test outcomes in HTML format using cypress

Can Cypress test results be exported to an HTML or another format, similar to cucumber-report.html?

javascriptcypress

Answer №1

If you want to generate a comprehensive report using the mochawesome reporter, there is a solution to merge all individual reports into one. By using mochawesome-merge, you can combine all test results and export them in HTML format for easier analysis.

Here's how you can achieve this:

  1. Begin by installing mocha, mochawesome, and mochawesome-merge (note that mochawesome requires mocha as a peer dependency).
npm install mocha
npm install mochawesome --save-dev
npm install mochawesome-merge --save-dev
  1. Add the following configuration to your cypress.json file:
{
      "reporter": "mochawesome",
     "reporterOptions": {
       "charts": true,
       "overwrite": false,
       "html": false,
       "json": true,
       "reportDir": "cypress/report/mochawesome-report"
      }
    }
  1. Run Cypress with the following command:

npx cypress run --reporter mochawesome

  1. After running all tests, merge the generated reports into a single file using this command:

npx mochawesome-merge cypress/report/mochawesome-report/*.json > cypress/report/output.json

  1. Finally, convert the merged JSON file into an HTML report with the following command:

npx marge cypress/report/output.json --reportDir ./ --inline

  1. Once the HTML report is created, you will find it at the specified location:

✓ Reports saved: E:\Project_Path\cypress\report\output.html

Answer №2

Absolutely, feel free to utilize any mocha reporter with Cypress since it is built on top of it. The spec reporter is the default option.

To integrate a mocha reporter into your Cypress setup, simply add it to your cypress.json configuration file like so:

{
  "reporter": "mochawesome" 
}

For more details and guidance on custom reporters, check out this helpful documentation: Reporters

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

"Trouble displaying specific events based on their IDs retrieved from the MySQL database

Each button in my list is associated with a specific person. Upon clicking a button, it directs to calendar.php?id=5 (where 5 is the personal id). I want the calendar to display the vacations scheduled for that particular id from the MySQL database. even ...

javascriptphpjquerymysqlfullcalendar

The issue of for loops malfunctioning in JavaScript when using a variable declared in Node.js and passed to Jade

Currently, I am delving into the world of node.js and JADE but seem to be encountering a challenge when it comes to implementing a for loop within a JavaScript block in a jade file. My approach involves experimenting with a basic code where I pass an array ...

javascriptnode.jsfor-loopexpresspug

Unable to retrieve push token for the device. Please verify the validity of your FCM configuration

Looking for a solution to the issue of obtaining a push token Error: Unable to retrieve push token for device. Ensure that your FCM configuration is correct I have integrated Expo permissions and notifications in my React Native app, but nothing seems to ...

javascriptandroidnode.jsreactjsreact-native

Error encountered: Attempting to access the 'length' property of an undefined variable in JSON data while using the $.each function

When I execute the following code snippet: var obj = $.parseJSON(json.responseText); $.each(obj.collection.response, function (i) { $.each(this.PRESENT_STUDENT, function (i, j) { $.each(j , function (i, j){ $( ...

javascriptjqueryjson

Struggling with Getting My Animation to Function Correctly

I am trying to create a JQuery Animation that will move a div covering a text box up into the border when clicked. Despite multiple attempts, I can't seem to get the animation to work properly. Any suggestions? JavaScript function moveup(title,text ...

javascripthtmlcssanimation

Verify the presence of both class and id before modifying the content of the h1 tag and automatically redirecting the page

I'm encountering some issues triggering my JS/JQ on an HTML5 page. Essentially, I want to verify the existence of the following ID and class: ID: page_blog CLASS: page current <section class="page current" id="page_blog" style="z-index: 99; lef ...

javascriptjqueryhtml

Utilizing Object-Oriented Programming in jQuery/JavaScript to effectively pass a value out of a function that is compatible across different browsers

While this question may have been asked before, I urgently need a solution for a production environment. I am feeling quite overwhelmed trying to figure out which objects I should create and utilize. function scroll(min, max) { // perform actions } fun ...

javascriptjqueryoop

Using a static function within a library's state function in NextJS is throwing an error: "not a function"

Inside a library, there's a special class known as MyClass. This class contains a static method named setData. The contents of the MyClass.js file are shown below: class MyClass { static DATA = ''; static setData(data) { MyClass ...

javascriptwebpacknext.js

Which specific HTML element triggers the initiation of ajax in Jquery?

I have a situation where various HTML elements trigger ajax requests when clicked. My goal is to determine which specific element was clicked inside the ajaxComplete event. Although I attempted to use event.target, it only returns the entire document inst ...

javascriptjqueryhtmlajax

How to use jQuery to set a background image using CSS

I've been working on setting backgrounds dynamically with a jQuery script, but it seems like the .css function is not working as expected. Here's the code snippet: $(document).ready(function () { $(".VociMenuSportG").each(function () { ...

javascriptjqueryhtmlcss

Having trouble loading the linked CSS file in the Jade template

My directory structure is organized as follows: --votingApp app.js node_modules public css mystyle.css views test.jade mixins.jade In the file mixins.jade, I have created some general purpose blocks like 'bo ...

javascripthtmlcssnode.jsexpress

A step-by-step guide on toggling between light mode and dark mode using water.css

Implementing the water.css on my website, I have this JavaScript code: function setTheme(themeName) { localStorage.setItem('theme', themeName); document.documentElement.className = themeName; } // function to toggle between light and dark ...

javascripthtmlcss

Differences between CookieParser and req.cookies in ExpressJS

As I was reading the documentation on req.cookies in expressjs docs, I learned that when the cookieParser() middleware is used, this object defaults to {} but otherwise contains the cookies sent by the user-agent. Then, exploring the details of the Coo ...

javascriptnode.jscookiesexpress

Tips for sorting items in Wordpress with JavaScript / on click?

I am currently utilizing a method similar to the one outlined in this resource from w3 schools for filtering elements within divs. However, I am facing challenges when attempting to integrate this script into my Aurora Wordpress site due to the removal of ...

javascripthtmlcsswordpress

Need help implementing the disableGutters property on MTableToolbar?

I am currently using react material-table and I would like to customize the default toolbar styles by passing the prop disableGutters={true}, similar to how it's done in material-ui toolbar. Below is the code snippet that I have tried: <MaterialTab ...

javascriptreactjsmaterial-uimaterial-table

Verify the form data before triggering the ajax call with just one click

Ensuring that all required areas are completed in a form is crucial. The form needs to be validated properly to either reject the request with a message showing what information is missing, or submit it successfully... The rejection process works well as ...

javascriptjqueryajaxvalidation

Is the variable leaping to a superior scope?

A few days back, I encountered a strange bug in my code that has left me puzzled. It appears that a variable declared within a narrower scope is somehow leaking into a broader one. Any insights into what might be going wrong here? Here's a simplified ...

javascriptnode.jsexpressmemoryscope

How to simulate keyboard events when a dropdown list is opened in an Angular application

Requirement- A situation arises where upon opening the dropdown menu, pressing the delete key on the keyboard should reset the index to -1. Steps to reproduce the issue: 1. Click on the dropdown and select an option from the menu. 2. Click on the dropdow ...

javascriptjqueryangulartypescript

Wordpress website fails to initiate Automate on Scroll (aos) functionality

I seem to be having trouble tackling any task that requires even the smallest amount of brain power. My current struggle is trying to integrate the AOS library into my Wordpress site. In an attempt to make it work, I inserted the following code into my fu ...

javascriptphpwordpressjquery-animate

Can we disable hydration warnings for all nested children within a component in NextJS?

Note: I am currently using NextJS 14, but I suspect this issue also exists in NextJS 13. I have created a ThemeToggle component that utilizes the next-themes package. Even if I develop my own version of next-themes using React Context or another state man ...

javascriptreactjsnext.jsserver-side-rendering