Prototyping With document.designMode

I came across the document.designMode property recently, and at first I did not understand why you would ever need it, but today I actually used it and wanted to share my learnings with you!

In short, this property makes the entire document editable, as if you set contentEditable on every tag in the page. Using this technique, you can quickly adjust text on a webpage to make simple adjustments to your web app for screenshots or demonstrations. You could even use this to quickly add or remove text to test wrapping or responsive design with a variety of content.

document.designMode = "on"