react-quill breaking down initially passed wrapped elements into separate elements

You mention that when onChange is called you get an error and yet you do not post the code of that function in your question! Anyways, I've tried to answer and was not able to reproduce the issue. The following code works fine for me, let me know,

import React from "react";
import ReactQuill from "react-quill";
import "react-quill/dist/quill.snow.css";
import "./styles.css";

const html = `
  <blockquote class="quote-aufjd">
    <div>
        On Wednesday, September 2nd 2020
        <a rel="noopener noreferrer" href="mailto:mail">mail</a>
        wrote:
        <br>
        <div>This is my reply</div>
    </div>
  </blockquote>
`;

export default function App() {
  const [text, setText] = React.useState(html);

  return (
    <div className="App">
      <h1>Quill Editor</h1>
      <ReactQuill value={text} onChange={setText} />
    </div>
  );
}

From this answer, this post by one of the Quill authors, and the outrageous amount of dislikes on some posts this issue has: we can learn that Quill does not really support Arbitrary HTML therefore, the requirement you have mentioned in your question will get more complex if you try to force it on Quill even if it sounds very trivial.

At the end of the day Quill is just one of many tools that developers can use to provide solutions. With that said, I suggest you look into using contentEditable elements if you must use Arbitrary HTML.

If you really must use Quill, I think that one solution to this is if the HTML is coming from another data source, since you won't be able to rely on the data returned by Quill's onChange or even the actual innerHTML of the WYSIWYG content.

export default function App() {
  const [text, setText] = React.useState(html);

  return (
    <>
      <textarea value={text} onChange={(e)=>setText(e.target.value)}/>
      <ReactQuill value={text} />
    </>
  );
}