chore(detector): show number of test cases

Author: marabesi

detector/package.json

@@ -36,7 +36,7 @@
     "ts-node": "^10.9.2"
   },
   "scripts": {
-    "compile": "rm -rf build/ types && tsc && cp -R ./src/reporters/layout ./build/src/reporters/",
+    "compile": "rm -rf build/ types/ && tsc && cp -R ./src/reporters/ ./build/src/reporters/",
     "watch": "webpack --watch",
     "clean": "rm -rf out/ dist/ types/",
     "compile-tests": "npm run clean && tsc -p . --outDir out",

detector/src/reporters/SmellsAgreggator.ts

@@ -17,6 +17,7 @@ export class SmellsAggreagtor implements AgreggatorSmellls {
         totalSmells,
         data: this.totalTestFiles,
         averageSmellsPerTestFile: totalSmells / totalFiles,
+        totalTestCases: 0,
       }, this.exportOptions);
     } catch (err) {
       console.log(err);

detector/src/reporters/layout/example.html

@@ -54,6 +54,12 @@ <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white"
       <div
         class="mb-5 max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700">
 
+        <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" data-testid="total-test-cases">{{ totalTestCases }}</h5>
+        <p class="font-normal text-gray-700 dark:text-gray-400" data-testid="title-test-cases">Test cases</p>
+      </div>
+      <div
+        class="mb-5 max-w-sm p-6 bg-white border border-gray-200 rounded-lg shadow hover:bg-gray-100 dark:bg-gray-800 dark:border-gray-700">
+    
         <h5 class="mb-2 text-2xl font-bold tracking-tight text-gray-900 dark:text-white" data-testid="total-test-files">{{ data.length }}</h5>
         <p class="font-normal text-gray-700 dark:text-gray-400" data-testid="title-test-files">Test files</p>
       </div>

detector/src/reporters/types.ts

@@ -15,6 +15,7 @@ export interface AggregatedData {
   data: SmellsList[],
   totalSmells: number,
   averageSmellsPerTestFile: number,
+  totalTestCases: number,
 }
 
 export interface ExportOptions {

detector/test/html-report-builder.ts

@@ -4,7 +4,12 @@ import { readFileSync } from 'fs';
 
 export async function buildEmptyHtmlReportForTestSmells(exportsOptions: ExportOptions, filePath: string) {
   const smellsFound: SmellsList[] = [];
-  const aggregatedData: AggregatedData = { data: smellsFound, totalSmells: 0, averageSmellsPerTestFile: 0 };
+  const aggregatedData: AggregatedData = {
+    data: smellsFound,
+    totalSmells: 0,
+    averageSmellsPerTestFile: 0,
+    totalTestCases: 0,
+  };
 
   const reporter = new HtmlOutput();
   await reporter.writeTo(aggregatedData, exportsOptions);

detector/test/html-report.integration.test.ts

@@ -49,6 +49,14 @@ describe('html report', () => {
       expect(root.querySelector('[data-testid="total-test-files"]')?.textContent).toEqual('0');
       expect(root.querySelector('[data-testid="title-test-files"]')?.textContent).toEqual('Test files');
     });
+
+    test('renders the number of test cases', async () => {
+      const generatedHtml = await buildEmptyHtmlReportForTestSmells(exportsOptions, filePath);
+      const root = parse(generatedHtml);
+  
+      expect(root.querySelector('[data-testid="total-test-cases"]')?.textContent).toEqual('0');
+      expect(root.querySelector('[data-testid="title-test-cases"]')?.textContent).toEqual('Test cases');
+    });
   });
 
   describe('when there are test smells', () => {