4

记录CKEditor4删除文本引起文本分割而升级版本的经历

 1 year ago
source link: https://www.daozhao.com/10594.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

记录CKEditor4删除文本引起文本分割而升级版本的经历

如果您发现本文排版有问题,可以先点击下面的链接切换至老版进行查看!!!

记录CKEditor4删除文本引起文本分割而升级版本的经历

前段时间对接了一个electron壳提供功能————拼写检查,也就是在输入的英文有问题的时候,给予红色波浪线提示,邮件的时候能出现候选词,选择候选词后进行替换。

在功能上线当天上午产品经理发现邮件的富文本编辑器CKEditor内部分场景无法正常简写拼写替换。。。

我们输入正确的英文单词Successfully,此时不会有红色波浪线,符合预期,但是如果此时在中间删掉一个字母(比如u),使其变成错误的单词Successflly,这时能出现波浪线,但是在点击右键,准备读取候选词的时候会出现错误。

file

考虑到写完单词后再进行删除这一操作还算是个很平常的使用场景,加上临近上线了,决定先暂停右键菜单里面的拼写检查入口。

我们是在最后面的单词y那里点击邮件的,此时自动选中的只有后面的lly,而不是预期的Successflly,因此右键菜单里面的候选词也就不符合预期了,因为候选词是根据此时选中词lly给出的。

因为拼写检查的大部分功能我们都不可控,都是chrome提供的,我们需要看下为什么引起chrome自动选词“错误”。

经查发现原来是我们在删除字母u的时候,编辑器将之前的单词由一个文本分成了两个文本节点。虽然在表象上看是一个文本Successflly,但实际上是Successflly两个文本。

file

所以我们chrome在自动选词的时候就只选择了后面的lly,如果我们再前面的波浪线处,点击鼠标右键,这时就只会选中前面的。

file

这类问题多半是由编辑器底层的机制决定的,所以我们首先区官网看看,看看官网的demo里面的编辑器是不是也有类似的问题,试了下并没有,再看版本,官网的是最新版本4.19.0,我们项目中用的是4.17.0,下载4.17.0的官网版本试试,也有类似的问题,据此我们尝试升级自己项目的CKEditor版本为4.19.0,最后问题解决。

file

对于这类我们使用第三方库发现问题场景,建议大家也安装类似的步骤排障和解决问题

  • 官网验证确认官方是否存在该问题
  • 官网没问题就验证项目当前版本(一般可能会比官网的版本低)对应的官网版本是否存在该问题
  • 逐步验证是否是自己的插件或其它改动引起问题
  • 自己尝试修复或者给官方提Issue

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK