quote a reply with quill editor

Question

I'm building a forum app and i want to be able to quote a reply.

I'm trying to figure out of there is a way to include in a blockquote any type of html that that might be included in a reply.

For example

Let's say that there is a reply with the following body

<h1> Title of reply </h1>
<ul> 
 <li> first item </>
</ul>

Therefore i want to be able to quote the above body as it is.

Currently, i've noticed that when i try to insert a block level html tag into a blockquote in quill editor like

var editor = document.querySelector('ql-editor');
editor.innerHTML = <h1> some random text </h1>

The quill editor doesn't display it. Probably it is rejected and it only accepts inline elements

Answer 1

As answered in this StackOverflow answer, you can use the clipboard to convert HTML to a Delta.

Follow up your setContents with a formatText to convert it to a quote. Documentation for Quill formatText: https://quilljs.com/docs/api/#formattext

A complete example could work like this.

const html = document.querySelector('post-number-342').innerHTML;
const delta = quill.clipboard.convert(html);
quill.setContents(delta, 'silent');
quill.formatText(0, quill.getLength(), 'blockquote', true, 'silent');