From 6b76213128b9c99aab398a0368b0021b60a85851 Mon Sep 17 00:00:00 2001
From: Alejandro Alonso <alejandroalonsofernandez@gmail.com>
Date: Thu, 9 May 2024 13:17:12 +0200
Subject: [PATCH] :sparkles: Frontend integration tests

---
 .circleci/config.yml                              | 10 ++++++++++
 frontend/playwright.config.js                     |  9 +++++----
 frontend/playwright/ui/pages/BaseWebSocketPage.js |  2 +-
 frontend/scripts/e2e-server.js                    |  2 +-
 4 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/.circleci/config.yml b/.circleci/config.yml
index 18d7cf5d7..52ec3b79e 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -102,6 +102,16 @@ jobs:
             yarn install
             yarn test
 
+      - run:
+          name: "frontend integration tests"
+          working_directory: "./frontend"
+          command: |
+            yarn install
+            yarn run compile
+            clojure -M:dev:shadow-cljs compile main
+            yarn playwright install --with-deps chromium
+            yarn e2e:test
+
       - run:
           name: "backend tests"
           working_directory: "./backend"
diff --git a/frontend/playwright.config.js b/frontend/playwright.config.js
index 08a372946..4c8b68424 100644
--- a/frontend/playwright.config.js
+++ b/frontend/playwright.config.js
@@ -18,18 +18,18 @@ export default defineConfig({
   /* Retry on CI only */
   retries: process.env.CI ? 2 : 0,
   /* Opt out of parallel tests on CI. */
-  workers: process.env.CI ? 1 : undefined,
+  workers: process.env.CI ? 4 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
   reporter: "html",
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: "http://0.0.0.0:3500",
+    baseURL: "http://localhost:3000",
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
     trace: "on-first-retry",
 
-    locale: "en-US"
+    locale: "en-US",
   },
 
   /* Configure projects for major browsers */
@@ -42,8 +42,9 @@ export default defineConfig({
 
   /* Run your local dev server before starting the tests */
   webServer: {
+    timeout: 2 * 60 * 1000,
     command: "yarn e2e:server",
-    url: "http://0.0.0.0:3500",
+    url: "http://localhost:3000",
     reuseExistingServer: !process.env.CI,
   },
 });
diff --git a/frontend/playwright/ui/pages/BaseWebSocketPage.js b/frontend/playwright/ui/pages/BaseWebSocketPage.js
index 85700e048..e382cd7b0 100644
--- a/frontend/playwright/ui/pages/BaseWebSocketPage.js
+++ b/frontend/playwright/ui/pages/BaseWebSocketPage.js
@@ -27,6 +27,6 @@ export class BaseWebSocketPage extends BasePage {
    * @returns {Promise<MockWebSocketHelper>}
    */
   async waitForNotificationsWebSocket() {
-    return this.waitForWebSocket("ws://0.0.0.0:3500/ws/notifications");
+    return this.waitForWebSocket("ws://localhost:3000/ws/notifications");
   }
 }
diff --git a/frontend/scripts/e2e-server.js b/frontend/scripts/e2e-server.js
index cebddcdd3..4c441d21c 100644
--- a/frontend/scripts/e2e-server.js
+++ b/frontend/scripts/e2e-server.js
@@ -3,7 +3,7 @@ import { fileURLToPath } from "url";
 import path from "path";
 
 const app = express();
-const port = 3500;
+const port = 3000;
 
 const staticPath = path.join(fileURLToPath(import.meta.url), "../../resources/public");
 app.use(express.static(staticPath));