Chrome getRangeAt issue when programmatically changing the innerHTML of a contenteditable div

Question

my html is as follows:

<button onclick="testfunction()">test</button>
<div id="divT" spellcheck="false" contenteditable="true"></div>

js:

document.getElementById("divT").innerHTML = "bla bla bla";

function testfunction() {
    try {
        if (window.getSelection && (sel = window.getSelection()).modify) {
            var s = window.getSelection();
            var range = s.getRangeAt(0);
            range.collapse(true);
        }

    }
    catch(err) {
        alert(err);
    }
}

in Google chrome, when i try to change programmatically like in the above code, the content of that div and then run the testfunction, I get a: failed to execute 'getRangeAt' on 'Selection': 0 is not a valid index

However if i manually change the content, no such problem. Firefox works ok.

Is this a bug? Thank you in advance for your help

jsfiddle: https://jsfiddle.net/borw7n0h/ just click the test button

Answer 1

I solved it like this:

document.getElementById("divT").focus()