I'm trying to extend TinyMCE with some custom formats and I've got that working as per http://codex.wordpress.org/TinyMCE_Custom_Styles#Using_style_formats
Basically my custom format is configured like this:
'title' => 'Medium Left',
'block' => 'div',
'classes' => 'article-special article-special-left article-special-medium',
'wrapper' => true
It works fine for everything but elements with processed shortcodes e.g. [caption]. As you know [caption] in the editor looks like this:
<div class="mceTemp">
<dl ...>
<dt ...>
<a ...><img ...></a>
</dt>
<dd ...>caption</dd>
</dl>
</div>
The behavior when selecting a custom format for a block element is described as:
Existing block elements within the selection gets replaced with the new block element.
So when the [caption] element is selected in the TinyMCE editor and I choose my custom format to apply to it I gets added to the outer-most <div class="mceTemp"> like this:
<div class="mceTemp article-special article-special-left article-special-medium">
<dl ...>
<dt ...>
<a ...><img ...></a>
</dt>
<dd ...>caption</dd>
</dl>
</div>
On save TinyMCE ignores the mceTemp div so the end result is as if I didn't apply my custom format.
Now if I insert an image without caption then apply my custom format and add the caption in the end, all is fine. But that's not a workflow I want to enforce.
How can I solve this? I'm working on WP 3.9.1.