前端大佬进，我发现了一个 CKEditor5 非常容易复现且长期存在无人修复的 BUG

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

• 请不要在回答技术问题时复制粘贴 AI 生成的内容

这是一个创建于 781 天前的主题，其中的信息可能已经有所发展或是发生改变。

最近在公司的一个项目中引入了 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 的人还没回复。

复现视频：

https://user-images.githubusercontent.com/17821872/198577151-fb5b5125-515d-4e6d-a4e6-2f03018aca6a.mp4

第 1 条附言 · 2022-11-02 11:00:06 +08:00

补充一下：使用的是系统自带的微软拼音

我上周跟同事说了国产富文本编辑器都是垃圾，只有这个才是高级货。

现在好尴尬！

目前打算在change事件里面replace一下（"。。"=>"。"），先把这个问题应付过去。

第 2 条附言 · 2022-11-03 12:22:51 +08:00

根据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, '')

第 3 条附言 · 2022-12-26 09:41:56 +08:00

官方回复问题已修复。

In version 35.3.0 we introduced enhancements and fixes for IME, so this bug should be already fixed.

https://github.com/ckeditor/ckeditor5/releases/tag/v35.3.0

复现

ckeditor5

浏览器

中文

40 条回复 • 2022-11-03 10:01:50 +08:00

Mogugugugu

2022-11-02 10:27:38 +08:00

不只是。，其他的中文标点也存在类似的问题，看上去是和开启了输入法的标点配对差不多，光标自动定位到了两个符号的中间。

liubaicai

2022-11-02 10:29:43 +08:00

确实可以复现

zzl22100048

2022-11-02 10:31:02 +08:00

你用的什么输入法，windows 自带输入法没有复现

edis0n0

2022-11-02 10:32:58 +08:00

试了好多遍都无法复现，系统 Windows 10 LTSC 2021 ，自带的中文输入法

chrawsl

2022-11-02 10:37:58 +08:00

实测 edge 有这个毛病，chrome 没有

shintendo

2022-11-02 10:39:33 +08:00

Edge 复现成功，Chrome 复现成功，火狐复现失败。
Firefox Yes

sankemao

2022-11-02 10:43:57 +08:00

复现了，包括拼音输入法输入汉字，存在字母被输两次的情况

vone

2022-11-02 10:45:25 +08:00

@Mogugugugu 我测试是有：。 [] ￥三个字符存在这个问题

@zzl22100048 微软拼音

@chrawsl 我这边使用 Chrome 106.0.5249.121 可以复现

holouser

2022-11-02 10:49:43 +08:00

全角下所有字符都能复现
chrome

xling

2022-11-02 10:55:47 +08:00

还真的是

shintendo

2022-11-02 11:00:11 +08:00

反复测试后补充一下：
1.必须是输入框全空时，输入第一个字符为中文符号。
2.非必现，存在一定概率，但概率较高，体感至少 80%触发。
3.输入法应该无关，测试微软拼音和 QQ 拼音均复现。
4.浏览器，很奇怪 Firefox 反复测试都不触发，难道是 Chromium 的锅？
5.用输入法的软键盘输入符号，同样会触发。
6.用拼音打 juhao ，选择候选词中的句号来输入，不会触发。

shintendo

2022-11-02 11:00:43 +08:00

@vone 不止三个，所有中文符号都会触发