Issue with displaying multiple screenshot in HTML report

[nomercy360]

Environment

- OS: MacOS 14.0
- Node: v20.12.0
- cypress-mochawesome-reporter: 3.8.2
- cypress: 13.6.4

What happened?

When there is more than 1 attempt failed, we receive same amount of screenshots. But they are displaying wrongly in result report. They should be rendered as unique image each one, but instead all paths are in one image src, separated by comma. Example:

<img src="/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 2).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 3).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 4).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 5).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 6).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 7).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 8).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 9).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 10).png,/01RealDesktop/3Plane2Steps.js/1PlaneBackStep -- Find UUID (failed) (attempt 11).png" class="test--image---2Z5X2" alt="cypress-mochawesome-reporter-screenshots">

Example of source report json context field (not same data, but structure is the same):

              "context": "{\n  \"title\": \"cypress-mochawesome-reporter-screenshots\",\n  \"value\": [\n    [\n      \"/AutoBetDemo.js/AutoBetDemoDesktop -- Get betId (failed).png\"\n    ],\n    [\n      \"/AutoBetDemo.js/AutoBetDemoDesktop -- Get betId (failed) (attempt 2).png\"\n    ],\n    [\n      \"/AutoBetDemo.js/AutoBetDemoDesktop -- Get betId (failed) (attempt 3).png\"\n    ]\n  ]\n}",

Config file

const { defineConfig } = require("cypress");
module.exports = defineConfig({
  chromeWebSecurity: false,

  projectId: "17qqqs",
  numTestsKeptInMemory: 10, // default is 50; reducing memory consumption
  video: false,
  reporter: "cypress-multi-reporters",

  e2e: {
    // We've imported your old cypress plugins here.
    // You may want to clean this up later by importing these.
    setupNodeEvents(on, config) {
      return require("./cypress/plugins/index.js")(on, config);
    },
    specPattern: "cypress/e2e-mvp//**/*.{js,jsx,ts,tsx}",
    testIsolation: false,
    experimentalRunAllSpecs: true,
  },
  experimentalWebKitSupport: true,
});

Relevant log output

[mochawesome] Report JSON saved to /Users/maksimkadocnikov/work/aviatrix-e2e-tests/reports/.jsons/mochawesome.json

  (Results)

  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ Tests:        4                                                                                │
  │ Passing:      2                                                                                │
  │ Failing:      2                                                                                │
  │ Pending:      0                                                                                │
  │ Skipped:      0                                                                                │
  │ Screenshots:  6                                                                                │
  │ Video:        false                                                                            │
  │ Duration:     52 seconds                                                                       │
  │ Spec Ran:     AutoBetDemo.js                                                                   │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘

  (Screenshots)

  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Get betId (failed).png                                                
  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Get betId (failed) (attempt 2).png                                    
  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Get betId (failed) (attempt 3).png                                    
  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Check BetStatus (failed).png                                          
  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Check BetStatus (failed) (attempt 2).png                              
  -  /Users/maksimkadocnikov/work/aviatrix-e2e-tests/cypress/screenshots/AutoBetDemo.     (1280x633)
     js/AutoBetDemoDesktop -- Check BetStatus (failed) (attempt 3).png                              

====================================================================================================

  (Run Finished)

       Spec                                              Tests  Passing  Failing  Pending  Skipped  
  ┌────────────────────────────────────────────────────────────────────────────────────────────────┐
  │ ✖  AutoBetDemo.js                           00:52        4        2        2        -        - │
  └────────────────────────────────────────────────────────────────────────────────────────────────┘
    ✖  1 of 1 failed (100%)                     00:52        4        2        2        -        -

Anything else?

No response

[maximegheraille]

I have recently seen this issues also appearing in our e2e because we added retries: 3 in our cypress config. it is indeed adding 3 times the same snapshot url in the image source attribute

[LironEr]

Please create a repo with the problem and steps to reproduce the issue so I can have a look.

Thanks.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed in 7 days if no further activity occurs. Thank you for your contributions.