最近在公司的一个项目中引入了 CKEditor5 ,本来想着知名项目应该不会有什么大问题。 但是在发布后,同事测试随手输入一个中文句号,编辑器竟然显示了两个。
然后我就去官网 demo 上测试,也可以复现。
1.Windows 系统下( macOS 等其他系统无法复现)使用浏览器打开 https://ckeditor.com/docs/ckeditor5/latest/examples/builds/classic-editor.html
2.全选清空浏览器的内容(重要步骤)
3.切换到中文符号,键盘输入一个中文句号(。)
(浏览器版本: Microsoft Edge 106.0.1370.52 ,操作系统版本: Windows 11 21H2 )
然后就能得到两个“。”
我目前提了 issue ,但是 CKEditor 的人还没回复。
复现视频:
根据36楼的提示,做了一个简单的处理,目前可以正常输入了。
1、编辑器创建后添加以下代码,为每个段落插入时增加一个零宽字符。
const model = editor.model;
const doc = editor.model.document;
doc.on('change:data',function () {
	const changes = doc.differ.getChanges();
	model.change(function (writer) {
		for (var i = 0; i < changes.length; i++) {
			var entry = changes[i]
			if (entry.type == 'insert' && entry.name == 'paragraph') {
				const paragraph = entry.position.nodeAfter;
				writer.insertText(String.fromCharCode(8203), paragraph, 'end');
			}
		}
	});
});
2、读取编辑器内容时,删除零宽字符。
var data = editor.getData()
data = data.replace(/\u200B/g, '')
     1 
                    
                    Mogugugugu      2022-11-02 10:27:38 +08:00    不只是。,其他的中文标点也存在类似的问题,看上去是和开启了输入法的标点配对差不多,光标自动定位到了两个符号的中间。 
                 | 
            
     2 
                    
                    liubaicai      2022-11-02 10:29:43 +08:00    确实可以复现 
                 | 
            
     3 
                    
                    zzl22100048      2022-11-02 10:31:02 +08:00    你用的什么输入法,windows 自带输入法没有复现 
                 | 
            
     4 
                    
                    edis0n0      2022-11-02 10:32:58 +08:00    试了好多遍都无法复现,系统 Windows 10 LTSC 2021 ,自带的中文输入法 
                 | 
            
     5 
                    
                    chrawsl      2022-11-02 10:37:58 +08:00    实测 edge 有这个毛病,chrome 没有 
                 | 
            
     6 
                    
                    shintendo      2022-11-02 10:39:33 +08:00    Edge 复现成功,Chrome 复现成功,火狐复现失败。 
                Firefox Yes  | 
            
     7 
                    
                    sankemao      2022-11-02 10:43:57 +08:00    复现了,包括拼音输入法输入汉字,存在字母被输两次的情况 
                 | 
            
     8 
                    
                    vone   OP  | 
            
     9 
                    
                    holouser      2022-11-02 10:49:43 +08:00    全角下所有字符都能复现 
                chrome  | 
            
     10 
                    
                    xling      2022-11-02 10:55:47 +08:00    还真的是 
                 | 
            
     11 
                    
                    shintendo      2022-11-02 11:00:11 +08:00    反复测试后补充一下: 
                1.必须是输入框全空时,输入第一个字符为中文符号。 2.非必现,存在一定概率,但概率较高,体感至少 80%触发。 3.输入法应该无关,测试微软拼音和 QQ 拼音均复现。 4.浏览器,很奇怪 Firefox 反复测试都不触发,难道是 Chromium 的锅? 5.用输入法的软键盘输入符号,同样会触发。 6.用拼音打 juhao ,选择候选词中的句号来输入,不会触发。  | 
            
     13 
                    
                    running17      2022-11-02 11:04:44 +08:00    中文的都能复现,跑去看了一下 issues 记录,五月份就有人反馈了相似的 issue ,9 天前已经标记了商业许可用户上报了这个问题了,所以应该很快有 release 解决这个问题了 
                 | 
            
     14 
                    
                    running17      2022-11-02 11:05:00 +08:00     | 
            
     15 
                    
                    wangxiaoaer      2022-11-02 11:06:40 +08:00    微软拼音输入法复现了。 
                 | 
            
     16 
                    
                    hcwhan      2022-11-02 11:08:45 +08:00    linux chrome 未复现 
                 | 
            
     17 
                    
                    timpaik      2022-11-02 11:15:18 +08:00 via Android    firefox yes! 
                 | 
            
     18 
                    
                    sheeta      2022-11-02 11:17:23 +08:00    建议使用 tinymce 
                 | 
            
     19 
                    
                    liuNew      2022-11-02 11:20:46 +08:00    🐮批我的茶 
                 | 
            
     20 
                    
                    ericls      2022-11-02 11:22:59 +08:00 via iPhone    这个东西对 composition 的支持一直都有问题 
                 | 
            
     21 
                    
                    zhuangzhuang1988      2022-11-02 11:31:41 +08:00    天坑,  
                估计官方修改了 会引入别的问题  | 
            
     22 
                    
                    eroko      2022-11-02 11:31:53 +08:00    win10 完全无法复现,试试 tiny 吧 
                 | 
            
     23 
                    
                    SunsetShimmer      2022-11-02 12:20:09 +08:00    Windows 11 Microsoft Edge 版本 107.0.1418.26 (正式版本) (64 位) 未复现 
                 | 
            
     24 
                    
                    superrichman      2022-11-02 12:29:19 +08:00 via Android    ckeditor 的中文输入法兼容问题很早就有了 
                 | 
            
     25 
                    
                    andrew2558      2022-11-02 12:30:51 +08:00    还真是的 
                 | 
            
     26 
                    
                    shakaraka   PRO tinymce 才是高级货好吗。。。 
                 | 
            
     27 
                    
                    ChefIsAwesome      2022-11-02 12:48:43 +08:00 via Android    我捣鼓过不少编辑器。中日韩输入法都容易有 bug 。像拼音,有的平台输入时,没选字之前,是没有内容进入输入框的。而有的平台,你打字的时候,字母就已经进输入框了。英语不存在这种问题,作者自然也懒得管,或者低优先级管。 
                 | 
            
     28 
                    
                    scyuns      2022-11-02 12:59:14 +08:00    windows 11 ,chrome 106.0.5249.119 ,微软输入法, 成功复现! 
                 | 
            
     29 
                    
                    PMR      2022-11-02 13:27:43 +08:00 via Android    CKE 旧版漏洞满天飞 
                新版有空捣鼓下  | 
            
     30 
                    
                    Felldeadbird      2022-11-02 13:28:45 +08:00    不止句号,基本上中文符号都会重复。有时候试下读源码去解决。 
                 | 
            
     31 
                    
                    MoeMoesakura      2022-11-02 13:31:56 +08:00    @ChefIsAwesome 对头,比如 github.dev 之前用 mspy 就有这个情况 
                 | 
            
     32 
                    
                    cslive      2022-11-02 14:05:38 +08:00    win10 ltsc 2021 自带输入法,中文状态,107.0.5304.88 没有复现 
                 | 
            
     33 
                    
                    QKgf555H87Fp0cth      2022-11-02 14:08:34 +08:00    slate yyds 
                 | 
            
     34 
                    
                    IamJ      2022-11-02 18:07:04 +08:00 via iPhone    这个 bug 很久了 
                 | 
            
     35 
                    
                    LiYechao      2022-11-02 19:26:03 +08:00    富文本编辑我选择 Lexical ,ProseMirror 也行 
                 | 
            
     36 
                    
                    of2      2022-11-02 19:32:24 +08:00    https://quilljs.com/ 
                这个也不错啦  | 
            
     37 
                    
                    dsggnbsp      2022-11-02 19:42:12 +08:00    edge google  复现 firefox yes 
                 | 
            
     38 
                    
                    hahahahaha234      2022-11-02 21:28:37 +08:00    win11  中文输入法 chrome 106.0.5249.62 版本 yes 
                 | 
            
     39 
                    
                    lwc645089781      2022-11-03 09:38:01 +08:00    现在版本已经是优化过了,以前连输入文字都会重复。 
                这种情况一般是 顶格输入,就是前面没有字符的时候会出现。有一个临时解决方案就是在输入开头的地方加一个英文的空格, 在 html 里放一个  (或者  ) 用户在这个空格之后输入,就没有问题。  | 
            
     40 
                    
                    vone   OP @lwc645089781 我测试是不止是顶格输入时候会出现,如果另起个新段落(<p></p>)重新输入会再次出现这个 bug 。 
                 |