1

For our web-components library we are using Lit framework, but recently we have discovered the bug that whenever our custom web components are included into the form, they are getting ignored by form reset(). Do you know how to force custom web components to be included into form.reset()?

<form>
   <custom-input-field
     id="title"
     name="title"
     value="Check out our library"
   ></custom-input-field>

   <input type="reset">
</form>
badm
  • 219
  • 2
  • 13
  • can't you listen to the "reset" event on the parent Form element? and reset CE's markup state etc? – mbehzad Aug 17 '22 at 14:24

1 Answers1

2

You might want to take a look at form-associated custom elements.

This'll allow custom elements to participate in forms and let you implement a formResetCallback() to reset your custom element to its default state on form reset.

As of writing (Aug 2022), form-associated custom elements via ElementInternals are available for Chrome and Firefox, and just got implemented for Safari.

Augustine Kim
  • 841
  • 1
  • 5