lustre-labs / lustre

A Gleam web framework for building HTML templates, single page applications, and real-time server components.
https://hexdocs.pm/lustre
MIT License
948 stars 66 forks source link

add escape function over custom attribute values #113

Closed bgwdotdev closed 5 months ago

bgwdotdev commented 5 months ago

this is to fix situations where attributes have quotes in their value such as:

div([attribute("example", "{\"mykey\": \"myvalue\"}")], [])

where the result when rendered in the browser is:

<div example="{" mykey":="" "myvalue"}"=""></div>

which now becomes:

<div example="{&quot;mykey&quot;: &quot;myvalue&quot;}"></div>

or as seen from the developer console: image


let me know if you want me to split the new test into a different app file or anything like that.

also, I only changed it for custom key/value pair, not when pattern matching on "class" and "style", i expect we'll want it here as well and extent the test coverage as well? just wanted to do a first pass implementation to verify i'm changing all the right bits before changing too much ha. let me know.

hayleigh-dot-dev commented 5 months ago

also, I only changed it for custom key/value pair, not when pattern matching on "class" and "style", i expect we'll want it here as well and extent the test coverage as well? just wanted to do a first pass implementation to verify i'm changing all the right bits before changing too much ha. let me know.

Yeah thats right we'll need to make sure we're escaping classes/styles too. Should be the only change though!

bgwdotdev commented 5 months ago

sweet, added for the classes/styles, left out the "dangerous-enscaped-html" case as I assumed that was supposed to well, be unescaped ^^.

added more test coverage as well with the standard alert xss example that is now escaped successful :)

anything else need done let me know

hayleigh-dot-dev commented 5 months ago

Stunning, thank you so much ☺️