Web Component form field dropped by up-submit

[Bogdanp]

Bug description

When using a web component-based form field inside a form, the field is dropped during submission.

Reproduction project

https://glitch.com/edit/#!/little-nickel-citrus

Steps to reproduce the behavior:

1. Go to reproduction project linked above
2. Click submit and watch the Network tab in your browser's Developer Tools
3. Only the bar form field is sent with the request.

Expected behavior

Both the foo and the bar form fields should be sent. You can verify this by dropping the up-submit attribute from the form and repeating the reproduction steps.

Browser version

• OS: macOS Ventura
• Browser Arc (Chromium), Firefox, Safari
• Version 1.32

[triskweline]

A workaround for now:

1. Have your custom element implement { name, value } properties
2. Push its selector to up.form.config.fieldSelectors

Unpoly should eventually support custom form-associated elements, either via attachInternals() or the formdata event.

For this we may need to break some guarantees of [up-autosubmit] and [up-watch]. These features rely on reading the values of a partial form or a single element, and AFAIK neither attachInternals() nor formdata support this.

[Bogdanp]

Thanks for the workaround! I can confirm it works for my use case.