Raise console error/warning when there are multiple root elements inside template tag.

[stephen-hill]

From time to time, I forget that template tags can only have one root element. I spend a while trying to debug the problem as I cannot see any errors, and then I spot it.

Please can Alpine output a console warning or error message?

The error message might be something like: "Multiple root level elements found inside line 123"

Here is an example of when I would like Alpine to output an error message: https://codepen.io/stephen-hill/pen/bGZoeyB

Cheers

[calebporzio]

Interested in PRing it? shouldn't be too tough

[stephen-hill]

@calebporzio Sure, I'm not familiar with the codebase though. Could you please point me in the general direction of which file and method/function should be modified.

Do you want a unit test for this?

[ekwoka]

Probably x-for.js and x-if.js

[stephen-hill]

Thanks. Consider this in-progress....

[stephen-hill]

@calebporzio and @ekwoka

As a sidebar question, is there any active work into supporting multiple children?

And if not, do you think this would be relatively easy to implement? or is there some architectural reason why it might be non-trivial?

[ekwoka]

It might be simple to implement by autoboxing the children into a contents display element.

It's mainly just a bit of an issue to try to handle multiple children as is, without having a proper tree, especially if there are nested loops/ifs etc.

A contents element would allow them to be in the layout as multiple separate elements, but be in a combined subtree.

I'm mostly just not sure how to be confident it doesn't break something in some strange edge case.

[calebporzio]

Yeah, that's one approach. Either way it won't be trivial so it's just kind of on the backburner until there's sufficient demand

[jimafisk]

How should folks show their enthusiasm for multiple root support? I'm working on a templating engine that generates markup with Alpine reactivity included and not having to enforce single roots would be helpful! Thank you!