Re: [w3c/webcomponents] [Custom]: Need callback for form submit data (bugzilla: 24603) (#187)

@PleasantD the only workarounds we've been able to find are to replicate the behaviour of form elements (which requires you to also to replicate `<form />`) or to not use shadow DOM at all.

Replicating form and input behaviour is robust, and allows you to keep shadow DOM encapsulation, but can work well when implemented correctly and edge-cases are tested. We've documented roughly how to do this here: https://skatejs.gitbooks.io/skatejs/content/docs/recipes/form-behaviour-and-the-shadow-dom.html. This can work with any web component library, not just Skate. The downfall here is that your custom `<my-form />` will be tightly coupled to your `<my-input />` elements. Your custom input elements won't be able to be dropped into a standard `<form />` element, thus not reusable unless your consumers also use your custom form element.

Not using shadow DOM well for leaf nodes. Luckily, most form elements are leaf nodes. However, it falls short when you want to use the custom element in a library that takes over control of `childNodes`, like React. I know libraries like Incremental DOM and Preact have since lightened up how they destroy nodes they don't know about, but I'd err on the side of replicating form behaviour until this gets implemented.

You could try and use the `is` attribute. This would in fact be the most elegant approach, but you'll never be able to remove the polyfill because, at least, Safari will never implement it.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/187#issuecomment-298679090