JSFiddle - React, Tailwind, and code Playground

HTML

<ol>
    <li>Click in the input</li>
    <li>Click on the button to log window.getSelection().anchorNode.nodeType</li>
    <li>An error is thrown "Permission denied"</li>
</ol>

<p>The first thing to note here is that the input navigation doesn't work as expected with arrow keys.</p>

<p>The other thing is that window.getSelection() returns a Selection with "Restricted" for anchorNode and focusNode. Accessing any of their properties will throw an error (as shown in the console when following the above instructions).</p>

<div contenteditable>
    <div contenteditable="false">
        <input type="text" value="Some text content">
    </div>
</div>

<button onmousedown="console.log(window.getSelection().anchorNode.nodeType)">log selection anchorNode.nodeType</button>