Opened 13 years ago

Closed 11 years ago

Last modified 11 years ago

#7146 closed Bug (fixed)

WebKit: pasting block elements results in an extra div

Reported by: Wiktor Walc Owned by:
Priority: Normal Milestone:
Component: Core : Pasting Version: 3.0
Keywords: WebKit IBM VendorFix Cc: satya_minnekanti@…

Description

Confirmed on both Safari and Chrome, on Mac and Windows.

Steps to reproduce

  • start with
    <h1>
             Heading1</h1>
    
  • copy the first line, press enter and paste it below
  • result: heading is surrounded with a div tag.
<h1>
        Heading1</h1>
<p>
        &nbsp;</p>
<div style="font-family: Arial, Verdana, sans-serif; font-size: 12px;
color: rgb(34, 34, 34); background-color: rgb(255, 255, 255); ">
        <h1>
                Heading1</h1>
</div>

The result in Chrome 9.0.597.94 is similar, but note the extra <meta> tag:

<h1>
        Heading1</h1>
<p>
        &nbsp;</p>
<meta charset="utf-8" />
<div style="font-family: Arial, Verdana, sans-serif; font-size: 12px;
color: rgb(34, 34, 34); background-color: rgb(255, 255, 255); ">
        <h1>
                Heading1</h1>
</div>

Attachments (2)

7146.patch (1.1 KB) - added by Garry Yao 13 years ago.
screen.png (59.8 KB) - added by Jakub Ś 12 years ago.

Download all attachments as: .zip

Change History (29)

comment:1 Changed 13 years ago by Wiktor Walc

Status: newconfirmed

comment:2 Changed 13 years ago by Wiktor Walc

Keywords: WebKit added

Looks like a similar issue to #6194.

comment:3 Changed 13 years ago by Garry Yao

Not a heading specific issue, a reduced TC:

  1. Load any sample page, select all doc content and copy to clipboard.
  2. Open new paragraph, paste into it;
    • Actual Result: an extra div's wrapping around copied content;

Changed 13 years ago by Garry Yao

Attachment: 7146.patch added

comment:4 Changed 13 years ago by Garry Yao

Owner: set to Garry Yao
Status: confirmedreview

It's a pity that even the comments inline had aware of the bug but not the codes ;/

comment:5 Changed 13 years ago by Wiktor Walc

Status: reviewreview_failed

Note that if you change the background color in contents.css into any other than white (e.g #eee), Safari will use the same background-color in this extra div element:

<div style="font-family: Arial, Verdana, sans-serif; font-size: 12px; color: rgb(34, 34, 34); background-color: rgb(238, 238, 238); ">

comment:6 Changed 13 years ago by Garry Yao

#6783 marked as a DUP.

comment:7 Changed 13 years ago by Satya Minnekanti

Cc: satya_minnekanti@… added
Keywords: IBM added

comment:8 in reply to:  5 Changed 13 years ago by Garry Yao

Owner: Garry Yao deleted
Status: review_failednew

Replying to wwalc:

Note that if you change the background color in contents.css into any other than white (e.g #eee), Safari will use the same background-color in this extra div element:

<div style="font-family: Arial, Verdana, sans-serif; font-size: 12px; color: rgb(34, 34, 34); background-color: rgb(238, 238, 238); ">

In that case it's difficult to find a proper way to determinate such an extra div, we might need to wait for a Webkit fix eventually.

comment:9 Changed 13 years ago by Jakub Ś

Similar (perhaps related) issue #6366

comment:10 Changed 13 years ago by Jakub Ś

Status: newconfirmed

Bug reported by @garry.yao to Webkit - https://bugs.webkit.org/show_bug.cgi?id=61779

As agreed with @wwalc I'm confirming this ticket.

comment:11 Changed 13 years ago by Garry Yao

The fixing of this bug has been planned in the new pasting system of v4 thus is not likely to be resolved in recent milestones.

comment:12 Changed 13 years ago by Garry Yao

Keywords: VendorFix added

comment:13 in reply to:  12 Changed 13 years ago by Satya Minnekanti

Replying to garry.yao:

@garry.yao could you please add the ticket that you logged with Safari & Chrome for this issue

comment:14 Changed 13 years ago by Frederico Caldeira Knabben

@satya, please check previous comments.

comment:15 Changed 12 years ago by Jakub Ś

This ticket was duplicated in #5394

comment:17 Changed 12 years ago by Jakub Ś

#6366 was marked as duplicate.

The same thing happens when you drag the contents from one editor to another.

comment:20 Changed 12 years ago by Jakub Ś

This is Webkit pasting problem and also our problem.

When you paste something from Notepad in Webkit or when you paste HTML it gets wrapped in Divs. When you have your enter mode set to default ENTER_P (paragraph) those Divs get pasted inside this paragraph.
This can be confirmed when looking at elements path and when viewing the code with Chrome developer tools (Please check the attached screen.png)
This invalid code gets fixed when switching to source or getting the data from editor (when HTML data processor is called). That is why users get impression that extra p is added.

For the above example with heading scenario is acctually the same. You paste Heading wrapped in Div into Heading what results in:

<h1><div style="font-family: Arial, Verdana, sans-serif; font-size: 12px; color: rgb(34, 34, 34); background-color: rgb(255, 255, 255); ">
	<h1>
		Heading1</h1>
</div></h1>

This gets fixed when you swich to source mode and the result is:

<h1>
	&nbsp;</h1>
<div style="font-family: Arial, Verdana, sans-serif; font-size: 12px; color: rgb(34, 34, 34); background-color: rgb(255, 255, 255); ">
	<h1>
		Heading1</h1>
</div>

Note that with the above example extra paragraph at the bottom is generated - it was described here: #8231 .

NOTE: This will be fixed in version 4 of editor which will soon be introduced.

Changed 12 years ago by Jakub Ś

Attachment: screen.png added

comment:21 Changed 12 years ago by Jakub Ś

Other tickets that also concern pasting in Webkit: #6436 and #6131

Last edited 12 years ago by Jakub Ś (previous) (diff)

comment:22 Changed 12 years ago by Jakub Ś

Original ticket is no longer reproducible in Chrome 18 but there is a way to still reproduce it. All you have to do is copy element like p or h1 with new line

TC taken from #8932:

  1. Content in the editor:
    <p>This is some <strong>sample text</strong>. You are using <a href="http://ckeditor.com/">CKEditor</a>.</p>
    
  2. Insert new paragraph at the end (hit return)
  3. Select all (Ctrl+A) and copy (Ctrl+C)
  4. Go to the end of the editor (the blank line)
  5. Paste in the text (Ctrl+V) several times

comment:23 Changed 12 years ago by Jakub Ś

#9051 was marked as duplicate.

comment:24 in reply to:  22 Changed 11 years ago by Piotrek Koszuliński

Replying to j.swiderski:

Original ticket is no longer reproducible in Chrome 18 but there is a way to still reproduce it. All you have to do is copy element like p or h1 with new line

This issue is no longer reproducible in v4.

comment:25 Changed 11 years ago by Jakub Ś

#9257 was markes as duplicate.

Comment from that ticket -

Because that's Safari's 5 problem. I believe that it was occurring in old version of Chrome, but was fixed in Webkit's version released between Safari 5 and Safari 6 (so it's also fixed in Safari 6).

comment:26 Changed 11 years ago by Piotrek Koszuliński

Resolution: fixed
Status: confirmedclosed

This issue definitely isn't reproducible any more.

comment:27 in reply to:  26 Changed 11 years ago by Satya Minnekanti

Replying to Reinmar:

This issue definitely isn't reproducible any more.

This is still reproducible in Safari on latest 4.x nightly builds as well. Please re-open this defect

comment:28 Changed 11 years ago by Piotrek Koszuliński

On which version of Safari?

comment:29 in reply to:  28 Changed 11 years ago by Satya Minnekanti

Replying to Reinmar:

On which version of Safari?

On Safari 5.1.2 & 5.1.7

comment:30 Changed 11 years ago by Piotrek Koszuliński

I can reopen this ticket but we're not going to fix this issue, because it has been fixed in Webkit many months (years?) ago, so both - Chrome and Safari 6 work correctly. It would be pointless to keep this ticket until we drop support for Safari 5.

Nota bene - since CKEditor 4.1 when editor is initialized without div support (removed div plugin or div button from toolbar) this issue will be fixed by the ACF (see #9829).

Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy