Skip to content

Conversation

@hcdeng
Copy link
Contributor

@hcdeng hcdeng commented Mar 18, 2024

I had the chance to test out @omarluq 's fantastic addition of the Turbo Stream morph action in #1185. The feature works as expected, except fails to morph text-only changes. This appears to be due to a misreading of the Turbo-Rails implementation of the beforeNodeMorph/#shouldMorphElement callback: https://github.com/hotwired/turbo-rails/blob/102a491754d46f7dd924201fcfaf879a0f04b11c/app/assets/javascripts/turbo.js#L3830-L3844.

This PR updates the beforeNodeMorph callback to match the Turbo-Rails implementation -- with a tweak to hopefully increase readability -- and enable text-only morphing.

Copy link
Contributor

@omarluq omarluq left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice catch.

@omarluq
Copy link
Contributor

omarluq commented Mar 23, 2024

CC: @jorgemanrubia for visibility

Copy link
Member

@jorgemanrubia jorgemanrubia left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you so much for fixing @hcdeng! A very minor comment below:

These bugs are one of the risks that @seanpdoyle pointed out for having two pieces of code implementing the same logic. This will be a nice refactor to do, although it's not as as simple and extracting and reusing the function: we need to rework the internals of how we are handling turbo frames too.


function beforeNodeMorphed(target, newElement) {
if (target instanceof HTMLElement && !target.hasAttribute("data-turbo-permanent")) {
if (!(target instanceof HTMLElement)) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you please change it to wrap with the condition instead of a clause guard:

if (target instanceof HTMLElement) {
...
}

I prefer to keep things consistent there, and, also, I think Turbo's codebase tends to avoid guard conditions (that's a just a matter of style preference).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated in 9c2bd18, thanks!

@jorgemanrubia jorgemanrubia merged commit 9fb05e3 into hotwired:main Mar 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

3 participants