html icon indicating copy to clipboard operation
html copied to clipboard

Clarify the fill algorithm

Open Kaiido opened this issue 2 years ago • 0 comments

Currently the fill steps only ask to "fill all the subpaths of the intended path for path", without linking to any algorithm that should be used to actually perform this "fill" action.
The stroke steps on the other hand have a clear trace algorithm.

It is implied that the same fill algorithm should be used to determine if a point is inside the path, as is done in the is point in path steps. However, it's been brought to my attention that there is an interop issue in a small edge case here when we trace an empty path. For instance

ctx.moveTo(0, 10);
ctx.lineTo(5, 10);
ctx.lineTo(10,10);

Here filling the context's current subpath would not produce any pixel to be rendered because all three points are on the same Y axis value. However, calling ctx.isPointInPath() on any of these three points will return true in every UA. This is I think acceptable by the current specs since they say "Points on the path itself must be considered to be inside the path." But only Safari will return true for points that do lie on the line between these points (e.g ctx.isPointInPath(3, 10)), Chrome and Firefox will return false for this.

I believe that having a clear fill algorithm like we have for trace would allow to correctly specify what should happen here.

My personal vote would be to follow Safari here as it seems to be the most logical, but I can imagine there are implementation limitations that could prevent other browsers to do so.

cc @whatwg/canvas

Kaiido avatar Aug 01 '22 03:08 Kaiido