Add KiCad PCBnew WASM test infrastructure
- Add pcbnew-load.spec.ts: Tests for WASM runtime initialization - Add pcbnew.html: Test harness for loading KiCad in browser - Add setup-kicad-wasm.sh: Script to copy WASM from Docker build - Add serve.json: COOP/COEP headers for SharedArrayBuffer support - Update package.json: Add npm run test:kicad and setup:kicad scripts - Update .gitignore: Exclude generated WASM/JS files from kicad/ 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
af2adda002
commit
71f800d6a5
7 changed files with 304 additions and 3 deletions
4
.gitignore
vendored
4
.gitignore
vendored
|
|
@ -45,5 +45,9 @@ wxwidgets-clean/
|
|||
/tests/wasm-app/standalone/*/*.js
|
||||
/tests/wasm-app/standalone/*/*.html
|
||||
/tests/wasm-app/standalone/*/*.wasm
|
||||
/tests/wasm-app/kicad/*.js
|
||||
/tests/wasm-app/kicad/*.wasm
|
||||
!tests/wasm-app/kicad/pcbnew.html
|
||||
/temp/
|
||||
*.log
|
||||
*.tmp
|
||||
|
|
|
|||
96
tests/e2e/kicad/pcbnew-load.spec.ts
Normal file
96
tests/e2e/kicad/pcbnew-load.spec.ts
Normal file
|
|
@ -0,0 +1,96 @@
|
|||
import { test, expect } from '../utils/fixtures';
|
||||
|
||||
test.describe('KiCad PCBnew WASM', () => {
|
||||
|
||||
test('WASM runtime initializes', async ({ page, testLogger }) => {
|
||||
// Navigate to KiCad app
|
||||
await page.goto('/kicad/pcbnew.html');
|
||||
|
||||
// Wait for runtime initialization (longer timeout for KiCad - 15MB WASM)
|
||||
await page.waitForFunction(() => {
|
||||
return document.querySelector('#canvas')?.style.display === 'block';
|
||||
}, { timeout: 120000 }); // 2 min timeout for large WASM
|
||||
|
||||
// Verify canvas is visible
|
||||
const canvas = page.locator('#canvas');
|
||||
await expect(canvas).toBeVisible();
|
||||
|
||||
// Check for successful initialization logs
|
||||
const initLog = testLogger.consoleLogs.find(l =>
|
||||
l.includes('[KICAD] Runtime initialized')
|
||||
);
|
||||
expect(initLog).toBeTruthy();
|
||||
|
||||
// Check that app started creating
|
||||
const appLog = testLogger.consoleLogs.find(l =>
|
||||
l.includes('[KICAD_OUT] Creating app')
|
||||
);
|
||||
expect(appLog).toBeTruthy();
|
||||
|
||||
// Take screenshot of initial state
|
||||
await page.screenshot({
|
||||
path: 'test-results/kicad-pcbnew-01-initial.png',
|
||||
fullPage: true
|
||||
});
|
||||
|
||||
// Log any errors for debugging (but don't fail on WASM exceptions yet)
|
||||
const errors = testLogger.errors.filter(e =>
|
||||
!e.includes('favicon') &&
|
||||
!e.includes('SharedArrayBuffer')
|
||||
);
|
||||
|
||||
if (errors.length > 0) {
|
||||
console.log('Errors during initialization:', errors);
|
||||
}
|
||||
|
||||
// For now, we expect initialization errors due to incomplete port
|
||||
// The test passes if runtime initializes - we track errors for debugging
|
||||
});
|
||||
|
||||
test('canvas is properly sized', async ({ page }) => {
|
||||
await page.goto('/kicad/pcbnew.html');
|
||||
|
||||
// Wait for load
|
||||
await page.waitForFunction(() => {
|
||||
return document.querySelector('#canvas')?.style.display === 'block';
|
||||
}, { timeout: 120000 });
|
||||
|
||||
// Wait for initial render
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
// Get canvas and verify it's sized properly
|
||||
const canvas = page.locator('#canvas');
|
||||
const box = await canvas.boundingBox();
|
||||
expect(box).toBeTruthy();
|
||||
expect(box!.width).toBeGreaterThan(100);
|
||||
expect(box!.height).toBeGreaterThan(100);
|
||||
|
||||
// Screenshot for visual inspection
|
||||
await page.screenshot({
|
||||
path: 'test-results/kicad-pcbnew-02-rendered.png',
|
||||
fullPage: true
|
||||
});
|
||||
});
|
||||
|
||||
// This test documents the current state - expect to fail until port is complete
|
||||
test.skip('loads without errors', async ({ page, testLogger }) => {
|
||||
await page.goto('/kicad/pcbnew.html');
|
||||
|
||||
await page.waitForFunction(() => {
|
||||
return document.querySelector('#canvas')?.style.display === 'block';
|
||||
}, { timeout: 120000 });
|
||||
|
||||
await page.waitForTimeout(2000);
|
||||
|
||||
// Check for errors
|
||||
const errors = testLogger.errors.filter(e =>
|
||||
!e.includes('favicon') &&
|
||||
!e.includes('SharedArrayBuffer')
|
||||
);
|
||||
|
||||
// This will fail until KiCad WASM port is complete
|
||||
// Current known issue: WASM exception during wxWidgets initialization
|
||||
expect(errors).toHaveLength(0);
|
||||
});
|
||||
|
||||
});
|
||||
|
|
@ -1,13 +1,16 @@
|
|||
{
|
||||
"name": "kicad-wasm-tests",
|
||||
"version": "1.0.0",
|
||||
"description": "Playwright tests for wxWidgets WASM port",
|
||||
"description": "Playwright tests for wxWidgets WASM and KiCad",
|
||||
"scripts": {
|
||||
"test": "playwright test",
|
||||
"test:ui": "playwright test --ui",
|
||||
"test:headed": "playwright test --headed",
|
||||
"build-wasm": "cd wasm-app && make -f Makefile.wasm",
|
||||
"serve": "npx serve wasm-app -p 8080"
|
||||
"serve": "npx serve wasm-app -p 8080 -c ../serve.json",
|
||||
"setup:kicad": "./scripts/setup-kicad-wasm.sh",
|
||||
"test:kicad": "playwright test kicad/",
|
||||
"test:kicad:headed": "playwright test kicad/ --headed"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@playwright/test": "^1.40.0",
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@ export default defineConfig({
|
|||
],
|
||||
|
||||
webServer: {
|
||||
command: `npx serve wasm-app -p ${port}`,
|
||||
command: `npx serve wasm-app -p ${port} -c ../serve.json`,
|
||||
port: port,
|
||||
reuseExistingServer: !process.env.CI,
|
||||
},
|
||||
|
|
|
|||
27
tests/scripts/setup-kicad-wasm.sh
Executable file
27
tests/scripts/setup-kicad-wasm.sh
Executable file
|
|
@ -0,0 +1,27 @@
|
|||
#!/bin/bash
|
||||
# Copies KiCad WASM build output from Docker volume to test directory
|
||||
|
||||
set -e
|
||||
|
||||
SCRIPT_DIR="$(cd "$(dirname "$0")" && pwd)"
|
||||
PROJECT_ROOT="$(cd "$SCRIPT_DIR/../.." && pwd)"
|
||||
KICAD_TEST="$PROJECT_ROOT/tests/wasm-app/kicad"
|
||||
|
||||
mkdir -p "$KICAD_TEST"
|
||||
|
||||
echo "Copying KiCad WASM files from Docker build..."
|
||||
docker compose -f "$PROJECT_ROOT/docker/docker-compose.yml" cp \
|
||||
kicad-wasm-builder:/workspace/build-wasm/kicad-pcbnew/pcbnew/pcbnew.js "$KICAD_TEST/"
|
||||
docker compose -f "$PROJECT_ROOT/docker/docker-compose.yml" cp \
|
||||
kicad-wasm-builder:/workspace/build-wasm/kicad-pcbnew/pcbnew/pcbnew.wasm "$KICAD_TEST/"
|
||||
|
||||
# Worker file for pthreads (if exists)
|
||||
docker compose -f "$PROJECT_ROOT/docker/docker-compose.yml" cp \
|
||||
kicad-wasm-builder:/workspace/build-wasm/kicad-pcbnew/pcbnew/pcbnew.worker.js "$KICAD_TEST/" 2>/dev/null || true
|
||||
|
||||
# wxWidgets WASM JavaScript glue code (defines JS functions called from WASM)
|
||||
echo "Copying wxWidgets WASM glue code..."
|
||||
cp "$PROJECT_ROOT/wxwidgets/build/wasm/wx.js" "$KICAD_TEST/"
|
||||
|
||||
echo "KiCad WASM files copied to $KICAD_TEST"
|
||||
ls -lh "$KICAD_TEST"
|
||||
11
tests/serve.json
Normal file
11
tests/serve.json
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"headers": [
|
||||
{
|
||||
"source": "**/*",
|
||||
"headers": [
|
||||
{ "key": "Cross-Origin-Opener-Policy", "value": "same-origin" },
|
||||
{ "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" }
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
160
tests/wasm-app/kicad/pcbnew.html
Normal file
160
tests/wasm-app/kicad/pcbnew.html
Normal file
|
|
@ -0,0 +1,160 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>KiCad PCBnew WASM</title>
|
||||
<style>
|
||||
.emscripten { padding-right: 0; margin-left: auto; margin-right: auto; display: block; }
|
||||
div.emscripten { text-align: center; }
|
||||
/* the canvas *must not* have any border or padding, or mouse coords will be wrong */
|
||||
canvas.emscripten { border: 0px none; }
|
||||
|
||||
.window {
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
z-index: 10;
|
||||
background-color: black;
|
||||
overflow: hidden;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.window-canvas {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#status {
|
||||
position: fixed;
|
||||
bottom: 10px;
|
||||
left: 10px;
|
||||
color: #fff;
|
||||
font-family: monospace;
|
||||
z-index: 1000;
|
||||
background: rgba(0,0,0,0.7);
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
#progress {
|
||||
width: 300px;
|
||||
height: 20px;
|
||||
background: #333;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
#progress-bar {
|
||||
height: 100%;
|
||||
background: #4CAF50;
|
||||
width: 0%;
|
||||
transition: width 0.3s;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body style="margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; background: #1a1a2e;">
|
||||
<div id="main-window"></div>
|
||||
|
||||
<div id="status">
|
||||
<div id="status-text">Initializing...</div>
|
||||
<div id="progress"><div id="progress-bar"></div></div>
|
||||
</div>
|
||||
|
||||
<div id="window-container"></div>
|
||||
|
||||
<script>
|
||||
var mainWindow = document.getElementById('main-window');
|
||||
var statusText = document.getElementById('status-text');
|
||||
var progressBar = document.getElementById('progress-bar');
|
||||
|
||||
var showError = function(msg) {
|
||||
console.error('[KICAD_ERROR] ' + msg);
|
||||
statusText.textContent = 'Error: ' + msg;
|
||||
statusText.style.color = 'red';
|
||||
};
|
||||
|
||||
var createCanvas = function() {
|
||||
var canvas = document.createElement('canvas');
|
||||
canvas.id = 'canvas';
|
||||
canvas.style.display = 'none';
|
||||
canvas.style.width = window.innerWidth + 'px';
|
||||
canvas.style.height = window.innerHeight + 'px';
|
||||
canvas.oncontextmenu = function() { event.preventDefault(); };
|
||||
canvas.addEventListener("webglcontextlost", function(e) {
|
||||
showError('WebGL context lost. You will need to reload the page.');
|
||||
e.preventDefault();
|
||||
}, false);
|
||||
|
||||
mainWindow.appendChild(canvas);
|
||||
Module.canvas = canvas;
|
||||
|
||||
console.log('[KICAD] preRun complete, canvas created');
|
||||
};
|
||||
|
||||
var onRuntimeInitialized = function() {
|
||||
console.log('[KICAD] Runtime initialized');
|
||||
var canvas = Module.canvas;
|
||||
canvas.style.display = 'block';
|
||||
document.getElementById('status').style.display = 'none';
|
||||
};
|
||||
|
||||
var Module = {
|
||||
preRun: [createCanvas],
|
||||
postRun: [],
|
||||
|
||||
print: function(text) {
|
||||
if (arguments.length > 1)
|
||||
text = Array.prototype.slice.call(arguments).join(' ');
|
||||
console.log('[KICAD_OUT] ' + text);
|
||||
},
|
||||
|
||||
printErr: function(text) {
|
||||
if (arguments.length > 1)
|
||||
text = Array.prototype.slice.call(arguments).join(' ');
|
||||
console.error('[KICAD_ERR] ' + text);
|
||||
},
|
||||
|
||||
setStatus: function(text) {
|
||||
console.log('[KICAD_STATUS] ' + text);
|
||||
statusText.textContent = text;
|
||||
|
||||
// Parse progress from status text
|
||||
var match = text.match(/(\d+)\/(\d+)/);
|
||||
if (match) {
|
||||
var pct = (parseInt(match[1]) / parseInt(match[2])) * 100;
|
||||
progressBar.style.width = pct + '%';
|
||||
}
|
||||
},
|
||||
|
||||
totalDependencies: 0,
|
||||
monitorRunDependencies: function(left) {
|
||||
this.totalDependencies = Math.max(this.totalDependencies, left);
|
||||
Module.setStatus(left ? 'Preparing... (' + (this.totalDependencies-left) + '/' + this.totalDependencies + ')' : 'All downloads complete.');
|
||||
},
|
||||
|
||||
onRuntimeInitialized: onRuntimeInitialized,
|
||||
|
||||
// Required for locating .wasm and .worker.js files
|
||||
locateFile: function(path) {
|
||||
return path;
|
||||
}
|
||||
};
|
||||
|
||||
Module.setStatus('Downloading...');
|
||||
|
||||
window.onerror = function(msg, url, line) {
|
||||
showError(msg + ' at ' + url + ':' + line);
|
||||
Module.setStatus = function(text) {
|
||||
if (text) Module.printErr('[post-exception status] ' + text);
|
||||
};
|
||||
return false;
|
||||
};
|
||||
</script>
|
||||
|
||||
<!-- wxWidgets WASM glue code (defines getConfigEntryLength, etc.) -->
|
||||
<script src="wx.js"></script>
|
||||
<script async src="pcbnew.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in a new issue