Unbeautified HTML in CodeMirror editor

[danowar2k]

Browser: Chrome Moodle 3.5.9

When I switch to HTMLplus mode, there seems to be a race condition happening.

https://github.com/andrewnicols/moodle-atto_htmlplus/blob/4ea748b1584ccb2dffc80a1ce2837277479596a1/yui/src/button/js/button.js#L103

        host.textarea.set('value',
                Y.M.atto_htmlplus.beautify.html_beautify(host.textarea.get('value'), {
                    indent_size: 2,
                    indent_inner_html: true
                }));

        // Hide the editor, and show the textarea.
        var dimensions = {
            width: this.editor.getComputedStyle('width'),
            height: this.editor.getComputedStyle('height')
        };
        this.editor.hide();
        if (!this._codeMirror) {
            this._codeMirror = Y.M.atto_htmlplus.CodeMirror.fromTextArea(host.textarea.getDOMNode(), {
                lineNumbers: true,
                mode: 'htmlmixed',
                tabSize: 2,
                lineWrapping: true
            });

When I add a breakpoint somewhere between the beautify and the CodeMirror creation and continue the script, the codemirror editor shows the beautified code.

Without the breakpoint, the following happens using host.textarea.get('value'): (A) at this moment the textarea value is beautified (B) at this moment the textarea value is NOT beautified

        // (B)
        host.textarea.set('value',
                Y.M.atto_htmlplus.beautify.html_beautify(host.textarea.get('value'), {
                    indent_size: 2,
                    indent_inner_html: true
                }));
        // (A)

        // Hide the editor, and show the textarea.
        var dimensions = {
            width: this.editor.getComputedStyle('width'),
            height: this.editor.getComputedStyle('height')
        };
        // (A)
        this.editor.hide();
        // (A)
        if (!this._codeMirror) {
            // (A)
            this._codeMirror = Y.M.atto_htmlplus.CodeMirror.fromTextArea(host.textarea.getDOMNode(), {
                lineNumbers: true,
                mode: 'htmlmixed',
                tabSize: 2,
                lineWrapping: true
            });
            // (B)

[danowar2k]

I've found the fix and the reason for the neglection of the beautification. I know that this plugin is integrated with Moodle in later Moodle versions, but I'll just open a pull request detailing the fix for other people still using Moodle 3.5.x .