Assuming you have a reference to an element, it’s as easy as detecting a dash in the element’s tag:
function isWebComponent(element) return element.tagName.includes("-");
The web component spec requires a dash in the
tagName, so detecting a web component is essentially nailed down to a string comparison.
If you haven’t played with web components, I really hope you find the time. Having lived through decades of “widgets” and over-nesting of arbitrary DIVs and unreadable code, I’ve learned to appreciate these gems!