Hono: `css` helper does not escape a closing tag split between the template and an interpolated value, allowing HTML injection

Summary

The css helper in hono/css escapes a / that follows < inside an interpolated value so that a value cannot close the <style> element. The check only looks inside each value. When the text before a value ends with <, whether that is the template itself or an earlier interpolated value, and the next value starts with /, the / is not escaped and the combined output contains an unescaped closing tag.

Details

Interpolated string values are escaped one at a time before they are joined with the surrounding template text. The rule that neutralizes </ therefore cannot see a < that belongs to the template. A template such as a content declaration that opens with a literal < and interpolates a string right after it produces a raw </style> when that string starts with /style>. During server-side rendering the <Style /> element is closed early and the rest of the value is interpreted as HTML.

This issue arises only when < is the last character before an interpolation in a css template, either written in the template or supplied by a preceding value, and the interpolated value is controlled by a client.

Impact

A client that controls such a value can inject HTML, including script, into the page rendered on the server.

This may lead to:

• Execution of attacker-controlled script in the browser of a user who views the page
• Exposure of information available to that page

This issue affects applications that interpolate untrusted strings into a css template immediately after a <, including two adjacent interpolations such as ${prefix}${name} where both are untrusted. Other uses of the css helper are not affected.

Workarounds

Do not interpolate untrusted values into css templates, or make sure the text before an interpolated value does not end with <.