Post
Just discovered this excellent resource about which CSS features work well in shadow DOM and which don't: https://shadow-dom-css.adobe.com/
Honestly this is the part I miss least about working with web components. It broke so many parts of the web platform, and plenty of new web APIs seem to be just plowing ahead and hoping "somebody will figure out this shadow DOM stuff later"
I don't want to dismiss the hard work that people are doing to make the web platform more cohesive. And of course competing interests and priorities will always make the web "lumpy": https://paul.kinlan.me/the-lumpy-web/
But still, as a web developer, it's exhausting. This site doesn't even cover @font-face, ARIA IDref, submit buttons in forms, focus libraries, browser extensions, styling… the list goes on and on. When you work with shadow DOM, you're opting into pain.
I *really* look forward to using shadow DOM in, like, ~3-5 years after all this stuff has been ironed out. In the meantime, its advocates are doing true heroics to harmonize it with the rest of the web platform. But it's really a slog, and it's hard for me to remember fondly all the effort I put into getting basic stuff to work across shadow boundaries
Oh man I almost forgot about:
- elementtiming
- ARIA semantics where the parent-child DOM relationship matters (e.g. list / list items)
- scoped custom element registries
I'm having flashbacks to all these battles. Really hard to say I miss them.
Install bonfire.cafe
Get the full app experience
