luckyframework / lucky

A full-featured Crystal web framework that catches bugs for you, runs incredibly fast, and helps you write code that lasts.
https://luckyframework.org
MIT License
2.59k stars 156 forks source link

HTML attributes that aren't pre-escaped? #1823

Open mdwagner opened 1 year ago

mdwagner commented 1 year ago

When using LuckyHTML, I've noticed you don't need to run HTML.escape, as it does this for you behind the scenes (#9). Normally, this would make sense to do on everything: both text and attributes.

However, if you're using something like htmx for your client-server interactions, there are situations where the attributes shouldn't be pre-escaped.

As an example, this

Screen Shot 2023-08-28 at 4 24 35 PM

becomes this

Screen Shot 2023-08-28 at 4 24 48 PM

which is undesirable (and broken).

We could provide a new tag method that will not escape attributes (you can already do unescaped text with the raw tag helper), but idk if anyone has any other ideas.

jwoertink commented 1 year ago

Yeah, that makes sense. I've been talking with @watzon on doing better integration with HTMX for Lucky. Another thing needed would be allowing Actions as attribute values.

mdwagner commented 1 year ago

https://github.com/guilleiguaran/rails-htmx looks like a decent start at what an integration could look like for Lucky.

watzon commented 1 year ago

I was actually looking at the Laravel HTMX library as inspiration, but that Rails one could be a good pattern too

jwoertink commented 1 year ago

also https://github.com/mauricius/laravel-htmx

mdwagner commented 1 year ago

Actually, it appears I only assumed this pre-escaped text was breaking with htmx, because it looked weird in the dev tools. But it actually works fine. So, maybe this isn't really a bug...

rmarronnier commented 1 year ago

@mdwagner : Thanks for opening this issue, I'm bumping my head into this issue right now (trying to pass the X-CSRF-Token value along with the htmx non get/post request).

Are you sure your request has a myHeader key with a My value value ? (Mine don't with the same "badly" escaped string)

More on topic, when using the https://luckyframework.org/html tool to "translate" this <div hx-get="/example" hx-headers='{"myHeader": "My Value"}'>Get Some HTML, Including A Custom Header in the Request</div> to lucky html, I get invalid code : div "Get Some HTML, Including A Custom Header in the Request", hx_get: "/example", hx_headers: "{"myHeader": "My Value"}" Error: unexpected token: "myHeader"

If the tool is reliable, then it is a bug :-)

mdwagner commented 1 year ago

@rmarronnier Yeah, that does seem like a bug in the html builder, which we should on address on https://github.com/luckyframework/website.

But to your point, yes, I can confirm it does add the correct headers to my outgoing request (I put hx-headers on the body tag).

rmarronnier commented 1 year ago

Yeah, that does seem like a bug in the html builder, which we should on address on https://github.com/luckyframework/website.

Good idea, I'll open an issue.

But to your point, yes, I can confirm it does add the correct headers to my outgoing request (I put hx-headers on the body tag).

I'll try that.