I am trying to build a text editor from scratch using Reactjs.

I am trying to use a div of contentEditable true which contains HTML tags like anchor tag etc. To select any string I am using the following code -

 var sel = document.getSelection()

If there is no tag, the selection object takes all content of div as a single part. But if there is an HTML tag, then the selection object works for children objects separately. i.e. selection.achorOffset returns value counting from the end of the previous HTML tag.

Try selecting content by more than one row

So far I did up to like this