In the last few months we’ve been working on an “interactive editor” feature for CSS and JavaScript reference pages on MDN. This will show the effect of some JS, or a CSS property, and let the reader edit the code and see the result directly, without having to open CodePen or JSFiddle in a new tab.
We’re close to starting a beta test for this thing, but before that I’d love it if a few people could try the editor out and file bugs.
You can see a few example pages here:
JS:
https://interactive-examples.mdn.mozilla.net/pages/js/array-concat.html
https://interactive-examples.mdn.mozilla.net/pages/js/array-reduce.html
https://interactive-examples.mdn.mozilla.net/pages/js/array-push.html
CSS:
https://interactive-examples.mdn.mozilla.net/pages/css/background-color.html
https://interactive-examples.mdn.mozilla.net/pages/css/background-size.html
https://interactive-examples.mdn.mozilla.net/pages/css/transform.html
https://interactive-examples.mdn.mozilla.net/pages/css/filter.html
https://interactive-examples.mdn.mozilla.net/pages/css/box-shadow.html
(Ultimately they’ll be embedded in the existing MDN pages for these functions and properties.)
Right now we are most interested in functional bugs: things you tried to do that behaved weirdly or brokenly.
Please file bugs here: https://github.com/mdn/interactive-examples
Thanks!