FYI invalid self-closing elements can produce odd results

[markfirmware]

For instance, anchor is not self-closing, but this alpinejs html looks fine on casual inspection:

https://codepen.io/markfirmware/pen/abmvVaL

[KevinBatdorf]

Wouldn't that happen with or without Alpine?

[markfirmware]

The thing is alpine provides x-text which can lead one to drop the closing tag and try the self-closing syntax. Casual inspection of the alpinejs html looks elegant as you can see but does not work as expected.

This is just an fyi - it begs a more valuable question - where in alpinejs workflow does the developer discover the errant syntax (self-closing?)

[KevinBatdorf]

Good to bring up though as maybe some people coming from Vue get confused.

In short, you shouldn't be using self-closing tags at all in the dom.

If you're thinking of Alpine in terms of Vue, think of Vue inline templates, where you should also not use self-closing tags.

Alpine will work on whatever the browser renders, so if the browser is struggling to parse the markup, Alpine will be none the wiser.