Firefox中如何复制粘贴含自定义元素的contenteditable内容？

嘿各位，

我一直在用gutefrage网站，它用的是修改版的Quill编辑器。按下Enter会新建段落，Shift+Enter触发换行，但换行不是用标准的<br>元素，而是自定义的<gf-br>标签。这给我复制诗歌或者有特定换行格式的文本带来了麻烦——所有换行都会自动转成段落，完全破坏了原格式。

为了解决这个问题，我做了一个预处理工具，在把文本粘贴进编辑器前先做转换：

• 把单个<br>转成<gf-br>
• 把连续的两个<br>转成单个<br>（用来保留段落分隔）

工具的代码如下：

JavaScript #

function modify() { 
  var text = document.getElementById('text').innerHTML; 
  text = text.split(/<br[\s]?[\/]?>[\s]?<br[\s]?[\/]?>/).join('[<[<break>]>]'); 
  text = text.split(/<br[\s]?[\/]?>/).join('<gf-br></gf-br>'); 
  text = text.split('[<[<break>]>]').join('<br />'); 
  document.getElementById('text').innerHTML = text; 
}

CSS #

* { margin: 0; padding: 0; box-sizing: border-box; } 
#btn { width: 100%; height: 10vh; } 
#text { width: calc(100% - 10px); height: calc(90vh - 10px); border: 2px solid #000; margin: 5px; padding: 5px; }

HTML #

<button id="btn" onclick="modify();">Modify</button> 
<div id="text" contenteditable></div>

使用流程是：把任意文本粘贴到可编辑的<div>里，点击Modify按钮，再把结果复制到gutefrage编辑器里。在Chrome里一切正常，但Firefox总是会把<gf-br>这个自定义元素删掉。我试过给<gf-br>标签里加内容，也试过把结果放到不可编辑的元素里——不管怎么做，Firefox都会移除它。

有没有不需要用户脚本的解决办法？如果需要更多细节来排查问题，随时告诉我。

内容的提问来源于stack exchange，提问作者Anonymous