How to include html tags in text editor? [Snippet attached]

I am making text editor using, react-draft-wysiwyg and draftjs-to-html ..

And also I have injected the dynamic html into editor like,

index.js:

export default function App() {
  const dynamicData = `<div class="heading"> This text needs to display along with the <span> html tags </span> surrounded </div>`;

  const handleInputChange = (e) => {
    console.log("event ", e.target.value);
  };

  return (
    <>
      <ContentEditor
        name="dynamicContent"
        value={dynamicData}
        onChange={(event) => handleInputChange(event)}
      />
    </>
  );
}

Current Working scenario:

Here the things are working very well and I am able to get the plain text like,

This text needs to display along with the html tags surrounded

inside the editor.

Note: (I mean to say only text is displayed without the html tags like div, span..

Expected:

I am in the need to bind the entire HTML as it is inside the editor like,

<div class="heading"> This text needs to display along with the <span> html tags </span> surrounded </div>

Working Snippet:

So my requirement is that need to display the text inside editor as,

<div class="heading"> This text needs to display along with the <span> html tags </span> surrounded </div>

instead of

This text needs to display along with the html tags surrounded

from How to include html tags in text editor? [Snippet attached]