[IE] Text pasted differently than in other browsers

[Satya Minnekanti]

To reproduce the defect:

with config.pasteFromWordRemoveStyles = false & config.pasteFromWordRemoveFontStyles = false copy the text from attached word doc and paste it in to the editor.

Expected Result Text pasted properly and should be same across all browsers

Actual Result we are seeing the differences between IE(6,7,8& 9) & all other browsers.

In IE the top text is shown in bold and big font size where as in other browsers it is shown with small font size and with out bold.

I have attached screen shots of pasted text in IE & FF.

[Jakub Ś]

Could not reproduce the issue.
Perhaps, based on your images, I have created invalid doc.

Could you provide me with a doc you were talking about and tell me in which CKEditor version does this issue occur?

[Satya Minnekanti]

Replying to j.swiderski:

Could not reproduce the issue.
Perhaps, based on your images, I have created invalid doc.

Could you provide me with a doc you were talking about and tell me in which CKEditor version does this issue occur?

@j.swiderski i have attached the word doc that i have used for my testing

[Jakub Ś]

On IE9 and IE8 the red heading is always pasted big.

On IE6 and IE7 if you don't allow for access (dialog shows up) when pasting the red heading is pasted big, otherwise small.

In all other browsers the red heading is always pasted small.

[Wiktor Walc]

It looks like outside IE we do not have an information about the font size.

[Wiktor Walc]

Result after pasting in Chrome 39 (from Office 2010), with ACF disabled:

<div style="border:none;border-bottom:solid #4F81BD 1.0pt;padding:0in 0in 4.0pt 0in;">
<p><span style="color:red;"><span style="font-family:arial,sans-serif;">Sample word doc (Arial size 26)</span></span></p>
</div>

<p><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Arial size 12 font, no indent</span></span></p>

<p style="margin-left:.5in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 1</span></span></p>

<p style="margin-left:1.0in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 2</span></span></p>

<p style="margin-left:1.0in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 2</span></span></p>

<p style="margin-left:.5in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 1</span></span></p>

<ul>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Bullet 1</span></span></li>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Bullet 2</span></span></li>
</ul>

<p style="margin-left:.25in;">&nbsp;</p>

<ol>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Number 1</span></span></li>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Number 2</span></span></li>
</ol>

<p>&nbsp;</p>

Result after pasting in Firefox 34 (from Office 2010), with ACF disabled:

<div style="border:none;border-bottom:solid #4F81BD 1.0pt;padding:0in 0in 4.0pt 0in;">
<p><span style="color:red;"><span style="font-family:arial,sans-serif;">Sample word doc (Arial size 26)</span></span></p>
</div>

<p><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Arial size 12 font, no indent</span></span></p>

<p style="margin-left:.5in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 1</span></span></p>

<p style="margin-left:1.0in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 2</span></span></p>

<p style="margin-left:1.0in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 2</span></span></p>

<p style="margin-left:.5in;"><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Indent level 1</span></span></p>

<ul>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Bullet 1</span></span></li>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Bullet 2</span></span></li>
</ul>

<p style="margin-left:.25in;">&nbsp;</p>

<ol>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Number 1</span></span></li>
	<li><span style="font-family:arial,sans-serif;"><span style="font-size:12.0pt;">Number 2</span></span></li>
</ol>

<p>&nbsp;</p>

Result after pasting in IE11 (from Office 2010), with ACF disabled:

<div style="border-width: medium medium 1pt; border-style: none none solid; padding: 0in 0in 4pt; border-image: none;">
<p style="margin: 0in 0in 15pt;"><span style="font-family: arial,sans-serif;"><span style="color: red;"><span style="font-size: large;">Sample word doc (Arial size 26)</span></span></span></p>
</div>

<p style="margin: 0in 0in 10pt;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Arial size 12 font, no indent</span></span></p>

<p style="margin: 0in 0in 10pt 0.5in;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Indent level 1</span></span></p>

<p style="margin: 0in 0in 10pt 1in;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Indent level 2</span></span></p>

<p style="margin: 0in 0in 10pt 1in;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Indent level 2</span></span></p>

<p style="margin: 0in 0in 10pt 0.5in;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Indent level 1</span></span></p>

<ul>
	<li style="font-style: normal; font-weight: normal;">
	<p style="font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 0pt;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Bullet 1</span></span></p>
	</li>
	<li style="color: rgb(0, 0, 0); font-family: Arial,sans-serif; font-size: 12pt; font-style: normal; font-weight: normal;">
	<p style="color: rgb(0, 0, 0); font-family: Calibri,sans-serif; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 0pt;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Bullet 2</span></span></p>

	<p style="color: rgb(0, 0, 0); font-family: Calibri,sans-serif; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 0pt;">&nbsp;</p>
	</li>
	<li style="font-style: normal; font-weight: normal;">
	<p style="font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 0pt;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Number 1</span></span></p>
	</li>
	<li style="color: rgb(0, 0, 0); font-family: Arial,sans-serif; font-size: 12pt; font-style: normal; font-weight: normal;">
	<p style="color: rgb(0, 0, 0); font-family: Calibri,sans-serif; font-size: 11pt; font-style: normal; font-weight: normal; margin-top: 0in; margin-bottom: 10pt;"><span style="font-size: 12pt;"><span style="font-family: arial,sans-serif;">Number 2</span></span></p>
	</li>
</ul>

<p style="margin: 0in 0in 10pt;">&nbsp;</p>

Result after pasting in IE8 (from Office 2010), with ACF disabled:

<div style="border-bottom: #4f81bd 1pt solid; border-left: medium none; padding-bottom: 4pt; padding-left: 0in; padding-right: 0in; border-top: medium none; border-right: medium none; padding-top: 0in">
<p style="margin: 0in 0in 15pt"><span style="color: red"><span style="font-family: arial, sans-serif"><span style="font-size: large">Sample word doc (Arial size 26)</span></span></span></p>
</div>

<p style="margin: 0in 0in 10pt"><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Arial size 12 font, no indent</span></span></p>

<p style="margin: 0in 0in 10pt 0.5in"><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Indent level 1</span></span></p>

<p style="margin: 0in 0in 10pt 1in"><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Indent level 2</span></span></p>

<p style="margin: 0in 0in 10pt 1in"><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Indent level 2</span></span></p>

<p style="margin: 0in 0in 10pt 0.5in"><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Indent level 1</span></span></p>

<ul>
	<li><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Bullet 1</span></span></li>
	<li><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Bullet 2</span></span></li>
</ul>

<p>&nbsp;</p>

<ol>
	<li><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Number 1</span></span></li>
	<li><span style="font-size: 12pt"><span style="font-family: arial, sans-serif">Number 2</span></span></li>
</ol>

<p style="margin: 0in 0in 10pt">&nbsp;</p>

[Tade0]

Fixed with new Paste From Word plugin in 4.6.0.

[Satya Minnekanti]

This issue still exists in 4.6. I tested on nightly in IE11 Top text in Red shows as big compared to other browser

[Jakub Ś]

@satya I'm not sure why it has been marked as fixed (probably by mistake) but I don't think it can be fixed. If you look at the HTML that browsers sees from this Word file, you will see there is size information for that paragraph in browsers like FF or Chrome:

Firefox

<p class="MsoTitle"><span style="font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;
color:red" lang="EN-US">Sample word doc (Arial size 26)</span></p>

Chrome

<p class="MsoTitle"><span lang="EN-US" style="font-family:&quot;Arial&quot;,&quot;sans-serif&quot;;
color:red">Sample word doc (Arial size 26)<o:p></o:p></span></p>

IE11 and Edge

<p style="margin: 0cm 0cm 15pt;"><span lang="EN-US" style='color: red; font-family: "Arial","sans-serif";'><font size="7">Sample word doc (Arial size 26)</font></span></p>

I think the best solution, would be reopening this ticket and then closing it as "won't fix" because from what I can see, browsers don't handle this properly. What do you think?

[Satya Minnekanti]

@j.swiderski please check TinyMCE ​https://www.tinymce.com/ or Textbox.io ​https://textbox.io/. Both are web based Javascipt editors similar to CKEditor & they don't have this issue

[Jakub Ś]

Yes you are right. If you don't remove the formatting the text is big. I'm reopening the ticket.