Opened 7 years ago

Closed 6 years ago

#9136 closed Bug (fixed)

[Webkit] Enter key scrolls down the page when CKEditor is in absolutely-positioned div

Reported by: mike1 Owned by:
Priority: Normal Milestone:
Component: General Version: 3.6.3
Keywords: Webkit Cc:

Description (last modified by Jakub Ś)

Ckeditor 3.6.3 + Windows XP SP3 + latest Chrome browser. When I hit 'Enter' inside the editor, the cursor goes to the next line AND the entire page scrolls down to the end. See the attached sample. Ckeditor 3.6.2 does not have this bug.

This is happening when position: absolute is set on surrounding <div> element or when body has height:100% set or when editor is inside a float element.

Attachments (4)

test.zip (492.8 KB) - added by mike1 7 years ago.
'enter' scrolls down
replacebyclass.html (3.5 KB) - added by Wiktor Walc 7 years ago.
NFUALPHA.htm (1.3 KB) - added by Jakub Ś 7 years ago.
height:100% example
9523_tc.html (826 bytes) - added by Jakub Ś 7 years ago.

Download all attachments as: .zip

Change History (14)

Changed 7 years ago by mike1

Attachment: test.zip added

'enter' scrolls down

comment:1 Changed 7 years ago by Wiktor Walc

Keywords: Chrome added
Status: newconfirmed
Summary: 'Enter' key scrolls down the page[Chrome] Enter key scrolls down the page when CKEditor is in absolutely-positioned div
Version: 3.6.3

Broken by [7399].

Use the attached replacebyclass sample to reproduce. When position: absolute is removed from surrounding <div> element, everything works as expected.

Changed 7 years ago by Wiktor Walc

Attachment: replacebyclass.html added

comment:2 Changed 7 years ago by Jakub Ś

#9044 was marked as duplicate

comment:3 Changed 7 years ago by Brad

Please fix this soon. I am experiencing the same issue. Some more details that I've noticed are that the problem doesn't happen unless the bottom of the CKEditor text area is out of view in the browser window. Also, the cursor seems to stay in the same position on the page once the whole page starts scrolling, until the bottom of the page is hit and it can't scroll down anymore.

comment:4 Changed 7 years ago by David

I've discovered this also occurs when height: 100% is set on the html and body tags of the parent HTML page, which is a fairly common occurrence.

To reproduce:

  1. Visit ckeditor.com/demo
  2. Shrink your browser window so a sizeable scrollbar is shown
  3. Using the inspector tool, add "style='height: 100%' " to the html tag and body tag
  4. Place your cursor in CK Editor and press enter

In certain cases workaround to height:100% might be usage of height:auto;.

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

comment:5 Changed 7 years ago by Jakub Ś

Description: modified (diff)

Changed 7 years ago by Jakub Ś

Attachment: NFUALPHA.htm added

height:100% example

comment:6 Changed 7 years ago by Jakub Ś

Description: modified (diff)
Keywords: Webkit added; Chrome removed
Summary: [Chrome] Enter key scrolls down the page when CKEditor is in absolutely-positioned div[Webkit] Enter key scrolls down the page when CKEditor is in absolutely-positioned div

Changed 7 years ago by Jakub Ś

Attachment: 9523_tc.html added

comment:7 Changed 7 years ago by Jakub Ś

#9523 was marked as duplicate.

comment:8 Changed 7 years ago by Thijs

I managed to resolve this issue by adding these lines in CKEditor/trunk/_source/core/dom/element.js on line 1418

if ( parent.is( 'body' ) )
{
	overflowed = false;
}

comment:9 in reply to:  8 Changed 7 years ago by Sergey

Replying to thijs:

I managed to resolve this issue by adding these lines in CKEditor/trunk/_source/core/dom/element.js on line 1418

if ( parent.is( 'body' ) )
{
	overflowed = false;
}

Could you specify please surrounding lines?

comment:10 Changed 6 years ago by Jakub Ś

Resolution: fixed
Status: confirmedclosed

I have checked test case files attached to this ticket and issue seems to be working fine in latest Webkit and CKEditor 4.1.2. I'm closing this issue as fixed.

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