dom(2/0)
Prefer Light DOM to Shadow DOM
While there are legitimate uses for Shadow DOM, light DOM ought to be preferred until it is absolutely necessary to place your component’s element tree outside the main document. One common use-case which does not require shadow DOM is a custom element that does something special with events. Light DOM Use-Case Let’s say you have a custom element called <chaos-filter>. It has a form with a <select> dropdown and a filter <button> which applies the selected option to a list of children.…
Build web components for forms
Forms are an obvious web component, but there are a few gotchas. Stephen solves a common problem when writing my own web components: How to communicate with a form tag. I’m curious to try his approach for myself. I recently took a different approach: don’t use the shadow DOM at all. Then the browser has no trouble connecting the input tags with the form. See my chaos-filter, which is used on this page.…