sanity
sanity copied to clipboard
fix(i18n): escape interpolated values inside of <Translate>
Description
If using the <Translate>
component (which utilizes the "simple parser"), and passing it values for interpolation that contained angle brackets (<
) or full on XML tags (<svg>
), the parser would treat this as "nested tags" and error out.
Since these interpolated values can contain user input (eg document titles), this can happen without us having control of it (The document "<3 is in the air" was published).
Wasn't quite sure about the right approach here, but the implementation I've gone for is one where the parser also tokenizes interpolations, and has the <Translate>
function replace the values as it goes. One drawback with this approach is that you cannot use formatters from i18next when using the <Translate>
function, but I felt this was an acceptable shortcoming for now that we can address later.
What to review
- Translate function correctly allows
<>
characters inside of values passed to it, both outside of HTML tags and within them - Parsing approach makes sense
Testing
Added tests for interpolation to parser, and for rendering the interpolated values (with and without angle brackets) in Translate
Notes for release
- Fixes an issue where using "angle brackets" (
<
,>
) in document titles could lead to an error being shown on publish and other operations