demo · v136
Hit-test overlay
A real-world use: drag the mouse over the SVG path. Each frame we call isPointInFill({x, y}) and isPointInStroke({x, y}) with a plain object literal — no SVGSVGElement.createSVGPoint() dance, no ceremony.
Probes the new DOMPointInit signature.
cursor—
isPointInFill({x,y})—
isPointInStroke({x,y})—
the code
// 136+: plain object literals everywhere
const inFill = path.isPointInFill({ x: clientX, y: clientY });
const inStr = path.isPointInStroke({ x: clientX, y: clientY });
// pre-136 you had to do:
// const pt = svg.createSVGPoint(); pt.x = clientX; pt.y = clientY;
// path.isPointInFill(pt);
why this angle
The sibling concept shows the API surface. This concept exercises it inside a live hit-test loop — the actual situation that benefits from the lighter syntax (a hot mousemove handler).
see also
- SVG DOMPointInit — feature index
- API-tour concept
- ChromeStatus entry