[LiveComponent][Autocomplete] Adding support for libraries to play nicely #418
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
weaverryan
changed the title
weaverryan
force-pushed
the
autocomplete-destroy-fix
branch
from
a4e8461 to
c8f51be
Compare
|
Tried it and that's perfect! 👏 👏 👏 |
…cely together This includes several important points: A) In autocomplete, data-live-ignore was added so that, when a "live component" re-renders, the element is not affected. B) For morphdom, the node key was changed from "id" to "data-live-id". This was due to a very complex "bad situation" that arised when autocomplete+live components. TomSelect finds the label for the element and give it an id attribute, which helps with the aria- attributes. However, this caused, on re-render, morphdom to think the "new label" did not match the old label. This small difference caused the elements in the parent div to be re-added one-by-one. Most importantly, a very innocent fromEl.appendChild(selectEl) is called deep in morphdom. In reality, selectEl already exists in fromEl... and the purpose of this call is actually just to help order things in the correct way. However, appendChild() caused the select element to momentarily be removed from the DOM then re-added. Stimulus noticed this and disconnected and then reconnected the autocomplete controller, causing the element to re-initialize (this, at the very least, would cause the element to lose focus). Anyways, this whole bad situation (which, is a bit poorly handled by morphdom), was caused by morphdom being confused by the "id" attribute on the label, which is present in the DOM but not in the re-rendered HTML. To avoid side effects like this, the nodeKey was changed to data-live-id. C) In live components, we also fixed a bug where if an element had data-live-ignore, it could be, incorrectly, removed on re-render if not present.
weaverryan
force-pushed
the
autocomplete-destroy-fix
branch
from
dbb9c03 to
c4791fc
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
See the commit for more information - this was a VERY pesky bug.
Cheers!