TinyMCE and Bootstrap Modals -- Works only one time

Following the official TinyMCE advice / Sarath Ak's answer above doesn't seem to work for the combination of Bootstrap 4 and TinyMCE 5. One minor change is required to make this solution work again: you will need to change the jQuery closest() lookup to select .tox instead of .mce-window.

$(document).on('focusin', function(e) {
    if ($(e.target).closest(".tox").length) {
        e.stopImmediatePropagation();
    }
});

you can try this

// Prevent Bootstrap dialog from blocking focusin
$(document).on('focusin', function(e) {
  if ($(e.target).closest(".mce-window").length) {
    e.stopImmediatePropagation();
  }
});

https://www.tinymce.com/docs/integrations/bootstrap/


I found that using the below when the modal is closed works perfectly fine:

    $('#modalOne').on('hide.bs.modal', function () {
    tinyMCE.editors=[];
    });

The solution didn't work for me with TinyMCE 5 and Bootstrap 4. In the end I followed Abdur's link and had to use the remove method.

 $('#modalOne').on('hide.bs.modal', function () {
    // scope the selector to the modal so you remove any editor on the page underneath.
    tinymce.remove('#modalOne textarea');
 });