This document is for assessing if carbon-web-components
library can support event-based form participation spec, as a stop-gap solution until full-blown form-associated custom element API in order for our components to support use cases seen e.g. with <input>
in <form>
.
- Explainer: https://docs.google.com/document/d/1JO8puctCSpW-ZYGU8lF-h4FWRIDQNDVexzHoOQ2iQmY/edit
- Spec: whatwg/html#4239
- Tests:
- Chrome: Starting Chrome 77
- Firefox: Starting Firefox 71
- Safari: No roadmap yet
Supported by all major browsers including IE11: https://developer.mozilla.org/en-US/docs/Web/API/FormData
formdata
event bubbles, not cancelable, not composed.formdata
event is fired on<form>
, upon submitting it. (e.g. uponHTMLFormElement#submit()
call)
From the explainer:
UA handles them as submittable elements. In constructing the entry list algorithm, UA creates an entry with name attribute value of the form-associated custom element, and the value set by
setFormValue()
ofElementInternals
interface. Authors don’t need to registerformdata
event handlers.
Our components code handles formdata
event for the time being (until we are ready, which means full-blown form-associated custom element API is supported by all browsers we support), and switches to full-blown form-associated custom element API once we are ready.
Instead, it's likely that we merely define formdata
event handler in our custom elements (components). One scenario in mind is application manually fires formdata
event (upon user's gesture on form submit button, etc.) to let our components populate event.formData
, and run XHR/fetch()
with the populated event.formData
.
Given we require application to manually handle user's gesture for form submission, and manually handle the data gathered from formdata
event, feature-detection of full-blown form-associated custom element API means that application needs to maintain two codebase to use our components, one for browsers with full-blown form-associated custom element API, one without. That said, we are not likely to do feature-detection of full-blown form-associated custom element API, at least for now.
For supporting constraint validation API, i.e. checkValidity()
/reportValidity()
and invalid
event, etc., we'll wait for full-blown form-associated custom element API being available in all browsers we support.