XSS & Content Rendering (Frontend Standard)

This document defines frontend standards to prevent Cross-Site Scripting (XSS) and unsafe rendering.

Baseline: React is safe by default (if you don’t bypass it)

React escapes content by default when you render strings into JSX.

The primary risk is introducing HTML sinks for untrusted content.

Non-negotiable rules

• Do not use dangerouslySetInnerHTML except behind an explicit, reviewed pattern.
• Do not render untrusted strings into HTML/JS contexts (script, style, URL handlers).
• Prefer storing rich content as safe structured data (or sanitized HTML) and rendering via safe components.

Allowed rich text patterns

Projects must choose one of these safe patterns and document it in the project repo:

1. No HTML: store plain text and render as text.
2. Markdown: store markdown, render with a markdown renderer configured to disallow raw HTML (or sanitize output).
3. Sanitized HTML: accept HTML only in explicitly-designated fields and sanitize on the backend before storing or rendering.

Rule: “sanitize everything” is not a standard. Sanitization is only for fields designed to accept rich content.

UI-level hardening

• Always treat user-provided URLs as untrusted:
  • validate/allowlist protocols (https:, mailto:) before using them in href.
• Never build HTML strings and inject them into the DOM.