Adding cypresstests

.github/workflows/cypress-tests.yml

@@ -1,6 +1,6 @@
 name: Run Cypress Tests
 on:
-  push:
+  pull_request:
     branches:
       - main
 

.github/workflows/deployment.yml

@@ -1,17 +1,15 @@
 name: Build-and-Deploy
 
 on:
-  workflow_run:
-    workflows: ["Run Cypress Tests"]
-    types:
-      - completed
+  push:
+    branches:
+      - main
 
 permissions:
   contents: write
 
 jobs:
   build-deploy:
-    if: ${{ github.event.workflow_run.conclusion == 'success' }}
     runs-on: ubuntu-latest
 
     steps:

cypress/e2e/auto-detection.cy.js

@@ -11,8 +11,7 @@ describe("Auto Detection of Language", () => {
       testCases.forEach(({ text, expectedLanguage }) => {
         // Step 1: Enter text into the textarea
         cy.get('textarea[placeholder="Enter text"]').clear().type(text);
-
-        cy.wait(3000);
+        cy.wait(4000)
         // Step 2: Verify the detected language
         cy.get('[data-testid="detected-language"]')
           .invoke("text")

cypress/e2e/responsiveness.cy.js

@@ -0,0 +1,21 @@
+describe("Responsiveness for different devices", () => {
+  Cypress.on("uncaught:exception", (err, runnable) => {
+    return false; // Prevent Cypress from failing the test
+  });
+
+  it("Checking for responsiveness", () => {
+    // Visit homepage
+    cy.visit("/");
+
+    cy.fixture("screens").then((screens) => {
+      Object.values(screens).map((value) => {
+        cy.log("screen", value);
+        cy.viewport(value.viewportWidth, value.viewportHeight);
+        cy.get('textarea[placeholder="Enter text"]').clear().type("I am happy");
+        cy.wait(6000);
+        //cy.scrollTo("bottom", { duration: 30000 });
+        //cy.scrollTo("top", { duration: 30000 });
+      });
+    });
+  });
+});

cypress/fixtures/screens.json

@@ -0,0 +1,79 @@
+{
+    "iphoneX": {
+        "viewportWidth": 375,
+        "viewportHeight": 812
+      },
+      "s10": {
+        "viewportWidth": 360,
+        "viewportHeight": 760
+      },
+    "twentyFourInch": {
+      "viewportWidth": 1920,
+      "viewportHeight": 1200
+    },
+    "twentyThreeInch": {
+      "viewportWidth": 1920,
+      "viewportHeight": 1088
+    },
+    "twentyTwoInch": {
+      "viewportWidth": 1688,
+      "viewportHeight": 1050
+    },
+    "twentyInch": {
+      "viewportWidth": 1600,
+      "viewportHeight": 900
+    },
+    "nineteenInch": {
+      "viewportWidth": 1440,
+      "viewportHeight": 900
+    },
+    "fifteenInch": {
+        "viewportWidth": 1366,
+        "viewportHeight": 768
+      },
+      "thirteenInch": {
+        "viewportWidth": 1024,
+        "viewportHeight": 800
+      },
+      "tenInch": {
+        "viewportWidth": 1024,
+        "viewportHeight": 600
+      },
+
+    "iphone4": {
+      "viewportWidth": 320,
+      "viewportHeight": 480
+    },
+    "iphone5": {
+      "viewportWidth": 320,
+      "viewportHeight": 568
+    },
+    "iphone6plus": {
+      "viewportWidth": 414,
+      "viewportHeight": 736
+    },
+    "iphone7": {
+      "viewportWidth": 375,
+      "viewportHeight": 667
+    },
+    "iphonex": {
+      "viewportWidth": 375,
+      "viewportHeight": 812
+    },
+    "iphonexr": {
+      "viewportWidth": 414,
+      "viewportHeight": 896
+    },
+    "iphonese2": {
+      "viewportWidth": 375,
+      "viewportHeight": 667
+    },
+    "samsungs10": {
+      "viewportWidth": 368,
+      "viewportHeight": 768
+    },
+    "samsungs5": {
+      "viewportWidth": 360,
+      "viewportHeight": 648
+    }
+}