Inline styles create empty garbage "cke_bm_" spans

[Sheezwack]

This happens in IE9/Windows 7 at least (other versions not yet tested). It does not happen in FF4/Windows 7.

Problem exists in the current nightly build and 3.6.1 at least.

Steps to reproduce:

1. Open the demo page (​http://ckeditor.com/demo)
2. Highlight the " about" text next to the "fairy tale" link USING THE MOUSE. Make sure the space before "about" is also selected.
3. Change the text color
4. The text color does not change, and empty hidden spans <span id="cke_bm_104S" style="display: none;">&nbsp;</span> are added

Notes:

• This happens with text or background color (possibly other operations as well)
• Strangely it doesn't happen when you highlight " about" with the keyboard, holding shift to highlight.
• I have noticed that empty hidden spans are added in other cases as well, but again it only happens with mouse selection, not if you select with the keyboard.

[Jakub Ś]

1. Open replace by code sample and paste in the following code:

   <p>
   	This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>&nbsp;test version.</p>
   

2. Select word test with a space before
3. Applay text-color or backgrond-color (Only those two cases are affected)

Result:

<p>
	This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor<span id="cke_bm_267S" style="display: none;">&nbsp;</span><span style="display: none;">&nbsp;</span></a>&nbsp;test<span style="display: none;">&nbsp;</span><span id="cke_bm_267E" style="display: none;">&nbsp;</span> version.</p>

Issue has been reproducible in IE9 from CKE 3.2.1

[fastballweb]

I'm having this same issue, but with some key differences:

• I can reproduce it in IE9, Firefox, and Safari
• Keyboard or mouse selection makes no difference

In my case I'm trying to use custom defined styles. To reproduce:

1. Visit my instance of CKeditor 3.6.1 at ​http://editor.crcnachurch.org
2. Paste in the following source:

<h3>
	Test Item 1</h3>
<div class="unfold_body unfold_hidden">
	<p>
		Test Text 1</p>
</div>
<!-- .unfold_body -->
<h3>
	Test Item 2</h3>
<div class="unfold_body unfold_hidden">
	<p>
		Test Text 2</p>
</div>
<!-- .unfold_body -->
<h3>
	Test Item 3</h3>
<div class="unfold_body unfold_hidden">
	<p>
		Test Text 3</p>
</div>
<!-- .unfold_body -->

3. Select first H3 item (Test Item 1)
4. Apply "Unfolder Span" style from Styles dropdown (works)
5. Select second or third H3 item (Test Item 2 or Test Item 3)
6. Apply "Unfolder Span" (doesn't work, adds garbage spans)

[fastballweb]

The process of posting my comment helped me realize that it is the HTML comments in my example that are triggering the bug. This is why it works correctly on the first item. After removing the comments, all items work correctly.

It remains to be seen if this is the same issue, but it does produce the same output of empty spans.

[Garry Yao]

​http://ckeditor.t/tt/8232/1.html

[Garry Yao]

Fixed with [7226].

[Duncan Simey]

The problem described in comment 2 still exists. I've raised a ticket for a general solution. #8732 CKEditor creating hidden spans which can result in hidden content