Handling json property values in handlebars templates is awkward.
There's no helper for turning a property into json and using that as the context for another helper, and implementing one looks complicated, so I have been embedding the json into <script> elements and loading them from code.
Because it's possible for json data to contain </script> this should be escaped.
The standard handlebars option is to html-escape values so </script> becomes </script> but for script tags .innerText doesn't translate from the html-escaped form to plain text.
It is possible to create an ephemeral text element, set its content with .innerHTML and get the text out with .innerText but this is cumbersome, and substituting the script element for a hidden text element is horrible.
The Solution you'd like
In the absence of a helper to handle json properties directly, a base64Encode helper so that I can just use atob to decode it.
Alternatives that you've considered.
Trust that tokens aren't going to get invalid data in and it's safe to inline them into the script directly.
Use an ephemeral element to html-decode.
Use a hidden text element so .innerText works as expected.
Describe the Problem
Handling json property values in handlebars templates is awkward.
There's no helper for turning a property into json and using that as the context for another helper, and implementing one looks complicated, so I have been embedding the json into
<script>
elements and loading them from code.Because it's possible for json data to contain
</script>
this should be escaped.The standard handlebars option is to html-escape values so
</script>
becomes</script>
but for script tags.innerText
doesn't translate from the html-escaped form to plain text. It is possible to create an ephemeral text element, set its content with.innerHTML
and get the text out with.innerText
but this is cumbersome, and substituting the script element for a hidden text element is horrible.The Solution you'd like
In the absence of a helper to handle json properties directly, a base64Encode helper so that I can just use atob to decode it.
Alternatives that you've considered.
.innerText
works as expected.Additional Context
No response