Merge pull request #1170 from OWASP/feature-mochatest-update

fix reporting for mochatests

.github/workflows/main.yml

@@ -64,7 +64,7 @@ jobs:
         if: success() || failure()
         with:
           name: e2e results
-          path: target/test-classes/e2e/cypress/reports/
+          path: target/test-classes/e2e/cypress/
       - name: Publish Test Report
         if: success() || failure()
         uses: scacap/action-surefire-report@v1

src/test/e2e/cypress/README.md

@@ -8,7 +8,7 @@ Go to `CypressIntegrationTest` and run it as a normal unit test in IntelliJ. Thi
 a `SpringBootTest` which uses Testcontainers to start running the Cypress tests.
 The test then gathers all the output from the Cypress tests and displays them as normal unit test output in IntelliJ.
 
-The reporting of the tests themselves will be located in `target/test-classes/e2e/cypress/reports`.
+The reporting of the tests themselves will be located in `target/test-classes/e2e/cypress/reports/mochawesome`.
 
 Please note that cypress requires the templates to have been build first.
 

src/test/e2e/cypress/integration/challenges.cy.js

@@ -88,6 +88,7 @@ describe('Challenge Tests', () => {
     cy.dataCy(ChallengesPage.SUBMIT_TEXTBOX_BTN).click()
     cy.dataCy(ChallengesPage.SUCCESS_ALERT).should('contain', 'Your answer is correct!')
     cy.dataCy(ChallengesPage.PROGRESS_BAR).should('be.visible').should('not.have.attr', 'aria-valuenow', '0')
+    cy.screenshot()
   })
 
   it('Submitting right answer gives visual cue on homepage that the challenge is successfully solved', () => {

src/test/e2e/cypress/integration/themeSwitch.cy.js

@@ -29,12 +29,21 @@ describe('Theme Switching Tests', () => {
   it('Light mode persists on each page', () => {
     cy.visit('/')
     cy.dataCy(ThemeSwitchPage.LIGHT_MODE_RADIO).click()
+    cy.screenshot()
     cy.wrap(['', 'challenge/challenge-0', 'stats', 'about']).each((endpoint) => {
       cy.visit(`/${endpoint}`)
       cy.get(ThemeSwitchPage.DARK_MODE).should('not.exist')
     })
   })
-
+  it('Dark mode persists on each page', () => {
+    cy.visit('/')
+    cy.dataCy(ThemeSwitchPage.DARK_MODE_RADIO).click()
+    cy.screenshot()
+    cy.wrap(['', 'challenge/challenge-0', 'stats', 'about']).each((endpoint) => {
+      cy.visit(`/${endpoint}`)
+      cy.get(ThemeSwitchPage.DARK_MODE).should('exist')
+    })
+  })
   it('A user can switch theme to dark and back to light on each page', () => {
     cy.wrap(['', 'challenge/challenge-0', 'stats', 'about']).each((endpoint) => {
       cy.visit(`/${endpoint}`)

src/test/e2e/cypress/support/e2e.js

@@ -15,6 +15,17 @@
 
 // Import commands.js using ES2015 syntax:
 import './commands'
+import addContext from 'mochawesome/addContext'
+import fs from 'fs'
+
+Cypress.on('test:after:run', (test, runnable) => {
+  const screenshot = `../screenshots/${Cypress.spec.name}/${runnable.parent.title} -- ${test.title}.png`
+  if (fs.existsSync(screenshot)) {
+    addContext({ test }, screenshot)
+  } else {
+    console.log(screenshot + 'not found')
+  }
+})
 
 // Alternatively you can use CommonJS syntax:
 // require('./commands')

src/test/e2e/reporter-config.json

@@ -1,9 +1,12 @@
 {
     "reporterEnabled": "spec, mochawesome",
     "mochawesomeReporterOptions": {
+        "screenshotOnRunFailure": true,
+        "video": true,
+        "videoCompression": true,
         "reportDir": "cypress/reports/mochawesome",
         "overwrite": false,
-        "html": false,
+        "html": true,
         "json": true
     }
 }

src/test/java/org/owasp/wrongsecrets/CypressIntegrationTest.java

@@ -5,6 +5,7 @@
 import io.github.wimdeblauwe.testcontainers.cypress.CypressTestResults;
 import io.github.wimdeblauwe.testcontainers.cypress.CypressTestSuite;
 import java.io.IOException;
+import java.time.Duration;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.concurrent.TimeoutException;
@@ -54,6 +55,8 @@ List<DynamicContainer> runCypressTests()
     Testcontainers.exposeHostPorts(port);
 
     try (CypressContainer container = new CypressContainer().withLocalServerPort(port)) {
+      container.withMaximumTotalTestDuration(Duration.ofMinutes(15));
+
       container.start();
       CypressTestResults testResults = container.getTestResults();