Configure CI workflow for Playwright tests

.github/workflows/playwright-tests.yaml

@@ -1,4 +1,4 @@
-# CI configuration for Playwright
+# CI configuration for Playwright with Python and Qualibrate setup
 name: Playwright Tests
 
 on:
@@ -19,18 +19,39 @@ jobs:
     - name: Checkout repository
       uses: actions/checkout@v3
 
+    - name: Install Python and Create Environment
+      uses: actions/setup-python@v4
+      with:
+        python-version: '3.10'
+
+    - name: Install dependencies
+      run: |
+        python -m venv .venv
+        source .venv/bin/activate
+        pip install --upgrade pip
+        pip install qualibrate             # Install Qualibrate package
+        pip install quam                   # Install Quam package
+        # pip install quam_libs            # Install Quam libraries
+        # pip install quam_libs.components # Install Quam components
+
+    - name: Create Qualibrate Configuration
+      run: |
+        source .venv/bin/activate
+        # qualibrate config --create       
+        yes | qualibrate config            # Create the Qualibrate configuration file
+
+
     - name: Install Node.js
       uses: actions/setup-node@v3
       with:
         node-version: '18'
 
-    - name: Install dependencies
-      run: npm ci
-
-    - name: Install Playwright Browsers
-      run: npx playwright install --with-deps
+    - name: Install Playwright Dependencies
+      run: |
+        npm ci
+        npx playwright install --with-deps
 
     - name: Run Playwright Tests
-      env:
-        PLAYWRIGHT_GLOBAL_SETUP: './tests/global-setup.ts'
-      run: npx playwright test
+      run: |
+        source .venv/bin/activate
+        npx playwright test --config=playwright.config.ts

frontend/tests/README.md

@@ -1,7 +1,6 @@
 # End to End Workflow Navigation Testing 
 
-![Playwright Tests](https://github.com/qua-platform/qualibrate-app/actions/workflows/playwright-tests.yaml/badge.svg)
-
+[![Playwright Tests](https://github.com/qua-platform/qualibrate-app/actions/workflows/playwright-tests.yaml/badge.svg)](https://github.com/qua-platform/qualibrate-app/actions/workflows/playwright-tests.yaml)
 
 ### Overview
 This is a front-end testing suite for integration workflows for the QUAlibrate Application. The following tests are designed to validate the functionality and correctness of [user workflows](https://quantum-machines.atlassian.net/wiki/spaces/hlsw/pages/3223912481/QAPP+UX+Design+Brief#User-workflows) section of the online documentation. 

frontend/tests/e2e/workflow2.test.ts

@@ -9,7 +9,7 @@ test('Workflow2', {
       },
     },  async ({ page }) => {
 
-
+      
     // 1. Navigate to the Graph Library:
     // Ensure the application is running at http://127.0.0.1:8001/.
     await page.goto('http://localhost:8001/');

frontend/tests/global-setup.ts

@@ -2,22 +2,17 @@ import { FullConfig } from '@playwright/test';
 import { exec } from 'child_process';
 
 async function globalSetup(config: FullConfig) {
-  console.log('Starting QUAlibrate server...');
-
-  // Start the server as a child process
-  const server = exec('qualibrate start', (error, stdout, stderr) => {
+  console.log('Starting Qualibrate server...');
+  exec('source .venv/bin/activate && qualibrate start', (error, stdout, stderr) => {
     if (error) {
-      console.error(`Error starting server: ${error.message}`);
-      return;
+      console.error(`Error starting Qualibrate server: ${error.message}`);
+      process.exit(1);
     }
     if (stderr) {
-      console.error(`Server stderr: ${stderr}`);
+      console.error(`Qualibrate start stderr: ${stderr}`);
     }
-    console.log(`Server stdout: ${stdout}`);
+    console.log(`Qualibrate start stdout: ${stdout}`);
   });
-
-  // Store server reference for teardown, if needed
-  (global as any).__SERVER__ = server;
 }
 
-export default globalSetup;
+export default globalSetup;

frontend/tests/playwright.config.ts

@@ -3,31 +3,21 @@ import { defineConfig } from '@playwright/test';
 
 export default defineConfig({
   testDir: './tests', // Test directory
-  /* Run tests in files in parallel */
   fullyParallel: true,
-  /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
   timeout: 30000, // Test timeout in milliseconds
-  /* Retry on CI only */
+  globalSetup: './tests/global-setup.ts', // Path to global setup file
+  globalTeardown: './tests/global-teardown.ts', // Path to global teardown file
   retries: process.env.CI ? 2 : 0,
-  /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : 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://127.0.0.1:3000',
     headless: true,
-    baseURL: 'http://127.0.0.1:8001/', // Update base URL for your app
-
-    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    baseURL: 'http://127.0.0.1:8001/', // base URL for the QUAlibrate app
     trace: 'on-first-retry',
     screenshot: 'only-on-failure', // Take screenshots only on failure
     video: 'retain-on-failure', // Record videos only for failed tests
   },  
-  globalSetup: './tests/global-setup.ts', // Path to your global setup file
-  globalTeardown: './tests/global-teardown.ts', // Path to your global teardown file
 
   projects: [
     {
@@ -42,9 +32,5 @@ export default defineConfig({
       name: 'WebKit',
       use: { browserName: 'webkit' },
     },
-    // {
-    //   name: 'Microsoft Edge',
-    //   use: { channel: 'msedge' },
-    // },
   ],
 });