Cannot initialize TinyMCE on target node: loading stylesheet crashes

Viewed 199

I'm trying to initialize TinyMCE on an existing DOM element like this:

    tinymce.init({
        target: editorNode,
        menubar: true,
        inline: true
   });

This fails, with the following error in the console:

tinymce.js:3193 Uncaught TypeError: Cannot read property 'length' of undefined
    at tinymce.js:3193
    at wait (tinymce.js:3182)
    at HTMLLinkElement.waitForWebKitLinkLoaded (tinymce.js:3191)

When I debug this, it looks like TinyMCE is trying to load style sheets (which is fine), but it is using the target element as documentOrShadowRoot to call

    var styleSheets = documentOrShadowRoot.styleSheets;
    var i = styleSheets.length;

This obviously fails, because that's not where the stylesheets are kept.

Any ideas what I'm doing wrong?

1 Answers

I've had the same error, when I was adding editor in new modal window. Try to attach editorNode to the DOM first, then invoke tinymce, or just delay tinymce initialization, e.g:

setTimeout(function() {
    tinymce.init({
        (...)
        target : editorNode
    })
}, 10);

This solved issue in my case. :)

Related