TinyMCE: Wrap the whole block-level selection

In TinyMCE 4, I’ve added a custom editor button to get the current contents of the selection and wrap them in [shortcode][/shortcode]. Pretty straightforward.

onclick: function() {
  var selection = editor.selection.getContent({ 'format' : 'text' });
  editor.insertContent('[shortcode]'+selection+'[/shortcode]');
}

However, if the selected content is in the <blockquote>, the [shortcode] will not wrap the tags.
Furthermore, if the content happens to be

Read More
<blockquote>
  <p style="text-align: center;">
    Content
  </p>
</blockquote>

the [shortcode] will wrap exactly ‘Content’ without any of the tags.

// What happens
<blockquote>
  <p style="text-align: center;">
    [shortcode]Content[/shortcode]
  </p>
</blockquote>

What I’m looking for is a way to wrap the whole block-level contents. Something like the TinyMCE’s block-level format styles work.

// What should happen
[shortcode]
  <blockquote>
    <p style="text-align: center;">
      Content
    </p>
  </blockquote>
[/shortcode]

It would be desired to wrap the whole content block even when just the cursor is placed in it, but it is acceptable to work only with whole text selection.

I’ve tried using 'format': 'html' for .getContent, and also using the .getNode method, but without satisfactory results.

Related posts