🔀Merge branch 'main' of https://github.com/kien-ht/cypress-image-diff…

…-html-report into feat/github-ci-server
kien-ht · May 4, 2024 · 6cd5947 · 6cd5947
2 parents ca979b0 + 1d8ba88
commit 6cd5947
Show file tree

Hide file tree

Showing 6 changed files with 78 additions and 67 deletions.
diff --git a/src/common/utils.ts b/src/common/utils.ts
@@ -39,50 +39,61 @@ export async function getResolvedConfig({
   )
 }
 
-export async function getResolvedInputJson(
+export async function getResolvedReportJson(
   config: ResolvedUserConfig,
   mode: RunMode = 'served'
 ): Promise<ResolvedReport> {
-  const json = await getInputJson(config.reportJsonFilePath)
+  const json = await getReportJson(config.reportJsonFilePath)
+  const jsonWithTotalStats = getReportJsonWithTotalStats(json)
 
+  return {
+    ...jsonWithTotalStats,
+    suites: await Promise.all(
+      jsonWithTotalStats.suites.map(async (suite) => ({
+        ...suite,
+        tests: await Promise.all(
+          suite.tests.map(async (test) => ({
+            ...test,
+            baselinePath: await getResolvedScreenshotPath(
+              test.baselinePath,
+              config,
+              mode
+            ),
+            diffPath: await getResolvedScreenshotPath(
+              test.diffPath,
+              config,
+              mode
+            ),
+            comparisonPath: await getResolvedScreenshotPath(
+              test.comparisonPath,
+              config,
+              mode
+            )
+          }))
+        )
+      }))
+    )
+  }
+}
+
+export function getReportJsonWithTotalStats(json: Report): ResolvedReport {
   return {
     ...json,
-    suites: (
-      await Promise.all(
-        json.suites.map(async (suite) => ({
-          ...suite,
-          tests: await Promise.all(
-            suite.tests.map(async (test) => ({
-              ...test,
-              passed: test.status === 'pass' ? 1 : 0,
-              failed: test.status === 'fail' ? 1 : 0,
-              specPath: getNormalisedPath(test.specPath, config, mode),
-              baselinePath: await getResolvedScreenshotPath(
-                test.baselinePath,
-                config,
-                mode
-              ),
-              diffPath: await getResolvedScreenshotPath(
-                test.diffPath,
-                config,
-                mode
-              ),
-              comparisonPath: await getResolvedScreenshotPath(
-                test.comparisonPath,
-                config,
-                mode
-              )
-            }))
-          )
+    suites: json.suites
+      .map((suite) => ({
+        ...suite,
+        tests: suite.tests.map((test) => ({
+          ...test,
+          passed: test.status === 'pass' ? 1 : 0,
+          failed: test.status === 'fail' ? 1 : 0
         }))
-      )
-    ).map((suite) => ({
-      ...suite,
-      id: suite.path,
-      passed: suite.tests.reduce((s, i) => s + i.passed, 0),
-      failed: suite.tests.reduce((s, i) => s + i.failed, 0),
-      path: getNormalisedPath(suite.path, config, mode)
-    }))
+      }))
+      .map((suite) => ({
+        ...suite,
+        id: suite.path,
+        passed: suite.tests.reduce((s, i) => s + i.passed, 0),
+        failed: suite.tests.reduce((s, i) => s + i.failed, 0)
+      }))
   }
 }
 
@@ -120,7 +131,7 @@ export function changeCwdToPlayground() {
   }
 }
 
-export async function getInputJson(filePath: string): Promise<Report> {
+export async function getReportJson(filePath: string): Promise<Report> {
   const sourcePath = path.join(process.cwd(), filePath)
   try {
     const report = await fs.readFile(sourcePath, { encoding: 'utf8' })

diff --git a/src/core.ts b/src/core.ts
@@ -4,7 +4,7 @@ import { GenerateInlineConfig, StartInlineConfig } from './common/types.js'
 import {
   getResolvedConfig,
   getReportHtmlAfterPopulatingData,
-  getResolvedInputJson
+  getResolvedReportJson
 } from './common/utils.js'
 import { App } from './local-server/index.js'
 import http from 'http'
@@ -13,7 +13,7 @@ export async function generate(
   inlineConfig?: GenerateInlineConfig
 ): Promise<void> {
   const config = await getResolvedConfig(inlineConfig)
-  const json = await getResolvedInputJson(config, 'static')
+  const json = await getResolvedReportJson(config, 'static')
   const html = await getReportHtmlAfterPopulatingData(json)
 
   try {

diff --git a/src/local-server/controller.ts b/src/local-server/controller.ts
@@ -1,6 +1,6 @@
 import fs from 'fs-extra'
 import path from 'path'
-import { getInputJson, getResolvedInputJson } from '../common/utils.js'
+import { getReportJson, getResolvedReportJson } from '../common/utils.js'
 import {
   ResolvedUserConfig,
   Report,
@@ -13,11 +13,11 @@ export class Controller {
   constructor(private config: ResolvedUserConfig) {}
 
   async getReports(): Promise<ResolvedReport> {
-    return await getResolvedInputJson(this.config, 'served')
+    return await getResolvedReportJson(this.config, 'served')
   }
 
   async updateTest(testId: TestIdentity) {
-    const originalReport = await getInputJson(this.config.reportJsonFilePath)
+    const originalReport = await getReportJson(this.config.reportJsonFilePath)
     const [suiteIndex, testIndex] = this.findTest(originalReport, testId)
 
     const foundTest = originalReport.suites[suiteIndex].tests[testIndex]

diff --git a/test/__snapshots__/core.spec.ts.snap b/test/__snapshots__/core.spec.ts.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Core Generate HTML report should create HTML report with given reportJsonFilePath 1`] = `"{"report":{"total":6,"totalPassed":3,"totalFailed":3,"totalSuites":3,"suites":[{"name":"image-diff.cy.js","path":"../cypress/specs/image-diff.cy.js","tests":[{"status":"fail","name":"image-diff.cy-wholePage","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"../cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-wholePage.png","diffPath":"../cypress-visual-screenshots/diff/image-diff.cy-wholePage.png","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-wholePage.png","passed":0,"failed":1},{"status":"pass","name":"image-diff.cy-wholePageThreshold","percentage":0.0900966398590363,"failureThreshold":0.2,"specPath":"../cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-wholePageThreshold.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-wholePageThreshold.png","passed":1,"failed":0},{"status":"pass","name":"image-diff.cy-element","percentage":0,"failureThreshold":0,"specPath":"../cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-element.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-element.png","passed":1,"failed":0},{"status":"fail","name":"image-diff.cy-hideElement","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"../cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-hideElement.png","diffPath":"../cypress-visual-screenshots/diff/image-diff.cy-hideElement.png","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-hideElement.png","passed":0,"failed":1}],"id":"cypress/specs/image-diff.cy.js","passed":2,"failed":2},{"name":"retry.cy.js","path":"../cypress/specs/retry.cy.js","tests":[{"status":"pass","name":"retry.cy-retry","percentage":0,"failureThreshold":0,"specPath":"../cypress/specs/retry.cy.js","specFilename":"retry.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/retry.cy-retry.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/retry.cy-retry.png","passed":1,"failed":0}],"id":"cypress/specs/retry.cy.js","passed":1,"failed":0},{"name":"folder-structure.cy.js","path":"../cypress/specs/folder-structure-test/folder-structure.cy.js","tests":[{"status":"fail","name":"folder-structure.cy-wholePage","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"../cypress/specs/folder-structure-test/folder-structure.cy.js","specFilename":"folder-structure.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/folder-structure.cy-wholePage.png","diffPath":"../cypress-visual-screenshots/diff/folder-structure.cy-wholePage.png","comparisonPath":"../cypress-visual-screenshots/comparison/folder-structure.cy-wholePage.png","passed":0,"failed":1}],"id":"cypress/specs/folder-structure-test/folder-structure.cy.js","passed":0,"failed":1}],"startedAt":"2023-09-19T13:15:11.806Z","endedAt":"2023-09-19T13:15:31.112Z","duration":15239,"browserName":"chrome","browserVersion":"116.0.5845.187","cypressVersion":"10.8.0"},"mode":"static"}"`;
+exports[`Core Generate HTML report should create HTML report with given reportJsonFilePath 1`] = `"{"report":{"total":6,"totalPassed":3,"totalFailed":3,"totalSuites":3,"suites":[{"name":"image-diff.cy.js","path":"cypress/specs/image-diff.cy.js","tests":[{"status":"fail","name":"image-diff.cy-wholePage","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-wholePage.png","diffPath":"../cypress-visual-screenshots/diff/image-diff.cy-wholePage.png","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-wholePage.png","passed":0,"failed":1},{"status":"pass","name":"image-diff.cy-wholePageThreshold","percentage":0.0900966398590363,"failureThreshold":0.2,"specPath":"cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-wholePageThreshold.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-wholePageThreshold.png","passed":1,"failed":0},{"status":"pass","name":"image-diff.cy-element","percentage":0,"failureThreshold":0,"specPath":"cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-element.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-element.png","passed":1,"failed":0},{"status":"fail","name":"image-diff.cy-hideElement","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"cypress/specs/image-diff.cy.js","specFilename":"image-diff.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/image-diff.cy-hideElement.png","diffPath":"../cypress-visual-screenshots/diff/image-diff.cy-hideElement.png","comparisonPath":"../cypress-visual-screenshots/comparison/image-diff.cy-hideElement.png","passed":0,"failed":1}],"id":"cypress/specs/image-diff.cy.js","passed":2,"failed":2},{"name":"retry.cy.js","path":"cypress/specs/retry.cy.js","tests":[{"status":"pass","name":"retry.cy-retry","percentage":0,"failureThreshold":0,"specPath":"cypress/specs/retry.cy.js","specFilename":"retry.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/retry.cy-retry.png","diffPath":"","comparisonPath":"../cypress-visual-screenshots/comparison/retry.cy-retry.png","passed":1,"failed":0}],"id":"cypress/specs/retry.cy.js","passed":1,"failed":0},{"name":"folder-structure.cy.js","path":"cypress/specs/folder-structure-test/folder-structure.cy.js","tests":[{"status":"fail","name":"folder-structure.cy-wholePage","percentage":0.0900966398590363,"failureThreshold":0,"specPath":"cypress/specs/folder-structure-test/folder-structure.cy.js","specFilename":"folder-structure.cy.js","baselinePath":"../cypress-visual-screenshots/baseline/folder-structure.cy-wholePage.png","diffPath":"../cypress-visual-screenshots/diff/folder-structure.cy-wholePage.png","comparisonPath":"../cypress-visual-screenshots/comparison/folder-structure.cy-wholePage.png","passed":0,"failed":1}],"id":"cypress/specs/folder-structure-test/folder-structure.cy.js","passed":0,"failed":1}],"startedAt":"2023-09-19T13:15:11.806Z","endedAt":"2023-09-19T13:15:31.112Z","duration":15239,"browserName":"chrome","browserVersion":"116.0.5845.187","cypressVersion":"10.8.0"},"mode":"static"}"`;
 
 exports[`Core Start the local server should start local server with given reportJsonFilePath 1`] = `
 {

diff --git a/test/common/__snapshots__/utils.spec.ts.snap b/test/common/__snapshots__/utils.spec.ts.snap
diff --git a/test/common/utils.spec.ts b/test/common/utils.spec.ts
@@ -2,8 +2,8 @@ import mock from 'mock-fs'
 
 import {
   getResolvedConfig,
-  getInputJson,
-  getResolvedInputJson,
+  getReportJson,
+  getResolvedReportJson,
   getReportHtmlAfterPopulatingData
 } from '../../dist/common/utils.js'
 import { Report } from '../../dist/common/types.js'
@@ -52,11 +52,11 @@ describe('Utils', () => {
     })
   })
 
-  describe('getInputJson', () => {
+  describe('getReportJson', () => {
     it('should return input json from given path', async () => {
       let json!: Report
       try {
-        json = await getInputJson(
+        json = await getReportJson(
           'cypress-image-diff-html-report/report_29-10-2023_165108.json'
         )
       } catch {
@@ -87,11 +87,11 @@ describe('Utils', () => {
     })
   })
 
-  describe('getResolvedInputJson', () => {
+  describe('getResolvedReportJson', () => {
     it('should return resolved input json in served mode with default config', async () => {
       let json!: Report
       try {
-        json = await getResolvedInputJson(
+        json = await getResolvedReportJson(
           {
             reportJsonFilePath:
               'cypress-image-diff-html-report/report_29-10-2023_165108.json',
@@ -136,7 +136,7 @@ describe('Utils', () => {
     it('should return resolved input json in served mode with custom config', async () => {
       let json!: Report
       try {
-        json = await getResolvedInputJson(
+        json = await getResolvedReportJson(
           {
             reportJsonFilePath:
               'cypress-image-diff-html-report/report_29-10-2023_165108.json',
@@ -160,7 +160,7 @@ describe('Utils', () => {
         suites: [
           {
             name: 'image-diff.cy.js',
-            path: 'visual-test/cypress/specs/image-diff.cy.js',
+            path: 'cypress/specs/image-diff.cy.js',
             id: 'cypress/specs/image-diff.cy.js',
             passed: 0,
             failed: 0,
@@ -181,7 +181,7 @@ describe('Utils', () => {
     it('should return resolved input json in static mode with default config', async () => {
       let json!: Report
       try {
-        json = await getResolvedInputJson(
+        json = await getResolvedReportJson(
           {
             reportJsonFilePath:
               'cypress-image-diff-html-report/report_29-10-2023_165108.json',
@@ -205,7 +205,7 @@ describe('Utils', () => {
         suites: [
           {
             name: 'image-diff.cy.js',
-            path: '../cypress/specs/image-diff.cy.js',
+            path: 'cypress/specs/image-diff.cy.js',
             id: 'cypress/specs/image-diff.cy.js',
             passed: 0,
             failed: 0,
@@ -226,7 +226,7 @@ describe('Utils', () => {
     it('should return resolved input json in static mode with custom config', async () => {
       let json!: Report
       try {
-        json = await getResolvedInputJson(
+        json = await getResolvedReportJson(
           {
             reportJsonFilePath:
               'cypress-image-diff-html-report/report_29-10-2023_165108.json',
@@ -250,7 +250,7 @@ describe('Utils', () => {
         suites: [
           {
             name: 'image-diff.cy.js',
-            path: '../../visual-test/cypress/specs/image-diff.cy.js',
+            path: 'cypress/specs/image-diff.cy.js',
             id: 'cypress/specs/image-diff.cy.js',
             passed: 0,
             failed: 0,
@@ -271,7 +271,7 @@ describe('Utils', () => {
     it('should return resolved input json in static mode with inlineAssets', async () => {
       let json!: Report
       try {
-        json = await getResolvedInputJson(
+        json = await getResolvedReportJson(
           {
             reportJsonFilePath: 'test.json',
             outputDir: 'my-report/html',