Must Know: Security

Prerequisites

• - A sanitizer strategy for any user-generated markup.
• - Dependency update policy and vulnerability scanning in CI.
• - CSP policy that matches loader and asset hosting choices.

Step 1: Sanitize untrusted content before rendering

Never inject user-provided HTML directly into component slots or app containers.

const safeHtml = sanitizeHtml(untrustedHtml); // app-approved sanitizer
container.innerHTML = safeHtml;

Step 2: Keep loader and assets on trusted origins

Serve component loader scripts and styles from trusted domains covered by CSP.

Content-Security-Policy:
  script-src 'self';
  style-src 'self' 'unsafe-inline';

Step 3: Patch dependencies and verify release notes

Update packages in controlled cycles and validate changelog impact before production rollout.

npm audit
npm update
npm test

Implementation Notes

• - Security updates should include docs updates when developer workflows change.
• - Avoid inline scripts where equivalent external bootstrapping is possible.
• - Review external support links and issue templates for accidental secret exposure.

Troubleshooting

• - If CSP blocks loader scripts, align script hosting and CSP directives.
• - If rendering sanitization breaks expected markup, tighten allowed tags incrementally.
• - If audit output grows, prioritize fixes affecting runtime dependencies first.

Next Actions