Does not take effect on <a> tag with [href] attribute

[gwerghh]

Environment: chrome 91.0.4472.114

But it is possible on the tag without the [href] attribute

[wopian]

I'll do some digging around - there's nothing in the paint worklet that should be stopping it from working on anchor elements that I know of.

May also be a Houdini Paint API implementation issue in Blink, as regular mask-image with url(path/to/image.svg) works without issue on anchor elements.

[wopian]

I've just gone and tried doing the same thing on a bunch of other Houdini Paint API worklets other people have made. They all have the same issue with the mask not being rendered correctly with either a mask on the anchor element, or an anchor element as a parent to the masked element when the [href] attribute is defined.

Will open a bug report on Chromium's bug tracker shortly.

[wopian]

Issue opened on the Chromium bug tracker: https://bugs.chromium.org/p/chromium/issues/detail?id=1225443

[wopian]

Unfortunately, this is intentional on Chromium's end to avoid leaking the :visited state. You can work around this issue by applying the mask to the parent element of the anchor element instead. E.g <div class='mask'><a href='//wopian.local'>Link</a></div> as shown on https://s7mpl.csb.app/

I will add a notice regarding this limitation to the README.

https://developer.mozilla.org/en-US/docs/Web/API/PaintWorklet#privacy_concerns
w3c/css-houdini-drafts#791