WP Editor does not Initialize Correctly When Form Elements are Removed from the DOM

I finally figured out what the issue was. Apparently, when you remove the textarea element from the DOM, you also need to remove the wp editor that has been attached to it. (if you decide to re-add the textarea to the DOM later) I found out that even though the textarea is successfully removed, its id is still stored in the tinyMCEPreInit object and this causes problems with the dynamic wp editor initialization. Removing the wp editor with its corresponding textarea id fixed the issue for me:

function removeStep() {
    const steps = document.getElementsByClassName('step');
    const lastStep = steps[steps.length - 1];
    const lastTextArea = lastStep.getElementsByClassName('form-field')[1];
    lastStep.remove();
    if (typeof wp.editor != "undefined") {
        wp.editor.remove(lastTextArea.id);
    }
    counter--;
}

Leave a Comment