Improved E2E TCs for sorting

sadanandpai · Oct 5, 2023 · 19af617 · 19af617
1 parent 4f5b6bb
commit 19af617
Show file tree

Hide file tree

Showing 4 changed files with 60 additions and 47 deletions.
diff --git a/cypress.config.ts b/cypress.config.ts
@@ -1,6 +1,7 @@
 import { defineConfig } from 'cypress';
 
 export default defineConfig({
+  defaultCommandTimeout: 50000,
   e2e: {
     baseUrl: 'http://localhost:5173',
     setupNodeEvents(on, config) {

diff --git a/cypress/e2e/home.cy.ts b/cypress/e2e/home.cy.ts
@@ -1,8 +1,3 @@
-const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
-  window.HTMLInputElement.prototype,
-  'value'
-).set;
-
 describe('template spec', () => {
   beforeEach(() => {
     cy.visit('/');

diff --git a/cypress/e2e/sorting.cy.ts b/cypress/e2e/sorting.cy.ts
@@ -1,16 +1,37 @@
+import { getRndmNumInRange } from '../../src/apps/sorting-visualizer/helpers/array-helpers';
+import { initialArray } from '../../src/apps/sorting-visualizer/config';
+
+const algorithms = [
+  'bubble',
+  'selection',
+  'insertion',
+  'heap',
+  'merge',
+  'quick',
+  'shell',
+  'cocktail',
+];
+
 const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
   window.HTMLInputElement.prototype,
   'value'
-).set;
+)?.set;
 
-function verifySorting() {
-  cy.get('#user-input').should('contain.value', '6, 8, 3, 5, 1, 9, 2, 7, 4');
-  cy.get('#user-input').type('{selectAll} 6, 8, 3, 5, 9, 2, 7');
+function setTheInput(inputArray: number[]) {
+  const inputArrayString = inputArray.join(', ');
+  cy.get('#user-input').type(`{selectAll} ${inputArrayString}`);
+
+  return {
+    inputArrayText: inputArray.join(''),
+    inputArrayTextSorted: inputArray.sort((a, b) => a - b).join(''),
+  };
+}
 
-  cy.get('[data-testid="cell-values"]').should('contain.text', '6835927');
+function verifySorting(inputArrayText: string, inputArrayTextSorted: string) {
+  cy.get('[data-testid="cell-values"]').should('contain.text', inputArrayText);
   cy.get('#speed').then(($range) => {
     const range = $range[0];
-    nativeInputValueSetter.call(range, 20);
+    nativeInputValueSetter?.call(range, 20);
     range.dispatchEvent(
       new Event('change', { value: 20, bubbles: true } as EventInit)
     );
@@ -20,51 +41,45 @@ function verifySorting() {
   player.click();
 
   player.should('be.disabled');
-  cy.get('[data-testid="cell-values"]').should('contain.text', '2356789');
+  cy.get('[data-testid="cell-values"]').should(
+    'contain.text',
+    inputArrayTextSorted
+  );
 }
 
-describe('template spec', () => {
+describe('sorting', () => {
   beforeEach(() => {
     cy.visit('/');
   });
 
-  it('should verify bubble sort', () => {
-    cy.get('a').contains('bubble').click();
-    verifySorting();
-  });
-
-  it('should verify selection sort', () => {
-    cy.get('a').contains('selection').click();
-    verifySorting();
-  });
+  it('should verify sorting for known array', () => {
+    const { inputArrayText, inputArrayTextSorted } = setTheInput(initialArray);
 
-  it('should verify insertion sort', () => {
-    cy.get('a').contains('insertion').click();
-    verifySorting();
+    for (const algo of algorithms) {
+      cy.get('a').contains(algo).click();
+      verifySorting(inputArrayText, inputArrayTextSorted);
+    }
   });
 
-  it('should verify heap sort', () => {
-    cy.get('a').contains('heap').click();
-    verifySorting();
-  });
-
-  it('should verify merge sort', () => {
-    cy.get('a').contains('merge').click();
-    verifySorting();
-  });
+  it('should verify sorting for random small array', () => {
+    const { inputArrayText, inputArrayTextSorted } = setTheInput(
+      Array.from(new Array(10), () => getRndmNumInRange())
+    );
 
-  it('should verify quick sort', () => {
-    cy.get('a').contains('quick').click();
-    verifySorting();
+    for (const algo of algorithms) {
+      cy.get('a').contains(algo).click();
+      verifySorting(inputArrayText, inputArrayTextSorted);
+    }
   });
 
-  it('should verify shell sort', () => {
-    cy.get('a').contains('shell').click();
-    verifySorting();
-  });
+  it('should verify sorting for random large array', () => {
+    const { inputArrayText, inputArrayTextSorted } = setTheInput(
+      Array.from(new Array(25), () => getRndmNumInRange())
+    );
 
-  it('should verify cocktail sort', () => {
-    cy.get('a').contains('cocktail').click();
-    verifySorting();
+    for (const algo of algorithms) {
+      cy.get('a').contains(algo).click();
+      verifySorting(inputArrayText, inputArrayTextSorted);
+    }
   });
 });
diff --git a/cypress/tsconfig.json b/cypress/tsconfig.json
@@ -1,11 +1,13 @@
 {
   "compilerOptions": {
-    "baseUrl": "http://localhost:5173",
+    "baseUrl": ".",
     "target": "ES2015",
     "lib": ["ES2015", "dom"],
     "types": ["cypress", "node"],
-    "moduleResolution": "NodeNext",
-    "module": "NodeNext",
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
     "paths": {
       "@/*": ["../src/*"]
     }