Opened 6 weeks ago

Last modified 12 days ago

#16902 confirmed Bug

[iOS] CKEditor editing area scrolls incorrectly when inputting new characters on a scrolled page

Reported by: m-turek Owned by:
Priority: Nice to have (we want to work on it) Milestone:
Component: General Version: 4.7.1 (GitHub - master)
Keywords: iOS Support Cc:

Description

Steps to reproduce

  1. Open CKEditor sample on iOS, Safari. Editor should contain some text and be scrollable. There should be some content on the page above the editor so that whole page is also scrolled.
  2. Scroll the page down to see top of the editor.
  3. Tap on the beginning of editor's text.
  4. Input new characters.

NOTE: The issue appears to be native iOS issue as it can be reproduced without using CKEditor at all. See this code sample: https://codepen.io/mturek/pen/oZwBee The sample presents an iframe with 'contenteditable' body on a page with some text above the iframe. Follow the reproduction steps: 2-4. It is also worth noting that 'scroll' event is not fired on iframes on iOS. Also scrollTop property of an iframe cannot be set and is always equal 0. To workaround these problems iframe is wrapped in a div with fixed height and following css, which enables iframe scrolling:

overflow-y: auto;
-webkit-overflow-scrolling: touch;

Expected result

New characters appear in the editor. Editor is not scrolled. Input text is visible on screen.

Actual result

New characters are input however whole page and the editor is scrolled. Input text is not visible on screen due to wrong scroll position.

Other details (browser, OS, CKEditor version, installed plugins)

Problem has been checked in CKEditor 4.6.2, iOS 10.2, Safari 10.0

Change History (6)

comment:2 Changed 6 weeks ago by m-turek

comment:3 Changed 6 weeks ago by m-turek

Related bug on Webkit's bugzilla: https://bugs.webkit.org/show_bug.cgi?id=139694

comment:4 Changed 6 weeks ago by j.swiderski

  • Status changed from new to confirmed

comment:5 Changed 5 weeks ago by m-turek

Workaround plugin for this issue, work in progress here: https://github.com/cksource/ckeditor-dev/tree/t/16902 No unit tests, tried to simulate this bug with execCommand('insertText') but it doesn't reproduce that way. Only manual test is present because of that.

comment:6 Changed 12 days ago by m.lewandowski

  • Priority changed from Normal to Nice to have (we want to work on it)
  • Version set to 4.7.1 (GitHub - master)

comment:7 Changed 12 days ago by m.lewandowski

Once it's fixed we need to revisit #16896 to see if it's caused by a similar problem.

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