Hi all,
I have recently made some improvements to the interactive “active learning” examples on the learning area, after one of our community members filed a few bugs against them containing some really good suggestions.
I have:
- Hidden the JSFiddle/Codepen buttons, as they really aren’t needed and didn’t work very well when they were there.
- Made it so that pressing the Tab key while inside the textarea creates a Tab rather than tabbing to the reset button. I have also added code so that you can use the Esc key to unfocus the textarea — just so that it doesn’t end up becoming an accessibility trap.
- Made it so that the Show solution button now toggles between show/hide solution. Any changes made to the user code or solution have their state saved independently, until Reset is pressed, when both are reset to their initial states.
You can find the full details at https://bugzilla.mozilla.org/show_bug.cgi?id=1425639. I have made these additions to one example so far; see https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Arrays#Active_learning_Printing_those_products!
Before rolling the change out to all of the interactive examples on the learning area, I thought I’d check it to see if anyone else had any small updates they think would improve the examples, or any comments on the code as it stands?
Chris