Repository navigation
Attribute put in lowercase? #481
Description
I just hit a very confusing behavior. I was following this event example for Alpine JS https://alpinejs.dev/essentials/events#listening-for-events-on-window and I replaced foo with my own signal:
a "@click"="$dispatch('showLangDialog')" {
span { "Language" }
}
div x-data="{ show: false }" x-cloak x-show="show"
"@showLangDialog.window"="show = true"
{
etc.
}
To my surprise, the attribute from the latter snippet became @showlangdialog.window="show = true" in lowercase, which breaks the signal transmission. If it's not by accident, what is the reason why it's put in lowercase?
Activity
sorcix commentedon Aug 4, 2025
I would guess this is because HTML attributes are case insensitive and making them all lowercase is better for compression.
The HTML5 spec also specifies that a browser should convert attribute names to lowercase. It makes sense for a HTML templating package to do the same.
Looks like Alpine JS abuses HTML a bit here. Maud has similar behaviours when you use it for things that look like HTML but are not actually HTML, like SVG.