Opened 12 years ago

Closed 10 years ago

#252 closed Bug (fixed)

Pasting invalid markup generate empty paragraphs with IE

Reported by: Mike Koepke Owned by:
Priority: Normal Milestone: CKEditor 3.0
Component: General Version: SVN (FCKeditor) - Retired
Keywords: Confirmed IE Cc:

Description (last modified by Alfonso Martínez de Lizarrondo)

I have a customer experiencing problems pasting html code generated by FrontPage into the editor. Taking the following snippet:

<span style="background-color: #FFFFFF">
<div align="center">
<p align="justify"><span style="FONT-WEIGHT: 400"><font size="1"><u><strong>
<font face="Tahoma" color="#cc0000" size="2">Attention</font></strong></u><strong><font face="Tahoma" color="#cc0000" size="2">:</font></strong></font><font size="2" face="Tahoma"> </font>
<font style="MARGIN: 0px" face="Tahoma" size="2"><span style="FONT-WEIGHT: 400; BACKGROUND-COLOR: #ffff00"> Avoid The </span><span style="FONT-WEIGHT: 700; BACKGROUND-COLOR: #ffff00">Costly-Mistakes</span><span style="FONT-WEIGHT: 400; BACKGROUND-COLOR: #ffff00"> That Beginning Real Estate Investors Make When Buying Minnesota Investment Property!</span></font><font face="Tahoma" size="2">
</font> </span></p>
<p align="center"><font size="1"><font color="#CC0000">
<span style="font-weight: 400"><font face="Tahoma" size="4"><strong>&quot;Free 
Investor's Guide Reveals Everything <u>You</u> <em>Need <br>
To Know</em> About Investing In Minnesota Real Estate!&quot;&nbsp;</strong></font></span></font><font style="FONT-SIZE: 1pt" face="Tahoma" color="#283193"><br>
&nbsp;</font><span style="FONT-WEIGHT: 400; FONT-STYLE: italic"><font style="FONT-SIZE: 2pt" face="Tahoma">
</font></span></font></p>
<p align="justify"><font face="Tahoma" size="2">&quot;The Key To <b>Building Wealth</b> And<b> Preparing For Retirement</b> 
By Investing In Minnesota Real Estate -&nbsp;Depends On 
<b>Where</b> You Invest And <b>How</b> <b>Effectively</b> You Manage Your Properties...&quot;&nbsp;</font><br>
<font size="1"><span style="FONT-WEIGHT: 400"><strong style="font-weight: 400">
<font color="#000000" size="2" face="Tahoma">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ~&nbsp;Alex Anderson - Minnesota Investment Property Specialist</font></strong></span></font><font size="2" face="Tahoma">
</font></p>
  1. With IE (7.0) paste above code in source mode
  2. Switch to wysiwyg mode. Text is fine.
  3. Go to source. Beginning source is
    <p><span style="background-color: #ffffff">
    <div align="center">
    <p align="justify">
    
  4. Switch out of source mode. Text still looks right.
  5. Go back to source mode. Beginning source is now
    <p>
    <p>&nbsp;</p>
    </p>
    <div align="center">
    
  6. Switch out of source mode. Text is now 2 lines down
  7. go back to source mode. Beginning text is
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <div align="center">
    
  8. Wysiwyg now shows text 6 lines down.
  9. Toggling back and forth stops the behavior with
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    

With FF 2.0.02 Performing the above tests with FF works correctly. Source reveals:

<p><span style="background-color: rgb(255, 255, 255);">
<div align="center">

with no bizarre behavior as with IE. One small issue though is the above code in FF has the wysiwyg text starting with one blank line at the beginning. With IE in step 2 above, the text was flush at the editor top.

Good one, huh? :-)


    

Change History (7)

comment:1 Changed 12 years ago by Frederico Caldeira Knabben

Description: modified (diff)
Milestone: FCKeditor 2.4.1
Summary: Toggling back and forth between source mode inserts empty paragraphs with IEPasting invalid markup generate empty paragraphs with IE

Inputing invalid markup will certainly generate unpredictable results, not only because of the editor code, but also (and mainly) because of browsers' DOM parsers, which often are buggy (specially IE's).

This is something really hard to handle, because of the hundreds of invalid things to consider. In such cases, it's better to not give access to the source view for users that don't know how to use it properly. I know, sometimes they really want it, so they must also be aware about the consequences.

In the described case, the editor tries to fix things when switching to source the first time. Then, the fix in interpreted in a different way by the browser, and the editor generates a different output again. It continues until the code stabilize and become valid (three times in this case).

I don't see much chances for a fix for now. We could think about a custom HTML parser that fixes the input text, but this is a huge work, with impacts also in the loading performance.

comment:2 Changed 12 years ago by Frederico Caldeira Knabben

Milestone: FCKeditor 3.0

We've been thinking about creating a text parser which generates the source view, based on the editing area innerHTML, which would also make a code cleanup. We are not yet sure we'll be really creating it, but if we go that way, that code could be useful to try to provide a fix for this ticket too.

comment:3 Changed 12 years ago by Alfonso Martínez de Lizarrondo

Description: modified (diff)

comment:4 Changed 12 years ago by Alfonso Martínez de Lizarrondo

Component: UI : Source ViewGeneral
Description: modified (diff)

comment:5 Changed 11 years ago by Wojciech Olchawa

Keywords: Confirmed IE IE7 added

Confirmed with IE and IE7. Work fine with FF2.

comment:6 Changed 11 years ago by Wojciech Olchawa

Keywords: IE7 removed

comment:7 Changed 10 years ago by Frederico Caldeira Knabben

Resolution: fixed
Status: newclosed

This one has been fixed with #3003.

Note: See TracTickets for help on using tickets.
© 2003 – 2019 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy