Prevent TinyMCE from removing span elements

Question

Here is the problem demonstration

You can try it here: http://fiddle.tinymce.com/SLcaab

This is TinyMCE default configuration

• less all the plugins
• with extended_valid_elements: "span"

1 - Open the Html Source Editor

2 - Paste this html into the Html Source Editor:

<p><span>Hello</span></p>
<p><a href="http://www.google.com">Google 1</a></p>
<p><a href="http://www.google.com">Google 2</a></p>

3 - Click update in the Html Source Editor to paste the html in the editor

4 - Remember there is a span around 'Hello'.

5 - Place your cursor just before Google 2 and press backspace (the two links should merge inside the same paragraph element).

6 - Look at the resulting html using the Html Source Editor.

Result (problem): No more span in the html document even though we added 'span' to the extended_valid_elements in the TinyMCE settings.

Note: I removed all the plugins to make sure the problem is at the core of TinyMCE.

Edit 1 - I also tried: valid_children : "+p[span]" - still does not work

Edit 2: Only reproduced on WebKit (OK on Firefox and IE)

Answer 1

Insert extended_valid_elements : 'span' into tinymce.init:

tinymce.init({
    selector: 'textarea.tinymce',
    extended_valid_elements: 'span',
    //other options
});

Answer 2

I was having same issue. empty SPAN tags are being removed. The solution i found is

verify_html: false,