JSFiddle - React, Tailwind, and code Playground

HTML

Non-editable
<div id="one" contenteditable="true">
    Some text and an image <img src="/img/logo.png">
</div>
<div id="two" contenteditable="true">
    Just text
</div>

JavaScript

if (document.selection && "onselectionchange" in document) {
    // Ensure image can be resized when clicked on
    var mouseDown = false;
    document.getElementById("one").onmousedown = function() {
        mouseDown = true;
    };

    document.getElementById("one").onmouseup = function() {
        mouseDown = false;
    };

    document.onselectionchange = function() {
        var sel = document.selection;
        if (!mouseDown && sel.type == "Control" && sel.createRange().item(0).tagName == "IMG") {
            var nextEditableEl = document.getElementById("two");
            nextEditableEl.focus();
            //alert("Control");
        }
    };

}