v136 · input
Paint with Capture
A drawing canvas that uses setPointerCapture() so strokes stay on-canvas even when the pointer moves off it. Chrome 136 now dispatches click events to the capture target on pointer up — so a quick tap registers as both a stroke endpoint AND a click, enabling colour-picker dots and tool selection without removing pointer capture.
probePE">checking Pointer Events…
checking setPointerCapture…
Before Chrome 136, a
click event fired on whichever element the pointer was physically over at release, not the element holding capture. This broke tap-to-select-colour in a drawing app — the click would hit whatever was under the finger, not the canvas. Chrome 136 fixes this: click goes to the capture target.
Drawing canvas
Event log (click events highlighted green)
The key change
// Chrome 136: click events fire on the capture target, not the element
// the pointer is physically over at release.
canvas.addEventListener('pointerdown', e => {
canvas.setPointerCapture(e.pointerId);
// All subsequent pointer events (move, up) now target canvas
// even if the pointer moves off the canvas
});
canvas.addEventListener('pointerup', e => {
// Chrome 136: if this was a quick tap (no significant movement),
// the 'click' event will also fire on the canvas — not on whatever
// element is physically under the pointer.
endStroke(e);
});
// Chrome 136: click now reliably hits the capture element
canvas.addEventListener('click', e => {
// Works! Before Chrome 136, this would miss if the pointer
// drifted off canvas during the tap.
selectToolOrColourAt(e.offsetX, e.offsetY);
});