Phase 4 Step 5: Canvas 2D context

[thomasnemer]

Parent: #41

Goal

Implement the Canvas 2D rendering context (CanvasRenderingContext2D) so that JavaScript can draw graphics programmatically on <canvas> elements.

Prerequisites

• Steps 2+3 (reuse transform math and gradient infrastructure)

Implementation

• Expose CanvasRenderingContext2D in Boa JS engine
• Drawing operations: fillRect(), strokeRect(), clearRect()
• Style: fillStyle, strokeStyle (colors, gradients, patterns)
• Path API: beginPath(), moveTo(), lineTo(), arc(), closePath(), fill(), stroke()
• Image drawing: drawImage()
• Text: fillText(), strokeText(), measureText()
• State management: save(), restore()
• Transform methods: transform(), setTransform(), translate(), rotate(), scale()
• Compositing: globalAlpha, globalCompositeOperation
• Pixel manipulation: getImageData(), putImageData()
• CPU rasterization via tiny-skia; upload pixel buffer to wgpu texture
• <canvas> as replaced element in layout
• New dependency: tiny-skia

Tests

• Unit tests for each drawing operation
• Path rendering tests
• Transform composition tests
• getImageData/putImageData round-trip tests
• Canvas layout integration tests (replaced element sizing)

Acceptance Criteria

• CanvasRenderingContext2D API is functional in JS
• Drawing operations produce correct pixel output via tiny-skia
• Canvas texture uploads to wgpu and displays in the page
• <canvas> participates in layout as a replaced element