Merge pull request #59 from SafeExamBrowser/tests-e2e

Tests e2e

Author: Rad14nt

.github/workflows/auto-test-deploy.yml

@@ -6,6 +6,28 @@ on:
       - "auto-testing-deploy"
 
 jobs:
+
+  shai-hulud-detector:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout seb-server-gui repo
+        uses: actions/checkout@v6
+        with:
+          path: seb
+          clean: false
+      - name: Checkout Cobenian/shai-hulud-detect
+        uses: actions/checkout@v6
+        with:
+          repository: Cobenian/shai-hulud-detect
+          path: hulud
+          clean: false
+      - # Pipeline will automatically fail on exit codes 1 or 2
+        name: Security Scan with Shai-Hulud Detector
+        run: |
+          chmod +x ./hulud/shai-hulud-detector.sh
+          ./hulud/shai-hulud-detector.sh ./seb
+
+
   build-and-push-admin-auto-test:
     runs-on: ubuntu-latest
     strategy:
@@ -69,6 +91,36 @@ jobs:
         uses: docker/build-push-action@v6.17.0
         with:
           context: .
-          file: ./Dockerfile.storybook
+          file: ./client/Dockerfile.storybook
+          push: true
+          tags: docker.io/${{ secrets.DOCKERHUB_ADMIN_USERNAME }}/seb-server-gui-storybook:${{ env.TAG_NAME }}
+
+  build-and-push-e2e-runner:
+    runs-on: ubuntu-latest
+    needs: build-and-push-admin-auto-test
+
+    steps:
+      - name: Set env for dynamic tag
+        if: github.event_name == 'push' && startsWith(github.ref, 'refs/tags/')
+        run: echo "TAG_NAME=${GITHUB_REF#refs/*/}" >> $GITHUB_ENV
+
+      - name: Set env manual
+        if: github.event_name == 'workflow_dispatch'
+        run: echo "TAG_NAME=default_version" >> $GITHUB_ENV
+
+      - name: Checkout code
+        uses: actions/checkout@v4.2.2
+
+      - name: Login to DockerHub
+        uses: docker/login-action@v3.4.0
+        with:
+          username: ${{ secrets.DOCKERHUB_ADMIN_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_ADMIN_TOKEN }}
+
+      - name: Build and push E2E runner image
+        uses: docker/build-push-action@v6.17.0
+        with:
+          context: .
+          file: ./client/Dockerfile.e2e
           push: true
-          tags: docker.io/${{ secrets.DOCKERHUB_ADMIN_USERNAME }}/storybook:${{ env.TAG_NAME }}
+          tags: docker.io/${{ secrets.DOCKERHUB_ADMIN_USERNAME }}/seb-server-gui-e2e-runner:${{ env.TAG_NAME }}

Dockerfile.storybook

@@ -1,24 +1,28 @@
 import type { StorybookConfig } from "@storybook/vue3-vite";
+import { mergeConfig } from "vite";
 
 const config: StorybookConfig = {
     framework: {
         name: "@storybook/vue3-vite",
         options: {},
     },
-    stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
+    stories: [
+        "../tests/stories/**/*.mdx",
+        "../tests/stories/**/*.stories.@(js|jsx|mjs|ts|tsx)",
+    ],
     addons: [
         "@chromatic-com/storybook",
         "@storybook/addon-docs",
         "@storybook/addon-onboarding",
         "@storybook/addon-a11y",
     ],
-
     core: {
         builder: "@storybook/builder-vite",
     },
-
-    async viteFinal(config) {
-        return config;
+    async viteFinal(cfg) {
+        return mergeConfig(cfg, {
+            base: "",
+        });
     },
 };
 

client/.storybook/main.ts

@@ -8,5 +8,5 @@
         "skipLibCheck": true,
         "jsx": "preserve"
     },
-    "include": ["./**/*", "../src/**/*"]
+    "include": ["./**/*", "../src/**/*", "../tests/stories/**/*"]
 }

client/.storybook/tsconfig.json

@@ -0,0 +1,24 @@
+# Choose a pinned version that matches your @playwright/test version as closely as possible
+FROM mcr.microsoft.com/playwright:v1.56.1-jammy
+
+WORKDIR /work
+
+# Copy only what the runner needs (keeps image smaller + build faster)
+COPY client/package.json client/package-lock.json* client/pnpm-lock.yaml* client/yarn.lock* ./client/
+COPY client/playwright.config.ts ./client/
+COPY client/tsconfig.playwright.json ./client/
+COPY client/tests/e2e ./client/tests/e2e
+
+# Install deps
+WORKDIR /work/client
+# If you use npm:
+RUN npm ci
+
+# If your project uses pnpm or yarn, swap accordingly.
+
+# Default output locations (we’ll also set these in playwright.config.ts)
+ENV PLAYWRIGHT_BROWSERS_PATH=/ms-playwright
+ENV NODE_ENV=production
+
+# Entrypoint runs the tests
+CMD ["npx", "playwright", "test"]

client/Dockerfile.e2e

@@ -0,0 +1,13 @@
+FROM node:20-alpine AS build
+WORKDIR /app/client
+
+COPY client/package.json client/package-lock.json ./
+RUN npm ci
+
+COPY client/ ./
+
+RUN npm run build-storybook
+
+FROM nginx:alpine
+COPY --from=build /app/client/storybook-static/ /usr/share/nginx/html/
+EXPOSE 80

client/Dockerfile.storybook

@@ -25,8 +25,9 @@
         "test:e2e": "npx playwright test",
         "test:e2eui": "npx playwright test --ui",
         "test:e2e:headed": "npx playwright test --headed",
+        "test:e2e:interactive": "npx playwright codegen http://localhost:8082",
         "test:e2e:chromium": "npx playwright test --project=chromium --headed",
-        "build-storybook": "storybook build"
+        "build-storybook": "storybook build --disable-telemetry"
     },
     "lint-staged": {
         "*.{vue,js,jsx,ts,tsx}": [
@@ -71,7 +72,7 @@
         "@testing-library/dom": "^10.4.1",
         "@testing-library/vue": "^8.1.0",
         "@types/luxon": "^3.4.2",
-        "@types/node": "^20.19.24",
+        "@types/node": "^20.19.27",
         "@types/webfontloader": "^1.6.38",
         "@vitejs/plugin-vue": "^5.2.4",
         "@vitest/browser-playwright": "^4.0.8",

client/package.json

@@ -1,22 +1,38 @@
 import { defineConfig, devices } from "@playwright/test";
 
+const isCI = !!process.env.CI;
+
+const baseURL = process.env.BASE_URL || "https://ralphina.ethz.ch";
+
+const ignoreHTTPSErrors = process.env.E2E_IGNORE_HTTPS_ERRORS === "true";
+
+const outputDir = process.env.E2E_OUTPUT_DIR || "test-results";
+const reportDir = process.env.E2E_REPORT_DIR || "playwright-report";
+
+const reporters = isCI
+    ? [["line"], ["html", { outputFolder: reportDir, open: "never" }]]
+    : [["html", { outputFolder: reportDir, open: "never" }]];
+
 export default defineConfig({
     testDir: "tests/e2e",
-    fullyParallel: false,
-    forbidOnly: !!process.env.CI,
-    retries: process.env.CI ? 2 : 0,
-    workers: process.env.CI ? 1 : undefined,
-    reporter: process.env.CI ? "line" : "html",
+    fullyParallel: true,
+    forbidOnly: isCI,
+    retries: isCI ? 2 : 0,
+    workers: isCI ? 1 : undefined,
+
+    reporter: reporters,
+
+    outputDir,
+
     use: {
-        baseURL: process.env.BASE_URL || "http://localhost:8082",
-        trace: "on-first-retry",
-        launchOptions: {
-            slowMo: 500,
-        },
+        baseURL,
+        trace: "on",
+        ignoreHTTPSErrors,
         contextOptions: {
             javaScriptEnabled: true,
         },
     },
+
     projects: [
         { name: "chromium", use: { ...devices["Desktop Chrome"] } },
         { name: "firefox", use: { ...devices["Desktop Firefox"] } },

client/playwright.config.ts

@@ -1,7 +1,6 @@
 <template>
     <v-app>
         <ErrorMsg></ErrorMsg>
-
         <loading
             :active="loadingStore.isLoading"
             color="#215CAF"