User Agent: Mozilla/5.0 (Windows NT 6.3; rv:52.0) Gecko/20100101 Firefox/52.0 Build ID: 20170627155318 Steps to reproduce: <svg> <circle class="circle" cy="45" cx="45" r="3" fill="#ff0000" stroke="#0000ff" stroke-opacity="0.25" stroke-width="25" onclick="alert('circle');"/> </svg> Actual results: empty area inside circle. Not accessible also to onclick on part of element. Expected results: The circle shall be fully filled with rgba(0,0,255,0.25) by stroke. Color of center shall be #bf0040. whole element shall catch onclick.

This bug is real use case. I want to extend the clicable area of points on diagram for mobile users (fully responsive page) by adding area-extension via stroke-width="15" and stroke-opacity="0". Wrong rendering/implementation was detected after using stroke-opacity="0.25".

On linux with skia at least, I guess this chrome bug describes the cause for firefox as well: https://bugs.chromium.org/p/chromium/issues/detail?id=239860 Skia's still working out how to render such strokes (in this case those with stroke-width > twice the radius) in general. I guess the incorrect onclick behavior is a consequence of the incorrect rendering (though somehow chrome does detect clicks in the "empty" area between the blue and red, where firefox doesn't). You shouldn't see this if stroke-width <= twice the radius. I haven't checked on Windows, but sounds like D2D has the same issue, based on the reporter marking Windows as affected, with the same description as what I'm seeing on linux.