Font Style doesn't get applied correctly to styled header used together with form element

[jswiderski]

Type of report

Bug

Provide detailed reproduction steps (if any)

1. Setup CKEditor with below configuration:

var editor = CKEDITOR.replace( 'editor1', {
	extraAllowedContent : 'h4{*}'
});

2. Switch to source mode and paste the following HTML

<div>
	<select>
	  <option>Other Languages</option>
	</select>
</div>
<div>
	<h4 style="font-family:arial,sans-serif;">Key Points</h4>
</div>

3. Press Ctrl+A to select all content and change the font name to Comic Sans MS

Expected result

Text style in header gets changed to Comic Sans MS

Actual result

Text style in header doesn't get changed to Comic Sans MS.

To be more precise, with this particular HTML, whole div gets wrapped in span and you will only get select and h4 elements wrapped as expected if you switch to source mode and back or you get data from the editor using getData method.

Problem can be reproduced from CKEditor 4.0.0.

This doesn't happen when h4 has no font-family styling or when select tag is not present.

Other details

• Browser: Firefox, IE11
• OS: Any
• CKEditor version: 4.0.0+
• Installed CKEditor plugins: Font, Forms

[f1ames]

Fixed in d7a2fca.