Merge pull request #12 from seamplex/copilot/add-network-logging-debugging

Add network logging and error visibility to Playwright CAD upload test

Author: gtheler

playwright.config.js

@@ -11,6 +11,13 @@ module.exports = defineConfig({
   use: {
     baseURL: 'http://localhost:8000',
     trace: 'on-first-retry',
+    video: 'retain-on-failure',
+    screenshot: 'only-on-failure',
+    // Add HAR recording to capture all network traffic
+    recordHar: { 
+      path: 'test-results/network.har',
+      content: 'attach' // Include response bodies
+    },
   },
 
   projects: [

tests/e2e/create_case.spec.js

@@ -3,13 +3,71 @@ const { test, expect } = require('@playwright/test');
 const path = require('path');
 
 test('create new case from sample.step', async ({ page }) => {
+    // Add network request/response logging
+    page.on('request', request => {
+        console.log('>>', request.method(), request.url());
+    });
+
+    page.on('response', async response => {
+        const url = response.url();
+        console.log('<<', response.status(), url);
+        
+        // Log responses from PHP scripts involved in CAD processing
+        if (url.includes('import_cad.php') || url.includes('process.php')) {
+            try {
+                const body = await response.text();
+                console.log('Response body:', body);
+            } catch (e) {
+                console.log('Could not read response body:', e.message);
+            }
+        }
+    });
+
+    // Add browser console logging
+    page.on('console', msg => {
+        console.log('BROWSER:', msg.type(), msg.text());
+    });
+
     // 1. Go to /new
     await page.goto('/new/');
 
     // 2. In that view, there's a file upload input box. Put the file html/new/sample.step in the upload box
     // Note: path is relative to the test file.
     // tests/e2e/create_case.spec.js -> ../../html/new/sample.step
     const sampleFile = path.join(__dirname, '../../html/new/sample.step');
+    
+    // Wait for the import response
+    const importResponsePromise = page.waitForResponse(response => 
+        response.url().includes('import_cad.php') && response.status() === 200,
+        { timeout: 30000 }
+    );
+    
+    await page.setInputFiles('#cad', sampleFile);
+    
+    await importResponsePromise;
+
+    // Wait for the process response
+    const processResponse = await page.waitForResponse(response => 
+        response.url().includes('process.php') && response.status() === 200,
+        { timeout: 30000 }
+    );
+
+    // Wait for the file to be processed and preview to be shown
+    try {
+        await expect(page.locator('#cad_preview')).toBeVisible({ timeout: 30000 });
+    } catch (error) {
+        // Check if there's an error message displayed
+        const errorDiv = page.locator('#cad_error');
+        if (await errorDiv.isVisible()) {
+            const errorText = await errorDiv.textContent();
+            console.log('CAD Error displayed:', errorText);
+        }
+        
+        // Take a screenshot for debugging
+        await page.screenshot({ path: 'test-results/upload-failure.png', fullPage: true });
+        
+        throw error;
+    }
     await page.setInputFiles('#cad', sampleFile);
 
     // Wait for the file to be processed and preview to be shown
@@ -24,6 +82,7 @@ test('create new case from sample.step', async ({ page }) => {
     // 5. Select "FeenoX" in the combo box for solver
     await page.selectOption('#solver', 'feenox');
 
+    // 6. Select "Gmsh" in the combo box for mesher
     // 6. Select "Gmsh" in thecombo box for mesher
     await page.selectOption('#mesher', 'gmsh');