Write an allow-list sanitiser
A CMS sends blog posts as HTML, and Post renders them with dangerouslySetInnerHTML. Right now sanitize returns the HTML unchanged.
Implement sanitize(html) as an allow-list: parse the HTML in an inert document (new DOMParser().parseFromString(html, "text/html")), then walk every element. Keep only the tags P, B, STRONG, I, EM, UL, LI and A. Remove SCRIPT, STYLE and IFRAME elements together with their content; for any other tag, keep its text (and its allowed children) but drop the tag. Remove every attribute, except href on A when it parses (against https://example.com) to an https: or http: URL. Return the body's innerHTML.
This is for learning: in a real app you'd use DOMPurify.
What Check tests
- Dangerous elements are gone
- Nothing ran
- No attributes survive except safe link
hrefs - Allowed formatting is kept
- The https link keeps its
href; the javascript: link loses it - Unknown tags are unwrapped, their text kept
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Your page
Console
Nothing logged yet.