1

说明:当我在当前光标位置将自定义链接添加到平板编辑器并在插入的链接后使用制表符或空格时引发错误。

这是我用来将我的自定义链接 DOM 元素添加到当前光标位置的 slate 编辑器中的代码。

window.addEventListener("message", (event) => {
  var linkDOMElement = document.getElementById('insertLink');
  if (!linkDOMElement) {
    var range;
    if (event.data && (typeof event.data === 'string' || event.data instanceof String) && event.data.includes("atProspectId") && window.getSelection) {
      var range = window.getSelection().getRangeAt(0);
      var html = event.data;

      // create a span dom element
      var newElement = document.createElement('span');
      newElement.id = 'insertLink';
      newElement.innerHTML = html;

      // insert created dom element named newElement at current cursor position
      range.insertNode(newElement);
    }
  }
}, false);

场景:我们有一个脚本将我们的自定义图标附加到外展电子邮件编辑器,显然外展电子邮件编辑器使用石板编辑器。单击此图标后,它会在新选项卡中打开我们的扩展应用程序[暂时]。如果用户单击“INSERT LINK”按钮,则应将链接插入到当前光标位置,这正如预期的那样。但是,我无法单击链接并在插入后进一步编写任何文本。如果我在链接插入后使用空格或制表符,则会出现此错误。您可以在随附的视频中清楚地看到这一点。

环境:

Slate 版本:不知道,因为这发生在第三方网站操作系统:Windows 浏览器:Chrome

要查看上述错误是如何引发的,您可以单击以下链接并观看 43 秒视频。

https://user-images.githubusercontent.com/86764119/146716602-657bf5ce-535a-4bdb-bb36-64c3fbb8d548.mp4

4

0 回答 0