How do you set the focus of a TinyMCE textarea element?

Question

I\'m using TinyMCE for a textarea on a page but it doesn\'t play nice in the tabbing order of the other elements.

I can use the following code to capture when I tab

Answer 1

TinyMCE 4.7.4

None of the above worked for me, subscribing to TinyMCEs init event did work:

const elTinyMce = tinyMCE.get('your_textarea_id');
// (optional) This is not necessary.
// I do this because I may have multiple tinymce elements on my page
tinyMCE.setActive(elTinyMce);
elTinyMce.on('init', function () {
    // Set the focus
    elTinyMce.focus();
    // (optional) Select the content
    elTinyMce.selection.select(
        elTinyMce.getBody(),
        true
    );
    // (optional) Collapse the selection to start or end of range
    elTinyMce.selection.collapse(false);
});

Note: focusing on elements doesn't always work if you have the browsers developer tools open. You may be forcing the focus away from the page because a browser can only have one focus. This solution for example doesn't work either if you have developer tools open.