Opened 6 years ago

Last modified 3 years ago

#11663 review Bug

Input Method Editor(IMEs) didn't work properly in CKEditor with the AutoGrow plugin in IE11

Reported by: Kinny Owned by: Szymon Cofalik
Priority: Normal Milestone:
Component: General Version: 4.3
Keywords: IBM IE11 Support Cc: ChrisGui@…, satya_minnekanti@…

Description

Input Method Editor(IMEs) didn't work properly in CKEditor with the AutoGrow plugin in IE11.

When trying to enter Chinese character using pinyin, the word options list disappeared after typed in the first letter (it didn't wait until I finish typing the whole pinyin) and it auto select the first one on the list.

Tested on the demo page http://ckeditor.com/demo#auto-grow on Windows 7 64bit, IE11.

Steps to reproduce:

  1. Go to Control panel
  2. Select Region and Language, then the Keyboards and Languages tab
  3. Click Change keyboards
  4. Add input language Chinese (Simplified, PRC), Chinese (Simplified) - Microsoft Pinyin New Experience Input St

(Docked the language bar in the taskbar for the easy access)

  1. Open IE 11 and go to the demo page http://ckeditor.com/demo#auto-grow
  2. Switch to Chinese input
  3. In the CKEditor demo, enter "kai"

Noticed that after entered "k", the words option list showed and disappeared and a Chinese character is auto selected and that is not the character I want.

The Input Method Editor works fine on the standard CKEditor, tested on demo page http://ckeditor.com/demo#standard

Attached a screen capture of the editor with AutoGrow plugin and standard editor.

Attachments (1)

IMEsInput.jpg (166.2 KB) - added by Kinny 6 years ago.

Download all attachments as: .zip

Change History (15)

Changed 6 years ago by Kinny

Attachment: IMEsInput.jpg added

comment:1 Changed 6 years ago by Kinny

Keywords: IBM added

comment:2 Changed 6 years ago by Jakub Ś

Keywords: IE11 added
Status: newconfirmed
Version: 4.3.34.3

Problem can be reproduced from CKEditor 4.3 (works fine in 4.3 beta) in IE11 and above TC steps.

comment:3 Changed 6 years ago by Kinny

Similar problem happens to Japanese input as well.

Steps to reproduce:

  1. Go to Control panel
  2. Select Region and Language, then the Keyboards and Languages tab
  3. Click Change keyboards
  4. Add input language Japanese (Japan) - Microsoft IME

(Docked the language bar in the taskbar for the easy access)

  1. Open IE 11 and go to the demo page http://ckeditor.com/demo#auto-grow
  2. Switch to Japanese input and select Hiragana input mode
  3. In the CKEditor demo, enter "nihon", then press Space key twice

Noticed that the words options list showed and disappeared.

The Input Method Editor works fine on the standard CKEditor, tested on demo page http://ckeditor.com/demo#standard.

comment:4 Changed 6 years ago by Jakub Ś

Keywords: Support added

This issue has been also reported on our support channel.

comment:5 Changed 5 years ago by Christophe Guillou

Cc: ChrisGui@… added

comment:6 Changed 5 years ago by Satya Minnekanti

Cc: satya_minnekanti@… added

comment:7 Changed 5 years ago by Kinny

When we can expect a fix for this problem?

comment:8 Changed 4 years ago by Szymon Cofalik

Owner: set to Szymon Cofalik
Status: confirmedassigned

comment:9 Changed 4 years ago by Szymon Cofalik

Status: assignedreview

Fixed on branch:t/11663

I've also pushed branch:t/11663b and branch:t/11663c with alternative solutions (these are not refactored, just proof-of-concept). These solutions should be more accurate when determining content height.

branch:t/11663 will return wrong height only when top or bottom-expanding element has margin bigger than body margin. The error will be between 0 and marginTop + marginBottom of body (by default these are 20px so max error will be 40px).

branch:t/11663b will be exact, except when expanding element is image with float. In this case there will be no margin between the end of editor's editable and bottom bar.

branch:t/11663c is exact, but looks through all nodes so it may be inefficient.

You may use this to test autogrow:

<p style="line-height: 20.7999992370605px; margin-top: 100px;">fasfsafsa<img alt="" src="http://lorempixel.com/g/200/500" style="float: right; width: 200px; height: 500px;" /></p>
<p>fsa</p>
<p>f</p>
<p>asf</p>
Version 1, edited 4 years ago by Szymon Cofalik (previous) (next) (diff)

comment:10 Changed 4 years ago by Piotrek Koszuliński

Status: reviewreview_failed

OK, first things first. To test any of these ideas we need a manual test. Perhaps even a couple of manual tests (may be in one file) with different weird contents and body styling.

comment:11 Changed 4 years ago by Szymon Cofalik

I pushed two manual tests to branch:t/11663, branch:t/11663b, branch:t/11663c

One test is a tc for exactly the bug described in this feature. Second test is more overall test for autogrow plugin.

I also rebased branches with master.

comment:12 Changed 4 years ago by Szymon Cofalik

Status: review_failedreview

comment:13 Changed 4 years ago by Kinny

Any update on this one? I see the status has been set to review for a while already. When we can expect a fix for this problem?

comment:14 Changed 3 years ago by idevsk

I figured out this issues. It's related with 'contentHeight' function. Korean character will be mixed each character. ex) ㅎㅏㄴ should be 한. but, The method 'markerContainer.append(marker)' interrupt to mixed characters.

All of Korean developer have problem to use 'Auto Grow' plugin in C.K.Editor in IE11 Please re check this problem.

Regards.

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