Error integrating MultiSelect.js with Drupal: InvalidArgumentException on form submit

[rebelmusic]

I attempted to integrate the MultiSelect.js JavaScript library into Drupal’s node edit form to enhance the UI of multi-select fields. The library successfully replaced the default HTML element with its own custom markup and hidden inputs. However, upon submitting the form, Drupal threw the following error: InvalidArgumentException: Value is not a valid entity in Drupal\Core\Entity\Plugin\DataType\EntityReference->setValue() Root Cause Drupal’s Entity Reference widgets expect the original element to be submitted with valid entity IDs.
MultiSelect.js replaces the original with a custom structure and hidden inputs whose names and data formats do not match Drupal’s expected input structure. As a result, Drupal cannot map the submitted values back to valid entities. Suggested Improvements Preserve the original element: Keep it in the DOM (hidden via CSS) and have the custom UI update its selected options instead of replacing it.

Remove hidden input generation: Avoid creating new hidden inputs, as Drupal’s form API already handles entity reference fields correctly.

Sync selections: Modify the library’s event handlers so they toggle the selected state on the original options. I know it might take significant work to make these changes, and you totally don't need to do it. But I thought I'd create the issue anyways to let you know that it's hard to get this library working in a form that requires the original select values/keys (which is probably what many CMS's expect). Promising library though. Thanks!