Add wxGLCanvas WASM implementation and documentation
- Update build script with bakefile_gen Docker instructions and PCRE fix - Add wxWidgets submodule with OpenGL/WebGL support for WASM - Document comprehensive WASM test plan and wxGLCanvas implementation - Document legacy GL emulation strategy for KiCad (423+ legacy GL calls) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Viktor Vaczi
parent
4069de6a0b
commit
9e1d971797
4 changed files with 700 additions and 4 deletions
347
docs/04-COMPREHENSIVE-WASM-TEST.md
Normal file
347
docs/04-COMPREHENSIVE-WASM-TEST.md
Normal file
|
|
@ -0,0 +1,347 @@
|
|||
# Phase 4: Comprehensive wxWidgets WASM Test Application
|
||||
|
||||
## Overview
|
||||
|
||||
Create a multi-widget showcase test application for the wxWidgets WASM port that thoroughly exercises wxUniversal controls and event handling. This validates the WASM port before integrating KiCad components.
|
||||
|
||||
## Goal
|
||||
|
||||
1. Display various wxUniversal controls in a tabbed interface
|
||||
2. Support full interaction: mouse clicks, keyboard input, mouse drag/draw, hover effects
|
||||
3. Show an on-screen event log panel for visual verification
|
||||
4. Have corresponding Playwright tests to verify all interactions work
|
||||
|
||||
---
|
||||
|
||||
## Application Architecture
|
||||
|
||||
```
|
||||
+-------------------------------------------------------+
|
||||
| Menu: File | Edit | Help |
|
||||
+-------------------------------------------------------+
|
||||
| [Controls Tab] [Text Tab] [Drawing Tab] [Lists Tab] |
|
||||
+-------------------------------------------------------+
|
||||
| |
|
||||
| Tab Content Area |
|
||||
| (varies by tab) |
|
||||
| |
|
||||
+-------------------------------------------------------+
|
||||
| Event Log Panel (wxListBox) |
|
||||
| - "Button 'Test' clicked" |
|
||||
| - "Checkbox toggled: checked" |
|
||||
| - "Mouse moved to (123, 456)" |
|
||||
+-------------------------------------------------------+
|
||||
| Status Bar: Ready |
|
||||
+-------------------------------------------------------+
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Files to Modify
|
||||
|
||||
| File | Action | Description |
|
||||
|------|--------|-------------|
|
||||
| `tests/wasm-app/minimal_test.cpp` | Replace | Comprehensive widget showcase |
|
||||
| `tests/e2e/wxwidgets.spec.ts` | Update | Add interaction tests |
|
||||
|
||||
---
|
||||
|
||||
## Test Application Structure
|
||||
|
||||
### Control IDs
|
||||
|
||||
```cpp
|
||||
enum {
|
||||
ID_BTN_TEST = wxID_HIGHEST + 1,
|
||||
ID_BTN_TOGGLE,
|
||||
ID_CHK_FEATURE,
|
||||
ID_RADIO_OPTIONS,
|
||||
ID_SLIDER,
|
||||
ID_GAUGE,
|
||||
ID_TEXT_SINGLE,
|
||||
ID_TEXT_MULTI,
|
||||
ID_TEXT_PASSWORD,
|
||||
ID_COMBO,
|
||||
ID_LISTBOX,
|
||||
ID_CHOICE,
|
||||
ID_BTN_CLEAR,
|
||||
ID_EVENT_LOG,
|
||||
ID_DRAWING_PANEL
|
||||
};
|
||||
```
|
||||
|
||||
### Main Classes
|
||||
|
||||
```cpp
|
||||
class TestApp : public wxApp; // Application entry point
|
||||
class TestFrame : public wxFrame; // Main frame with notebook and event log
|
||||
class ControlsPage : public wxPanel; // Tab 1: Buttons, checkboxes, sliders
|
||||
class TextPage : public wxPanel; // Tab 2: Text controls
|
||||
class DrawingPage : public wxPanel; // Tab 3: Mouse drawing canvas
|
||||
class ListsPage : public wxPanel; // Tab 4: Lists and dropdowns
|
||||
class DrawingPanel : public wxPanel; // Custom drawing canvas
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Tab Contents
|
||||
|
||||
### Tab 1: Controls
|
||||
|
||||
| Control | ID | Purpose |
|
||||
|---------|-----|---------|
|
||||
| wxButton ("Click Me") | `ID_BTN_TEST` | Basic click event |
|
||||
| wxToggleButton ("Toggle") | `ID_BTN_TOGGLE` | Two-state button |
|
||||
| wxCheckBox ("Enable feature") | `ID_CHK_FEATURE` | Boolean toggle |
|
||||
| wxRadioBox ("Options": A/B/C) | `ID_RADIO_OPTIONS` | Exclusive selection |
|
||||
| wxSlider (0-100) | `ID_SLIDER` | Range selection |
|
||||
| wxGauge | `ID_GAUGE` | Shows slider value |
|
||||
|
||||
### Tab 2: Text Input
|
||||
|
||||
| Control | ID | Purpose |
|
||||
|---------|-----|---------|
|
||||
| wxTextCtrl (single-line) | `ID_TEXT_SINGLE` | Basic text input |
|
||||
| wxTextCtrl (multi-line) | `ID_TEXT_MULTI` | Multi-line text |
|
||||
| wxTextCtrl (password) | `ID_TEXT_PASSWORD` | Masked input |
|
||||
| wxComboBox | `ID_COMBO` | Dropdown with text |
|
||||
|
||||
### Tab 3: Drawing Canvas
|
||||
|
||||
| Control | ID | Purpose |
|
||||
|---------|-----|---------|
|
||||
| DrawingPanel | `ID_DRAWING_PANEL` | Custom painting |
|
||||
| wxButton ("Clear") | `ID_BTN_CLEAR` | Reset canvas |
|
||||
|
||||
Mouse interactions:
|
||||
- `wxEVT_LEFT_DOWN` - Start drawing
|
||||
- `wxEVT_MOTION` - Draw line segments
|
||||
- `wxEVT_LEFT_UP` - End drawing
|
||||
|
||||
### Tab 4: Lists
|
||||
|
||||
| Control | ID | Purpose |
|
||||
|---------|-----|---------|
|
||||
| wxListBox | `ID_LISTBOX` | Multi-item selection |
|
||||
| wxChoice | `ID_CHOICE` | Dropdown selection |
|
||||
| Add/Remove buttons | - | Modify list contents |
|
||||
|
||||
---
|
||||
|
||||
## Event Log Panel
|
||||
|
||||
- `wxListBox` at bottom of frame
|
||||
- ID: `ID_EVENT_LOG`
|
||||
- Max 100 entries (older entries removed)
|
||||
- Auto-scrolls to bottom
|
||||
- Format: `"[HH:MM:SS] Event description"`
|
||||
|
||||
Events also logged to browser console for Playwright verification.
|
||||
|
||||
---
|
||||
|
||||
## Event Types to Test
|
||||
|
||||
| Event | Control | Test Method |
|
||||
|-------|---------|-------------|
|
||||
| `wxEVT_BUTTON` | Button | Click canvas coordinates |
|
||||
| `wxEVT_TOGGLEBUTTON` | ToggleButton | Click and verify state |
|
||||
| `wxEVT_CHECKBOX` | CheckBox | Click and verify checked |
|
||||
| `wxEVT_RADIOBOX` | RadioBox | Click option and verify |
|
||||
| `wxEVT_SLIDER` | Slider | Drag and verify value |
|
||||
| `wxEVT_TEXT` | TextCtrl | Type and verify content |
|
||||
| `wxEVT_TEXT_ENTER` | TextCtrl | Press Enter |
|
||||
| `wxEVT_LISTBOX` | ListBox | Click item and verify |
|
||||
| `wxEVT_CHOICE` | Choice | Click and select |
|
||||
| `wxEVT_LEFT_DOWN` | Panel | Mouse down |
|
||||
| `wxEVT_MOTION` | Panel | Mouse move |
|
||||
| `wxEVT_LEFT_UP` | Panel | Mouse up |
|
||||
| `wxEVT_PAINT` | Panel | Automatic on invalidate |
|
||||
|
||||
---
|
||||
|
||||
## Playwright Test Structure
|
||||
|
||||
```typescript
|
||||
test.describe('wxWidgets WASM Comprehensive', () => {
|
||||
// Existing loading tests...
|
||||
|
||||
test.describe('Controls Tab', () => {
|
||||
test('button click logs event');
|
||||
test('checkbox toggle works');
|
||||
test('slider interaction');
|
||||
test('radio button selection');
|
||||
});
|
||||
|
||||
test.describe('Text Input Tab', () => {
|
||||
test('text input accepts keyboard');
|
||||
test('multiline text input');
|
||||
test('password field masks input');
|
||||
});
|
||||
|
||||
test.describe('Drawing Tab', () => {
|
||||
test('mouse drag draws on canvas');
|
||||
test('clear button resets canvas');
|
||||
});
|
||||
|
||||
test.describe('Lists Tab', () => {
|
||||
test('listbox selection');
|
||||
test('choice dropdown');
|
||||
});
|
||||
|
||||
test.describe('Event Log', () => {
|
||||
test('events are logged visually');
|
||||
});
|
||||
});
|
||||
```
|
||||
|
||||
### Test Helpers
|
||||
|
||||
```typescript
|
||||
// Wait for app to be ready
|
||||
async function waitForApp(page: Page) {
|
||||
await page.waitForSelector('canvas', { state: 'visible', timeout: 30000 });
|
||||
await page.waitForTimeout(500); // Let UI settle
|
||||
}
|
||||
|
||||
// Simulate click at canvas coordinates
|
||||
async function clickAt(page: Page, x: number, y: number) {
|
||||
const canvas = page.locator('canvas');
|
||||
await canvas.click({ position: { x, y } });
|
||||
}
|
||||
|
||||
// Check console for event log entries
|
||||
async function getConsoleEvents(page: Page): Promise<string[]> {
|
||||
// Capture console.log messages with [EVENT] prefix
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Testing Challenges & Solutions
|
||||
|
||||
### Challenge 1: Canvas Coordinate Mapping
|
||||
|
||||
wxUniversal renders all widgets to a single HTML5 canvas. Tests need to know widget positions.
|
||||
|
||||
**Solution**: Use consistent layout with predictable positions. Log control bounds to console on startup.
|
||||
|
||||
### Challenge 2: Verifying Event Log Content
|
||||
|
||||
The event log is inside the WASM app, not directly accessible from JavaScript.
|
||||
|
||||
**Solution**: Log events to browser console with `[EVENT]` prefix. Playwright captures via `page.on('console')`.
|
||||
|
||||
### Challenge 3: Keyboard Input
|
||||
|
||||
Need to route keyboard events to the correct wxWidgets control.
|
||||
|
||||
**Solution**: Focus canvas first, then use `page.keyboard.type()`. wxWidgets handles focus internally.
|
||||
|
||||
---
|
||||
|
||||
## wxUniversal Controls Reference
|
||||
|
||||
Available controls in wxUniversal (verified in `wxwidgets/include/wx/univ/`):
|
||||
|
||||
**Buttons:**
|
||||
- wxButton, wxBitmapButton, wxToggleButton
|
||||
|
||||
**Input Controls:**
|
||||
- wxCheckBox, wxRadioButton, wxRadioBox
|
||||
- wxTextCtrl (single/multi-line)
|
||||
- wxComboBox, wxChoice
|
||||
|
||||
**Lists:**
|
||||
- wxListBox, wxCheckListBox
|
||||
|
||||
**Range Controls:**
|
||||
- wxSlider, wxGauge, wxSpinButton
|
||||
|
||||
**Containers:**
|
||||
- wxNotebook (tabbed container)
|
||||
- wxPanel, wxScrolledWindow
|
||||
|
||||
**Static Controls:**
|
||||
- wxStaticText, wxStaticBox, wxStaticLine
|
||||
|
||||
**Frame Elements:**
|
||||
- wxMenu, wxMenuBar, wxStatusBar
|
||||
|
||||
---
|
||||
|
||||
## Implementation Steps
|
||||
|
||||
### Step 1: Update minimal_test.cpp
|
||||
|
||||
Replace current minimal test with comprehensive widget showcase.
|
||||
|
||||
Key components:
|
||||
1. `TestFrame` constructor creates notebook, tabs, and event log
|
||||
2. Each tab page creates its controls with appropriate sizers
|
||||
3. Event handlers call `LogEvent()` to record actions
|
||||
4. `LogEvent()` adds to wxListBox AND prints to console
|
||||
|
||||
### Step 2: Update Playwright Tests
|
||||
|
||||
Extend `tests/e2e/wxwidgets.spec.ts`:
|
||||
1. Keep existing loading tests
|
||||
2. Add test groups for each tab
|
||||
3. Add console event capture
|
||||
4. Add canvas interaction helpers
|
||||
|
||||
### Step 3: Build and Test
|
||||
|
||||
```bash
|
||||
# Rebuild test app
|
||||
./scripts/build-wasm-test.sh
|
||||
|
||||
# Run tests
|
||||
cd tests && npm test
|
||||
|
||||
# Visual debugging
|
||||
npm run test:ui
|
||||
# or
|
||||
cd wasm-app && npx serve .
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Success Criteria
|
||||
|
||||
### Visual Verification
|
||||
- [ ] App displays with menu bar
|
||||
- [ ] Four tabs visible and switchable
|
||||
- [ ] Controls visible on each tab
|
||||
- [ ] Event log panel at bottom
|
||||
|
||||
### Interaction Tests
|
||||
- [ ] Button click logs "Button clicked"
|
||||
- [ ] Checkbox toggle logs state change
|
||||
- [ ] Slider drag updates gauge and logs value
|
||||
- [ ] Text input shows typed text and logs changes
|
||||
- [ ] Drawing canvas responds to mouse drag
|
||||
- [ ] ListBox/Choice selection works
|
||||
|
||||
### Playwright Tests
|
||||
- [ ] All existing loading tests pass
|
||||
- [ ] Button interaction test passes
|
||||
- [ ] Checkbox interaction test passes
|
||||
- [ ] Text input test passes
|
||||
- [ ] Drawing interaction test passes
|
||||
|
||||
---
|
||||
|
||||
## Dependencies
|
||||
|
||||
Before implementation:
|
||||
- wxWidgets WASM build complete (`./scripts/build-wxuniversal-wasm.sh`)
|
||||
- Existing Playwright tests passing (`cd tests && npm test`)
|
||||
|
||||
---
|
||||
|
||||
## References
|
||||
|
||||
- wxWidgets Samples: `wxwidgets/samples/widgets/` - Multi-widget showcase pattern
|
||||
- wxWidgets Samples: `wxwidgets/samples/drawing/` - Custom painting pattern
|
||||
- wxUniversal Headers: `wxwidgets/include/wx/univ/` - Available controls
|
||||
324
docs/05-WXGLCANVAS-WASM-IMPLEMENTATION.md
Normal file
324
docs/05-WXGLCANVAS-WASM-IMPLEMENTATION.md
Normal file
|
|
@ -0,0 +1,324 @@
|
|||
# 05 - wxGLCanvas WASM Implementation
|
||||
|
||||
This document outlines the plan to implement wxGLCanvas (OpenGL/WebGL support) for the wxWidgets WASM port, enabling KiCad's OpenGL-based rendering in the browser.
|
||||
|
||||
## Current Status: Completed ✅
|
||||
|
||||
**wxGLCanvas implementation is complete.** The GL library builds successfully:
|
||||
```
|
||||
libwx_wasmunivu_gl-3.2-emscripten.a
|
||||
```
|
||||
|
||||
### Build Command
|
||||
```bash
|
||||
./scripts/build-wxuniversal-wasm.sh # Incremental build
|
||||
./scripts/build-wxuniversal-wasm.sh --clean # Clean build
|
||||
```
|
||||
|
||||
### Implementation Summary
|
||||
- Created `wxwidgets/include/wx/wasm/glcanvas.h`
|
||||
- Created `wxwidgets/src/wasm/glcanvas.cpp`
|
||||
- Updated `wxwidgets/configure.in` for WASM OpenGL support
|
||||
- Updated `wxwidgets/build/bakefiles/files.bkl`
|
||||
- Added empty stubs for legacy wxGLAPI functions in `glcmn.cpp` (KiCad doesn't use these)
|
||||
|
||||
---
|
||||
|
||||
## Phase 1: Fix wxWidgets Build (PCRE2 Issue) ✅ Completed
|
||||
|
||||
### Problem
|
||||
```
|
||||
fatal error: 'pcre2.h' file not found
|
||||
```
|
||||
|
||||
### Root Cause
|
||||
Build race condition during parallel make. With `-j` parallel builds, `regex.cpp` can compile before PCRE generates its headers.
|
||||
|
||||
### Solution
|
||||
Modify `scripts/build-wxuniversal-wasm.sh` to build PCRE first:
|
||||
|
||||
```bash
|
||||
# After configure section, add:
|
||||
echo ""
|
||||
echo "=== Building PCRE first (dependency) ==="
|
||||
emmake make -C 3rdparty/pcre
|
||||
|
||||
# Then existing make:
|
||||
echo ""
|
||||
echo "=== Building ==="
|
||||
emmake make -j$(nproc 2>/dev/null || sysctl -n hw.ncpu)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Phase 2: Implement wxGLCanvas for WASM ✅ Completed
|
||||
|
||||
### Estimated Effort: 18-27 hours (Actual: ~8 hours)
|
||||
|
||||
| Component | Files | Effort |
|
||||
|-----------|-------|--------|
|
||||
| Header file | `include/wx/wasm/glcanvas.h` | 2-3 hours |
|
||||
| Implementation | `src/wasm/glcanvas.cpp` | 8-12 hours |
|
||||
| Configure updates | `configure.in` | 1-2 hours |
|
||||
| Build system | `build/files.bkl` | 1 hour |
|
||||
| Testing & debug | - | 6-10 hours |
|
||||
|
||||
### Implementation Approach: Direct WebGL via Emscripten
|
||||
|
||||
Use Emscripten's HTML5 API (`emscripten/html5.h`) for WebGL context management.
|
||||
|
||||
#### 1. Create `include/wx/wasm/glcanvas.h` (~100-150 lines)
|
||||
|
||||
```cpp
|
||||
#ifndef _WX_WASM_GLCANVAS_H_
|
||||
#define _WX_WASM_GLCANVAS_H_
|
||||
|
||||
#include "wx/glcanvas.h"
|
||||
#include <emscripten/html5.h>
|
||||
|
||||
class WXDLLIMPEXP_GL wxGLContext : public wxGLContextBase
|
||||
{
|
||||
public:
|
||||
wxGLContext(wxGLCanvas *win, const wxGLContext *other = NULL,
|
||||
const wxGLContextAttrs *ctxAttrs = NULL);
|
||||
virtual ~wxGLContext();
|
||||
|
||||
virtual bool SetCurrent(const wxGLCanvas& win) const wxOVERRIDE;
|
||||
|
||||
private:
|
||||
EMSCRIPTEN_WEBGL_CONTEXT_HANDLE m_context;
|
||||
|
||||
wxDECLARE_CLASS(wxGLContext);
|
||||
};
|
||||
|
||||
class WXDLLIMPEXP_GL wxGLCanvas : public wxGLCanvasBase
|
||||
{
|
||||
public:
|
||||
wxGLCanvas(wxWindow *parent,
|
||||
const wxGLAttributes& dispAttrs,
|
||||
wxWindowID id = wxID_ANY,
|
||||
const wxPoint& pos = wxDefaultPosition,
|
||||
const wxSize& size = wxDefaultSize,
|
||||
long style = 0,
|
||||
const wxString& name = wxGLCanvasName,
|
||||
const wxPalette& palette = wxNullPalette);
|
||||
|
||||
virtual ~wxGLCanvas();
|
||||
|
||||
virtual bool SwapBuffers() wxOVERRIDE;
|
||||
|
||||
// Get the canvas element ID for Emscripten
|
||||
const char* GetCanvasId() const { return m_canvasId.c_str(); }
|
||||
|
||||
private:
|
||||
bool CreateWindow(wxWindow *parent, const wxGLAttributes& dispAttrs,
|
||||
wxWindowID id, const wxPoint& pos, const wxSize& size,
|
||||
long style, const wxString& name);
|
||||
|
||||
std::string m_canvasId;
|
||||
|
||||
wxDECLARE_CLASS(wxGLCanvas);
|
||||
};
|
||||
|
||||
#endif // _WX_WASM_GLCANVAS_H_
|
||||
```
|
||||
|
||||
#### 2. Create `src/wasm/glcanvas.cpp` (~500-700 lines)
|
||||
|
||||
Key implementation tasks:
|
||||
- Parse wxGL_* attributes → WebGL context attributes
|
||||
- Create WebGL context using `emscripten_webgl_create_context()`
|
||||
- Implement `SetCurrent()` using `emscripten_webgl_make_context_current()`
|
||||
- Handle canvas resize events
|
||||
- `SwapBuffers()` - typically no-op for WebGL (auto-swaps)
|
||||
|
||||
#### 3. Update `configure.in` (line ~3890)
|
||||
|
||||
```autoconf
|
||||
elif test "$wxUSE_WASM" = 1; then
|
||||
dnl WASM uses WebGL through Emscripten
|
||||
OPENGL_LIBS=""
|
||||
wxUSE_OPENGL="yes"
|
||||
```
|
||||
|
||||
#### 4. Update `build/files.bkl`
|
||||
|
||||
Add `glcanvas.cpp` to WASM sources list.
|
||||
|
||||
### Reference Files
|
||||
- `src/unix/glegl.cpp` - EGL implementation (922 lines)
|
||||
- `src/gtk/glcanvas.cpp` - GTK implementation (303 lines)
|
||||
- `src/common/glcmn.cpp` - Base implementation shared by all ports
|
||||
|
||||
---
|
||||
|
||||
## Phase 3: Legacy OpenGL Emulation for KiCad
|
||||
|
||||
### The Problem
|
||||
|
||||
**KiCad uses legacy OpenGL immediate mode** which is **NOT supported in WebGL**. KiCad does NOT use wxGLAPI (wxWidgets' wrapper), but calls raw OpenGL directly:
|
||||
|
||||
| Function Category | Count | Examples |
|
||||
|---|---|---|
|
||||
| glBegin/glEnd | 70 | Immediate mode drawing |
|
||||
| glVertex2f/3f/2d/3d | 112 | Vertex specification |
|
||||
| glMatrixMode/glPushMatrix/glPopMatrix | 88 | Matrix stack operations |
|
||||
| glEnableClientState/glDisableClientState | 43 | Legacy vertex arrays |
|
||||
| glColor3f/4f/3d/4d | 34 | Per-vertex colors |
|
||||
| glTranslatef/glRotatef/glScalef | 26 | Matrix transforms |
|
||||
| glTexCoord2f/2d | 19 | Texture coordinates |
|
||||
| glVertexPointer/glColorPointer | 18 | Legacy vertex arrays |
|
||||
| glNormal3f/3d | 12 | Normal vectors |
|
||||
| **TOTAL** | **423+** | **Must be emulated** |
|
||||
|
||||
### Most Affected KiCad Files
|
||||
|
||||
**3D Viewer (heaviest usage):**
|
||||
- `opengl_utils.cpp` - 88+ calls (bounding boxes, debug geometry)
|
||||
- `render_3d_opengl.cpp` - 50+ calls (core 3D board rendering)
|
||||
- `3d_spheres_gizmo.cpp` - 48+ calls (interactive gizmos)
|
||||
- `layer_triangles.cpp` - 34 calls (layer mesh rendering)
|
||||
|
||||
**2D PCB Viewer:**
|
||||
- `opengl_gal.cpp` - 39+ calls (bitmap text, cursor)
|
||||
- `antialiasing.cpp` - 37+ calls (fullscreen AA post-processing)
|
||||
- `opengl_compositor.cpp` - 19+ calls (screen compositing)
|
||||
|
||||
### Solution: Emscripten Legacy GL Emulation
|
||||
|
||||
**Link flag:** `-sLEGACY_GL_EMULATION`
|
||||
|
||||
This built-in Emscripten feature emulates legacy OpenGL (immediate mode, matrix stack, etc.) on top of WebGL. It was used to port the Sauerbraten 3D game (BananaBread).
|
||||
|
||||
**Optional performance flags:**
|
||||
- `-sGL_UNSAFE_OPTS` - Skip redundant GL work
|
||||
- `-sGL_FFP_ONLY` - Disable programmable pipeline detection
|
||||
|
||||
**Alternatives (if needed later):**
|
||||
- [gl4es](https://github.com/ptitSeb/gl4es) - OpenGL 2.1 → GLES 2.0 translation
|
||||
- [Regal](https://github.com/emscripten-ports/regal) - Used by D3Wasm (Doom 3 port)
|
||||
|
||||
---
|
||||
|
||||
## Phase 4: Test Graphics
|
||||
|
||||
### Goal
|
||||
|
||||
Create tests that exercise **all GL functions KiCad uses** to verify emulation works.
|
||||
|
||||
### GL Functions to Test (Based on KiCad Usage)
|
||||
|
||||
#### Immediate Mode Drawing
|
||||
```cpp
|
||||
glBegin(GL_TRIANGLES);
|
||||
glBegin(GL_QUADS);
|
||||
glBegin(GL_LINE_STRIP);
|
||||
glBegin(GL_LINE_LOOP);
|
||||
glBegin(GL_LINES);
|
||||
glEnd();
|
||||
```
|
||||
|
||||
#### Vertex Specification
|
||||
```cpp
|
||||
glVertex2f(x, y);
|
||||
glVertex3f(x, y, z);
|
||||
glVertex2d(x, y);
|
||||
glVertex3d(x, y, z);
|
||||
```
|
||||
|
||||
#### Color Specification
|
||||
```cpp
|
||||
glColor3f(r, g, b);
|
||||
glColor4f(r, g, b, a);
|
||||
glColor3ub(r, g, b);
|
||||
glColor4ub(r, g, b, a);
|
||||
```
|
||||
|
||||
#### Matrix Operations
|
||||
```cpp
|
||||
glMatrixMode(GL_PROJECTION);
|
||||
glMatrixMode(GL_MODELVIEW);
|
||||
glLoadIdentity();
|
||||
glPushMatrix();
|
||||
glPopMatrix();
|
||||
glTranslatef(x, y, z);
|
||||
glRotatef(angle, x, y, z);
|
||||
glScalef(x, y, z);
|
||||
glOrtho(...);
|
||||
gluPerspective(...);
|
||||
```
|
||||
|
||||
#### Texture Coordinates
|
||||
```cpp
|
||||
glTexCoord2f(s, t);
|
||||
glTexCoord2d(s, t);
|
||||
```
|
||||
|
||||
#### Normal Vectors
|
||||
```cpp
|
||||
glNormal3f(nx, ny, nz);
|
||||
glNormal3d(nx, ny, nz);
|
||||
```
|
||||
|
||||
#### Legacy Vertex Arrays
|
||||
```cpp
|
||||
glEnableClientState(GL_VERTEX_ARRAY);
|
||||
glEnableClientState(GL_COLOR_ARRAY);
|
||||
glDisableClientState(...);
|
||||
glVertexPointer(...);
|
||||
glColorPointer(...);
|
||||
glDrawArrays(...);
|
||||
```
|
||||
|
||||
#### State Management
|
||||
```cpp
|
||||
glEnable(GL_BLEND);
|
||||
glEnable(GL_DEPTH_TEST);
|
||||
glEnable(GL_TEXTURE_2D);
|
||||
glDisable(...);
|
||||
glBlendFunc(...);
|
||||
```
|
||||
|
||||
### Test File: `tests/wasm-app/gl_test.cpp`
|
||||
|
||||
Create test application that:
|
||||
1. Creates wxGLCanvas with WebGL context
|
||||
2. Tests each category of GL functions
|
||||
3. Renders a known pattern (e.g., colored shapes)
|
||||
4. Logs results to console
|
||||
|
||||
### Playwright Tests: `tests/e2e/gl.spec.ts`
|
||||
|
||||
Automated tests:
|
||||
- WebGL context creation succeeds
|
||||
- Each GL function category executes without errors
|
||||
- Visual verification of rendered output (screenshot comparison)
|
||||
|
||||
---
|
||||
|
||||
## Files to Create/Modify
|
||||
|
||||
| File | Action |
|
||||
|------|--------|
|
||||
| `scripts/build-wxuniversal-wasm.sh` | Modify - fix PCRE build order |
|
||||
| `wxwidgets/include/wx/wasm/glcanvas.h` | Create - wxGLCanvas header |
|
||||
| `wxwidgets/src/wasm/glcanvas.cpp` | Create - wxGLCanvas implementation |
|
||||
| `wxwidgets/configure.in` | Modify - add WASM OpenGL support |
|
||||
| `wxwidgets/build/files.bkl` | Modify - add source file |
|
||||
| `tests/wasm-app/gl_test.cpp` | Create - test application |
|
||||
| `tests/e2e/gl.spec.ts` | Create - Playwright tests |
|
||||
|
||||
---
|
||||
|
||||
## Why This Matters for KiCad
|
||||
|
||||
KiCad uses a Graphics Abstraction Layer (GAL) with two backends:
|
||||
- **Cairo backend**: Uses wxDC (2D) - works with existing wxUniversal WASM
|
||||
- **OpenGL backend**: Uses wxGLCanvas - **requires this implementation**
|
||||
|
||||
KiCad's OpenGL GAL provides:
|
||||
- Hardware-accelerated rendering
|
||||
- Better performance for complex PCBs
|
||||
- 3D viewer support
|
||||
|
||||
Without wxGLCanvas, KiCad would be limited to Cairo rendering only.
|
||||
|
|
@ -1,6 +1,19 @@
|
|||
#!/bin/bash
|
||||
# Build wxWidgets with wxUniversal for WebAssembly
|
||||
# This builds the GUI-enabled wxWidgets needed for KiCad
|
||||
#
|
||||
# Prerequisites:
|
||||
# - Emscripten SDK installed and activated
|
||||
# - autoconf (for regenerating configure from configure.in)
|
||||
#
|
||||
# To regenerate Makefile.in from bakefiles (after modifying files.bkl):
|
||||
# cd wxwidgets/build/bakefiles
|
||||
# docker run --rm -v "$(pwd)/../..":"$(pwd)/../.." -w "$(pwd)" \
|
||||
# ghcr.io/vslavik/bakefile:0.2 bakefile_gen
|
||||
#
|
||||
# Usage:
|
||||
# ./build-wxuniversal-wasm.sh # Build (incremental)
|
||||
# ./build-wxuniversal-wasm.sh --clean # Clean build
|
||||
|
||||
set -e
|
||||
|
||||
|
|
@ -15,12 +28,18 @@ echo "Build dir: $BUILD_DIR"
|
|||
echo "wxWidgets source: $WX_SOURCE"
|
||||
|
||||
# Verify we're in the right place
|
||||
if [ ! -f "$WX_SOURCE/configure" ]; then
|
||||
if [ ! -f "$WX_SOURCE/configure.in" ]; then
|
||||
echo "ERROR: wxWidgets source not found at $WX_SOURCE"
|
||||
echo "Make sure the wxwidgets submodule is initialized"
|
||||
exit 1
|
||||
fi
|
||||
|
||||
# Regenerate configure if configure.in is newer
|
||||
if [ "$WX_SOURCE/configure.in" -nt "$WX_SOURCE/configure" ]; then
|
||||
echo "configure.in is newer than configure, regenerating..."
|
||||
(cd "$WX_SOURCE" && autoconf)
|
||||
fi
|
||||
|
||||
# Clean if requested
|
||||
if [ "$1" = "--clean" ]; then
|
||||
echo "Cleaning build directory..."
|
||||
|
|
@ -64,9 +83,15 @@ emconfigure "$WX_SOURCE/configure" \
|
|||
--with-cxx=17 \
|
||||
--enable-utf8
|
||||
|
||||
# Build
|
||||
# Build PCRE first to avoid race condition with parallel builds
|
||||
# PCRE headers (pcre2.h) must be generated before regex.cpp compiles
|
||||
echo ""
|
||||
echo "=== Building ==="
|
||||
echo "=== Building PCRE first (dependency) ==="
|
||||
emmake make -C 3rdparty/pcre
|
||||
|
||||
# Build wxWidgets
|
||||
echo ""
|
||||
echo "=== Building wxWidgets ==="
|
||||
emmake make -j$(nproc 2>/dev/null || sysctl -n hw.ncpu)
|
||||
|
||||
echo ""
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
Subproject commit fd8c4884833eff35ce790bfd6f085c1556227456
|
||||
Subproject commit f9229d7b06260dfdf699932fac84d3f0c7620c0f
|
||||
Loading…
Reference in a new issue