Skip to content

Complete the HTML and CSS rendering roadmap - #7

Open
mh0pe wants to merge 1 commit into
tooooools:mainfrom
mh0pe:agent/complete-roadmap
Open

Complete the HTML and CSS rendering roadmap#7
mh0pe wants to merge 1 commit into
tooooools:mainfrom
mh0pe:agent/complete-roadmap

Conversation

@mh0pe

@mh0pe mh0pe commented Jul 23, 2026

Copy link
Copy Markdown

Summary

  • add a dedicated <hr> renderer for computed backgrounds and all four border sides, including dotted, dashed, double, inset/outset, and two-band groove/ridge styles
  • render underline, overline, and line-through from their originating decorating box with stable OpenType metrics, multiline geometry, propagation boundaries, and the required below-text/above-text paint order
  • preserve complete nested 2D affine transforms, including skew and 2D-compatible matrix3d() values, while rejecting true 3D transforms explicitly
  • keep transformed containing blocks stable during geometry measurement
  • add regression tests, documentation, and live examples for the completed roadmap

Validation

  • yarn install --frozen-lockfile
  • yarn test
  • focused ESLint over every changed source and test file
  • yarn build
  • yarn example:build
  • git diff --check
  • headless Chrome geometry smoke: four-sided and double rules, continuous mixed-size ancestor underline (0 px width delta), 3-below/2-above decoration layer order, preserved skew coefficients, and 0 px drift for a fixed child under a transformed parent

The repository-wide eslint src command still reports the existing Image/backgroundSize findings in src/renderers/div.js; this PR does not expand into those unrelated baseline issues.

Scope notes

The root element's own transform, independent translate/rotate/scale properties, and true 3D or perspective transforms remain outside the supported surface and are now documented explicitly.

I also evaluated chenglou/pretext as a possible backend. It is useful for line breaking and measurement, but it does not provide DOM box geometry, baselines, glyph placement, transforms, or SVG paths. Replacing the current Range/OpenType pipeline with it would reduce fidelity; a future opt-in adapter should first introduce a pluggable layout seam, strict fallback rules, and differential browser tests.

@mh0pe
mh0pe marked this pull request as ready for review July 24, 2026 01:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant