Javascript BiDi语境中的文本插入符号行为

我很难理解现代浏览器如何使用BiDi/RTL文本在

contenteditable

上下文中处理插入符号

这个问题的目的不是如何解决一个具体问题，而是更多地决定采用哪种方法（在更广泛的背景下）

我正在开发一个JS文本编辑器，它应该可以处理BiDi文本和自定义“标记”

例如：

我在这里做了一个简单的测试，以测试下面描述的一些情况：

你好，世界

现代浏览器对BiDi的支持还远远不够完美。我发现了一些在Chrome中处理不正确的事情（还没有在Safari和Firefox中测试每个案例）：

我没有找到任何有效的方法来控制中性/弱方向字符在BiDi上下文中的显示方式。因此，使用具有特定文本方向（

dir

属性）的跨距（参见上面的示例）

在RTL上下文中，设置

dir=“RTL”

属性是不够的：插入符号的方向是向后的（=与LTR上下文的方向相同，这是错误的）。奇怪的是，范围对象内的偏移是正确的

在

contenteditable

元素中，使用箭头键从RTL跳到LTR元素，反之亦然，插入符号似乎跳过一个位置。正如您在上面的JSFIDLE中所看到的，您无法让插入符号在RTL范围的末尾移动，因为它在父div的开头跳转（开始=元素的结尾，因为它的方向是RTL）

通过箭头键的导航已中断（您无法在包含“世界”的范围内移动）

对于其中一些行为，我已经找到了解决方案，只需捕获“keydown”事件并强制插入符号按预期的方式移动即可。无论如何，这并不能解决上述所有问题，而是引入了新的问题

我想问的是：

我查看了TinyMCE和其他WYSIWYG编辑器，从中我可以看到他们使用了某种假插入符号。这是解决这些矛盾的唯一方法吗？我应该如何实施它

考虑到浏览器的变化和将来不可避免地引入的bug，解决方案是否足够保守

注：浏览器兼容性不是我主要关心的问题：IE、Edge、Opera等将不受设计支持

<div contenteditable id="editor" dir="rtl"><span class="text" dir="ltr">Hello</span><span class="text" dir="rtl">مرحبا</span><span class="text" dir="ltr">world</span></div>