Open KonnorRogers opened 6 months ago
https://github.com/keithamus/fdgt/blob/main/stateset.js here's a polyfill I use (gets added here) which uses an internal Set
to keep track for unsupported browsers, and calls .add
in a try/catch (the current standard doesn't validate beyond the first arg being a string so thrown errors would only be from "old" Chrome). Feel free to repurpose as you see fit for this polyfill.
With the deprecation of the
:--state
syntax, I imagine the restrictions around requiring the--
prefix should be removed.https://groups.google.com/a/chromium.org/g/blink-dev/c/GDmNaxAuCY4/m/WOQD5uRTAQAJ
https://html.spec.whatwg.org/multipage/custom-elements.html#exposing-custom-element-states
It has not been implemented in Chrome yet, but it has been implemented in Safari TP and I believe is being worked on for Firefox.
https://github.com/calebdwilliams/element-internals-polyfill/blob/f3033904ab7a853142177791c16430e1c0382195/src/CustomStateSet.ts#L30-L32
https://codepen.io/dannymoerkerke/pen/KKEyarg
^ Example supporting both syntaxes.