align WMD editor's preview HTML with server-side HTML validation (e.g. no embedded javascript)
- by Justin Grant
There are many SO questions (e.g. here and here) about how to do server-side scrubbing of Markdown produced by the WMD editor to ensure the HTML generated doesn't contain malicious script, like this:
<img onload="alert('haha');"
src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png" />
This doesn't affect the WMD client's preview box. I doubt this is a big deal since if you're scrubbing the HTML on the server, an attacker can't save the bad HTML so no one else will be able to see it later and have their cookies stolen or sessions hijacked by the bad script.
But it's still kinda odd to allow an attacker to run any script in the context of your site, and it's probably a bad idea to allow the client preview window to allow different HTML than your server will allow. StackOverflow has clearly plugged this hole. How did they do it?
[NOTE: I already figured this out but it required some tricky javascript debugging, so I'm answering my own question here to help others who may want to do ths same thing]