ckeditor5-自定义容器元素-粘贴时递归错误

Question

我正在尝试创建CKEditor5自定义元素插件-主要用于自定义格式/样式-嵌套的divs等。设法能够注入/格式化元素，我可以键入它们。但是，如果我尝试将文本复制并粘贴到自定义元素中，则会遇到太多的递归错误。

MyWidget插件：

export default class MyWidgetPlugin extends Plugin {

  init() {

    const editor = this.editor;

    editor.model.schema.register('my-widget', {
      inheritAllFrom: '$root',
      isLimit: true,
    });

    editor.conversion.elementToElement({ model: 'my-widget', view: 'my-widget' });
    editor.commands.add('myWidget', new MyWidgetCommand(editor));

  }

}

MyWidget命令：

class MyWidgetCommand extends Command {

  execute() {

    const editor = this.editor;
    const block = first(this.editor.model.document.selection.getSelectedBlocks());

    this.editor.model.change(writer => {

      const myWidget = writer.createElement('my-widget')
      writer.insert ( myWidget, block, 'after');
      writer.appendElement( 'paragraph', myWidget );

    });

  }

}

插入窗口小部件会将其注入到编辑器中：

<my-widget>
  <p></p>
</my-widget>

我可以键入很好，但不能粘贴。我猜想我弄错了架构...玩了很多不同的选项..但无济于事。

Answer 1

我没有检查它，但我认为问题出在这里：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  isLimit: true,
});

此架构规则表示<my-widget>将允许例如其中的<paragraph>。但这并没有说明在何处可以使用<my-widget>。这是因为$root不允许用于任何其他元素（因为它是根：））。

我认为以下应能正常工作：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  allowIn: '$root',
  isLimit: true,
});

或者，也可以使用更通用的解决方案：

editor.model.schema.register('my-widget', {
  inheritAllFrom: '$root',
  allowWhere: '$block',
  isLimit: true,
});

不过，编辑器不应死于无限循环，所以我报告了https://github.com/ckeditor/ckeditor5-engine/issues/1441。