Unsafe HTML Injection

dangerouslySetInnerHTML, direct innerHTML assignment

criticalSecurityunsafe-html

Why this matters

Injecting unsanitized HTML opens the door to XSS attacks. An attacker can execute JavaScript in your users' browsers, steal sessions, and exfiltrate data.

✗ Bad

function Comment({ html }: { html: string }) {
  return (
    <div dangerouslySetInnerHTML={{ __html: html }} />
  );
}

✓ Good

import DOMPurify from "dompurify";

function Comment({ html }: { html: string }) {
  const clean = DOMPurify.sanitize(html);
  return (
    <div dangerouslySetInnerHTML={{ __html: clean }} />
  );
}

How to fix

Sanitize all HTML with DOMPurify or a similar library before rendering. Better yet, use React's built-in text escaping and avoid dangerouslySetInnerHTML entirely.

All rules