E2E TCs completion for Path finder

sadanandpai · Mar 30, 2024 · 86e237b · 86e237b
1 parent 9783f17
commit 86e237b
Show file tree

Hide file tree

Showing 5 changed files with 73 additions and 70 deletions.
diff --git a/cypress.config.ts b/cypress.config.ts
@@ -1,6 +1,8 @@
 import { defineConfig } from 'cypress';
 
 export default defineConfig({
+  viewportWidth: 1024,
+  viewportHeight: 800,
   defaultCommandTimeout: 50000,
   e2e: {
     baseUrl: 'http://localhost:5173',

diff --git a/cypress/e2e/path-finder/home.cy.ts b/cypress/e2e/path-finder/home.cy.ts
@@ -1,39 +1,23 @@
-const mazes = [
-  'Prims',
-  'Kruskal',
-  'Recursive Backtracking',
-  'Recursive Division',
-  'Wilson',
-  'Binary',
-  'Ellers',
-  'Side Winder',
-  'Labyrinth',
-];
-
-const pathFinders = [
-  'Breadth First Search',
-  'Depth First Search',
-  'A* Search',
-  'Greedy Best First',
-];
+import { mazes, pathFinders } from 'utils/path';
 
 describe('path finder', () => {
   beforeEach(() => {
     cy.visit('/#/path-finder');
-    cy.viewport(1440, 900);
+  });
+
+  it('should verify page header', () => {
+    cy.get('[data-testid="navbar"]').should('contain.html', 'Path Finder');
   });
 
   it('should verify the maze dropdowns', () => {
     cy.get('#maze').should('contain.text', 'Select a Maze');
-
     for (const maze of mazes) {
       cy.get('#maze').should('contain.text', maze);
     }
   });
 
   it('should verify the path finder dropdowns', () => {
     cy.get('#path-finder').should('contain.text', 'Select a Path finder');
-
     for (const pathFinder of pathFinders) {
       cy.get('#path-finder').should('contain.text', pathFinder);
     }

diff --git a/cypress/e2e/path-finder/maze.cy.ts b/cypress/e2e/path-finder/maze.cy.ts
@@ -1,21 +1,39 @@
+import { mazes, pathFinders } from 'utils/path';
+
 function verifyMaze() {
-  cy.get('[data-testid="generate-maze"]').click();
   cy.get('[data-testid="generate-maze"]').should('be.enabled');
+  cy.get('[data-cell-type="1"]').should('have.length', 1);
+  cy.get('[data-cell-type="2"]').should('have.length', 1);
+  cy.get('[data-cell-type="3"]').should('have.length', 432);
+  cy.get('[data-cell-type="0"]').should('have.length', 491);
+}
 
+function verifyPath() {
+  cy.get('[data-testid="generate-maze"]').should('be.enabled');
   cy.get('[data-cell-type="1"]').should('have.length', 1);
   cy.get('[data-cell-type="2"]').should('have.length', 1);
-  cy.get('[data-cell-type="0"]').should('have.length', 807);
-  cy.get('[data-cell-type="3"]').should('have.length', 728);
+  cy.get('[data-cell-type="3"]').should('have.length', 432);
+  cy.get('[data-cell-type="5"]').should('have.length.greaterThan', 50);
+}
+
+function verifyInfo() {
+  const visits = cy.get('[data-testid="visits"]');
+  const path = cy.get('[data-testid="path"]');
+  const time = cy.get('[data-testid="time"]');
+
+  visits.invoke('text').then(parseInt).should('be.greaterThan', 40);
+  path.invoke('text').then(parseInt).should('be.greaterThan', 40);
+  time.invoke('text').then(parseInt).should('be.greaterThan', 5);
 }
 
 describe('path finder', () => {
   beforeEach(() => {
     cy.visit('/#/path-finder');
-    cy.viewport(1440, 900);
 
     const generateMaze = cy.get('[data-testid="generate-maze"]');
     generateMaze.should('be.visible');
     generateMaze.should('be.disabled');
+    cy.get('#maze').should('contain.text', 'Select a Maze');
   });
 
   it('should verify the grid', () => {
@@ -24,58 +42,30 @@ describe('path finder', () => {
   });
 
   it('should verify the prims maze generation', () => {
-    cy.get('#maze').select('Prims');
-    verifyMaze();
-  });
-
-  it('should verify the kruskal maze generation', () => {
-    cy.get('#maze').select('Kruskal');
-    verifyMaze();
-  });
-
-  it('should verify the recursive backtracking maze generation', () => {
-    cy.get('#maze').select('Recursive Backtracking');
-    verifyMaze();
-  });
-
-  it('should verify the recursive division maze generation', () => {
-    cy.get('#maze').select('Recursive Division');
-    verifyMaze();
-  });
-
-  it('should verify the wilson maze generation', () => {
-    cy.get('#maze').select('Wilson');
-    verifyMaze();
-  });
-
-  it('should verify the binary maze generation', () => {
-    cy.get('#maze').select('Binary');
-    verifyMaze();
-  });
-
-  it('should verify the ellers maze generation', () => {
-    cy.get('#maze').select('Ellers');
-    verifyMaze();
-  });
+    for (const maze of mazes) {
+      cy.get('#maze').select(maze);
+      verifyMaze();
 
-  it('should verify the side winder maze generation', () => {
-    cy.get('#maze').select('Side Winder');
-    verifyMaze();
-  });
-
-  it('should verify the labyrinth maze generation', () => {
-    cy.get('#maze').select('Labyrinth');
-    verifyMaze();
+      for (const pathFinder of pathFinders) {
+        cy.get('#path-finder').select(pathFinder);
+        verifyPath();
+        verifyInfo();
+      }
+    }
   });
 
   it('should verify the random maze generation', () => {
     cy.get('#maze').select('Random');
-    cy.get('[data-testid="generate-maze"]').click();
     cy.get('[data-testid="generate-maze"]').should('be.enabled');
 
     cy.get('[data-cell-type="1"]').should('have.length', 1);
     cy.get('[data-cell-type="2"]').should('have.length', 1);
     cy.get('[data-cell-type="0"]').should('have.length.greaterThan', 500);
     cy.get('[data-cell-type="3"]').should('have.length.greaterThan', 100);
+
+    for (const pathFinder of pathFinders) {
+      cy.get('#path-finder').select(pathFinder);
+      cy.get('[data-cell-type="3"]').should('have.length.greaterThan', 100);
+    }
   });
 });
diff --git a/cypress/utils/path.ts b/cypress/utils/path.ts
@@ -0,0 +1,18 @@
+export const mazes = [
+  'Prims',
+  'Kruskal',
+  'Recursive Backtracking',
+  'Recursive Division',
+  'Wilson',
+  'Binary',
+  'Ellers',
+  'Side Winder',
+  'Labyrinth',
+];
+
+export const pathFinders = [
+  'Breadth First Search',
+  'Depth First Search',
+  'A* Search',
+  'Greedy Best First',
+];
diff --git a/src/apps/path-finder/components/controller/path-info.tsx b/src/apps/path-finder/components/controller/path-info.tsx
@@ -38,13 +38,22 @@ function PathInfo() {
   return (
     <div className={classes.pathInfo}>
       <p>
-        Visits: <span className={classes.highlight}>{visitedCellCount}</span>
+        Visits:{' '}
+        <span className={classes.highlight} data-testid="visits">
+          {visitedCellCount}
+        </span>
       </p>
       <p>
-        Path: <span className={classes.highlight}>{pathLength}</span>
+        Path:{' '}
+        <span className={classes.highlight} data-testid="path">
+          {pathLength}
+        </span>
       </p>
       <p>
-        Time: <span className={classes.highlight}>{time}</span>
+        Time:{' '}
+        <span className={classes.highlight} data-testid="time">
+          {time}
+        </span>
       </p>
     </div>
   );