Merge pull request #443 from Cognigy/firefox-tests

Add firefox cypress run
Cognigy · Jul 11, 2024 · 5a7a3d3 · 5a7a3d3
2 parents 3b8eab3 + f7e3ab4
commit 5a7a3d3
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 21 deletions.
diff --git a/.github/workflows/cypress-firefox.yml b/.github/workflows/cypress-firefox.yml
@@ -0,0 +1,15 @@
+name: E2E Firefox
+on: [pull_request]
+jobs:
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+        - uses: actions/checkout@v4
+        - uses: actions/setup-node@v4
+          with:
+              node-version: 20.x
+              cache: "npm"
+        - run: npm ci
+        - run: npm run build
+        - run: npm run test:cypress:firefox
diff --git a/.github/workflows/cypress.yml b/.github/workflows/cypress.yml
@@ -1,20 +1,14 @@
-name: Run Cypress
+name: E2E Chrome
 on: [pull_request]
 jobs:
   test:
     runs-on: ubuntu-latest
 
-    strategy:
-        matrix:
-            node-version: [20.x]
-
     steps:
         - uses: actions/checkout@v4
         - uses: actions/setup-node@v4
           with:
-              node-version: ${{ matrix.node-version }}
+              node-version: 20.x
               cache: "npm"
         - run: npm ci
         - run: npm test
-
-
diff --git a/cypress.config.ts b/cypress.config.ts
@@ -2,14 +2,8 @@ import { defineConfig } from "cypress";
 
 export default defineConfig({
 	video: false,
-	chromeWebSecurity: false,
 	viewportHeight: 800,
 	e2e: {
-		// We've imported your old cypress plugins here.
-		// You may want to clean this up later by importing these.
-		setupNodeEvents(on, config) {
-			return require("./cypress/plugins/index.js")(on, config);
-		},
 		baseUrl: "http://localhost:8787/",
 	},
 });
diff --git a/cypress/e2e/homeScreen.cy.ts b/cypress/e2e/homeScreen.cy.ts
@@ -89,7 +89,8 @@ describe('Home Screen', () => {
             }
         });
         cy.openWebchat();
-        cy.get('.webchat-homescreen-content').should('have.css', 'background', 'none repeat scroll 50% 50% / cover padding-box border-box, rgba(0, 0, 0, 0) radial-gradient(204.5% 136.79% at 0.53% 95.79%, rgb(237, 236, 249) 0%, rgb(191, 186, 255) 31.77%, rgb(33, 82, 227) 65.63%, rgb(5, 48, 158) 100%) repeat scroll 50% 50% / cover padding-box border-box');   
+        cy.get('.webchat-homescreen-content')
+            .should('have.css', 'background-image', 'none, radial-gradient(204.5% 136.79% at 0.53% 95.79%, rgb(237, 236, 249) 0%, rgb(191, 186, 255) 31.77%, rgb(33, 82, 227) 65.63%, rgb(5, 48, 158) 100%)');   
     });
 
     it('has specified background gradient when configured', () => {
@@ -105,7 +106,7 @@ describe('Home Screen', () => {
             }
         });
         cy.openWebchat();
-        cy.get('.webchat-homescreen-content').should('have.css', 'background', 'none repeat scroll 50% 50% / cover padding-box border-box, rgba(0, 0, 0, 0) linear-gradient(to right, rgb(255, 0, 0), rgb(0, 0, 255)) repeat scroll 50% 50% / cover padding-box border-box');   
+        cy.get('.webchat-homescreen-content').should('have.css', 'background-image', 'none, linear-gradient(to right, rgb(255, 0, 0), rgb(0, 0, 255))');   
     });
 
     it('has the specified background color when configured', () => {

diff --git a/cypress/e2e/message-colors.cy.ts b/cypress/e2e/message-colors.cy.ts
@@ -19,7 +19,7 @@ describe('Message Color Variants', () => {
         it('renders a "text with buttons"', () => {
             cy.receiveMessageFixture('buttons');
 
-            cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'background', 'rgb(255, 255, 255) none repeat scroll 0% 0% / auto padding-box border-box');
+            cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'background-color', 'rgb(255, 255, 255)');
             cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'color', 'rgb(28, 28, 28)');
         });
 
@@ -95,7 +95,7 @@ describe('Message Color Variants', () => {
         it('renders a "text with buttons"', () => {
             cy.receiveMessageFixture('buttons');
 
-            cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'background', 'rgb(232, 235, 255) none repeat scroll 0% 0% / auto padding-box border-box');
+            cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'background-color', 'rgb(232, 235, 255)');
             cy.get('.webchat-buttons-template-root .chat-bubble').should('have.css', 'color', 'rgba(26, 26, 26, 0.95)');
         });
 
@@ -106,7 +106,7 @@ describe('Message Color Variants', () => {
                 cy.receiveMessage(text, data, source);
 
                 cy.get('.webchat-quick-reply-template-root .chat-bubble')
-                    .should('have.css', 'background', 'rgb(232, 235, 255) none repeat scroll 0% 0% / auto padding-box border-box');
+                    .should('have.css', 'background-color', 'rgb(232, 235, 255)');
             });
         });
 

diff --git a/cypress/e2e/sourceColorMapping.cy.ts b/cypress/e2e/sourceColorMapping.cy.ts
@@ -21,15 +21,15 @@ describe('Source Color Mapping', () => {
 
         cy.receiveMessage('bot message', {}, 'bot');
 
-        cy.get('.webchat-message-row.bot .chat-bubble').should('have.css', 'background', 'rgb(255, 255, 255) none repeat scroll 0% 0% / auto padding-box border-box');
+        cy.get('.webchat-message-row.bot .chat-bubble').should('have.css', 'background-color', 'rgb(255, 255, 255)');
     });
 
     it('should render agent messages as "neutral" by default', () => {
         cy.visitWebchat().initMockWebchat().openWebchat().startConversation();
 
         cy.receiveMessage('agent message', {}, 'agent');
 
-        cy.get('.webchat-message-row.agent .chat-bubble').should('have.css', 'background', 'rgb(255, 255, 255) none repeat scroll 0% 0% / auto padding-box border-box');
+        cy.get('.webchat-message-row.agent .chat-bubble').should('have.css', 'background-color', 'rgb(255, 255, 255)');
     });
 
     it('should render user messages as "neutral" if configures in sourceColorMapping', () => {

diff --git a/package.json b/package.json
@@ -13,9 +13,12 @@
 		"update-license": "node update-license.js",
 		"dev": "webpack-dev-server --config webpack.dev.js --host 0.0.0.0",
 		"cypress:open": "cypress open --e2e --browser chrome",
+		"cypress:open:firefox": "cypress open --e2e --browser firefox",
 		"cypress:serve": "http-server -a localhost -p 8787 dist/",
 		"cypress:run": "cypress run",
+		"cypress:run:firefox": "cypress run --browser firefox",
 		"test:cypress": "run-p -r cypress:serve cypress:run",
+		"test:cypress:firefox": "run-p -r cypress:serve cypress:run:firefox",
 		"test": "npm run test:cypress",
 		"pretest": "npm run build",
 		"prettier:check": "prettier --check --config .prettierrc.json src/",