bonafideduck / react-highlight-within-textarea

React component for highlighting bits of text within a textarea
93 stars 13 forks source link

Cannot read properties of undefined (reading 'start') #176

Open wangdiee opened 1 year ago

wangdiee commented 1 year ago

When I typed with the keyboard, the last demo you provided which called 'Unwrap and Use Draft.js Directly' have an error. And The same problem occurs in my project. image

josh-zhu commented 1 year ago

same issue, how to fix it

bonafideduck commented 1 year ago

I cannot reproduce this. I did this:

  1. Click the [Edit in code sandbox] link.
  2. Typed in the text input.

Did you do something different. Also note that the code shown in the demo page is a copy of the actual code and may have bugs in it. If you started with what is on the demo page, I’ll look to see what is wrong there and fix it.

josh-zhu commented 1 year ago

use a chinese input, and it can reproduce this issue in the selection part in Edit in code sandbox link, shows: Invalid selection state. {0: EditorState, 1: "9b4pp-18-0", 2: 12, 3: "9b4pp-18-0", 4: 12} {allowUndo: true, currentContent: Object, decorator: CompositeDraftDecorator, directionMap: Object, forceSelection: false…}

wangdiee commented 1 year ago

When I input Chinese and it is a very long text, this kind of problem will appear. I learned that it is the reason of createDecorator. Now I don’t use it anymore, but implement keywords through the highlight decorator officially given by draftjs highlight.

bonafideduck commented 1 year ago

I’m glad you have a solution. I’d still like to see if I can fix this. Can it be reproduced by pasting one long buffer and then a short buffer? If so, do you have a sample that I can copy?

wangdiee commented 1 year ago

I don't have other examples, I can still reproduce this problem using the last demo you provided. Maybe you can try to use the keyboard to continuously input a string of Chinese. This problem will definitely reappear.

I recorded a video just for reference

https://user-images.githubusercontent.com/63644246/233882639-f1039ad7-755a-4f7a-9277-45c73b55fec9.mov

bonafideduck commented 1 year ago

@wangdiee , I made some recent changes to the decorator generation code. I don't know if (or why it might) fix your issue, but I'm not seeing it if I paste the following in multiple times:

翻译是通过的目标语言文本来传达源语言文本的含义。[](https://en.wikipedia.org/wiki/Meaning_(linguistic))[1]英语在翻译(书面文本)和口译(不同语言的用户之间的口头或签名交流)之间进行了术语区分(并非每一种语言都存在);根据这种区别,翻译只有在语言社区内出现写作后才能开始。 翻译者总是有可能无意中将源语言单词、语法语法引入目标语言渲染中。另一方面,这种“溢出”有时会导入有用的源语言calquesloanwords,这些词汇丰富了目标语言。翻译人员,包括早期神圣文本的翻译人员,帮助塑造了他们翻译的语言。[2] 由于翻译过程的费力,自20世纪40年代以来,人们一直在努力实现翻译自动化机械地帮助人工翻译,并取得了不同程度的成功。[3]](https://en.wikipedia.org/wiki/Translation#cite_note-3)最近,[互联网](https://en.wikipedia.org/wiki/Internet)的兴起促进了[翻译服务](https://en.wikipedia.org/wiki/Translation_services)[的全球市场](https://en.wikipedia.org/wiki/World-wide_market),并促进了“[语言本地化](https://en.wikipedia.org/wiki/Language_localisation)”。[[4]](https://en.wikipedia.org/wiki/Translation#cite_note-4)

bonafideduck commented 1 year ago

I was also able to paste this with no issues:

一天早上,在我获得自由大约两周后,负责私人事务的首席秘书(他们这样称呼他)雷德雷萨尔来到我家,只有一名仆人陪同。 他命令他的马车在远处等候,并希望我陪他一个小时。 我欣然同意,因为他的品格和个人优点,以及他在我向法庭求情期间为我提供的许多帮助。 我提议躺下,这样他可以更方便地靠近我的耳朵,但他宁愿在我们谈话时让我握住他的手。 他开始称赞我的自由; 说:“他可能会假装在这方面有一些优点;” 但是,然而,补充说,“如果不是因为目前宫廷的情况,我可能不会这么快就得到它。因为,”他说,“就像我们看起来的那样繁荣 对外国人来说,我们在两种强大的邪恶之下劳作:国内的暴力派系,以及来自国外的最强大敌人入侵的危险。至于第一种,你要明白,在过去的大约七十个月里, 在这个帝国中,有两个相互斗争的政党,他们的名字是 Tramecksan 和 Slamecksan,他们从鞋子的高跟鞋和低跟鞋上区分自己。据说,确实,高跟鞋最适合我们古老的体质; 但是,无论如何,国王陛下已决定在政府行政和王室的所有职位中只使用低跟鞋,这一点你不能不观察到;特别是国王陛下的帝国高跟鞋在 至少比他的宫廷中的任何一个都差 drurr(drurr 是大约 14 英寸的单位)。 两党积怨甚深,不吃不喝,不言不语。 我们计算出 Tramecksan 或高跟鞋的数量超过我们; 但权力完全在我们这边。 我们担心皇太子殿下有穿高跟鞋的倾向; 至少我们可以清楚地发现他的一只脚后跟比另一只高,这使他步态蹒跚。 现在,在这些肠子的不安之中,我们面临着来自不来夫斯库岛的入侵威胁,这是宇宙中的另一个伟大帝国,几乎与他的陛下一样强大。 至于我们听到你证实的,世界上还有其他王国和国家居住着和你一样大的人类,我们的哲学家对此深表怀疑,宁愿推测你是从月球上掉下来的,或者是从月球上掉下来的 星星; 因为可以肯定的是,你们中的一百个凡人会在短时间内摧毁他陛下统治下的所有水果和牲畜:此外,我们六千个月的历史除了 Lilliput 的两个伟大帝国之外没有提到任何其他地区 和不来夫斯库。 哪两个强大的力量,正如我要告诉你的那样,在过去的六个和三十个月内进行了一场最顽固的战争。 它开始于以下场合。 所有人都承认,在我们吃鸡蛋之前,打破鸡蛋的原始方式是在较大的一端; 但是现在陛下的祖父,当他还是个孩子的时候,按照古老的习俗去吃一个鸡蛋,然后打破它,碰巧割伤了他的一根手指。 于是,他的父亲皇帝下了一道诏书,命令他的臣民在重刑的情况下打破他们鸡蛋的小端。 人们对这项法律非常反感,历史告诉我们,为此曾发生过六次叛乱; 其中一位皇帝失去了生命,另一位皇帝失去了王冠。 不来夫斯库的君主不断煽动这些内乱。 当他们被镇压时,流亡者总是逃往那个帝国避难。 据计算,一万一千人曾数次遭受死亡,而不是在较小的一端打破他们的鸡蛋。 关于这场争论,已经出版了数百卷巨著:但大端派的书籍长期以来一直被禁止,法律规定整个党派都不能就业。 在这些麻烦的过程中,布莱夫斯卡的皇帝确实经常受到他们的大使的劝告,指责我们在宗教中制造分裂,因为我们在 Blundecral 的第五十四章中冒犯了我们伟大的先知 Lustrog 的基本教义( 是他们的 Alcoran)。 然而,这被认为只是对文本的一种压力; 因为话是这样的:“所有真正的信徒都在方便的一端打破他们的鸡蛋。” 哪一个是方便的结局,依我愚见,似乎留给每个人的良心,或者至少由首席法官决定。 现在,Big-endian 流亡者在 Blefuscu 宫廷的皇帝那里获得了如此多的信任,并从他们在国内的政党那里得到了如此多的私人帮助和鼓励,以至于一场血腥的战争已经结束在两个帝国之间进行了六个又三十个月,取得了各种成功; 在此期间,我们损失了四十艘主力舰和更多的小型船只,以及三万名最优秀的海员和士兵。 敌人受到的伤害估计比我方大一些。 不过,他们现在已经装备了数量众多的舰队,正准备向我们袭来; 皇上陛下对您的勇气和力量充满信心,命令我向您报告他的事务。” 认为我这个外国人不会干涉派对; 但我已经准备好,冒着生命危险,保卫他的人身和国家免受所有侵略者的侵害。”