Canvas 2D API (CanvasRenderingContext2D)

[wangnaihe]

Context

Per docs/vscode-compat.md Phase A (P1). Monaco Editor uses Canvas 2D for the minimap, diff decorations, and some rendering optimizations. Many charting/drawing libraries also depend on it.

Requirements

Implement <canvas> element with CanvasRenderingContext2D:

Drawing

• fillRect(x, y, w, h) / strokeRect(x, y, w, h) / clearRect(x, y, w, h)
• beginPath() / moveTo() / lineTo() / closePath() / arc()
• fill() / stroke()
• fillStyle / strokeStyle (color string or gradient)
• lineWidth / lineCap / lineJoin

Text

• fillText(text, x, y) / strokeText(text, x, y)
• measureText(text) → TextMetrics (width)
• font property (CSS font shorthand)
• textAlign / textBaseline

Images

• drawImage(image, dx, dy) / drawImage(image, dx, dy, dw, dh)
• getImageData() / putImageData() / createImageData()

Transform

• save() / restore()
• translate() / rotate() / scale()
• globalAlpha / globalCompositeOperation

Implementation

The backing store is already a tiny_skia::Pixmap. Canvas 2D operations map almost directly to tiny-skia drawing calls. The main work is:

1. Add ComponentKind::Canvas { width, height } to w3cos-std
2. Allocate a separate Pixmap per canvas element
3. Expose the drawing API through generated Rust code
4. Composite the canvas pixmap into the main frame during render_frame()

References

• MDN Canvas API
• crates/w3cos-runtime/src/render.rs — tiny-skia rendering

[github-actions]

AI Triage — Auto-classified this issue.

Labels: module:runtime, module:dom, difficulty:medium

To make this issue AI-ready, add clear acceptance criteria and expected behavior.

This comment was generated by the W3C OS Management AI. See AI_DEVELOPMENT.md for details.