I have a contenteditable element and want to set caret to at beginning of a text node. See example please. example

<p id="p" contenteditable="true">Example: <i>italic</i> and <b>bold</b></p>

let range = new Range();

range.setStart(p.childNodes[2], 0);
range.setEnd(p.childNodes[2], 0);

// toString of a range returns its content as text, without tags
console.log(range); // Example: italic
range.collapse(false);
// apply this range for document selection (explained later below)
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
p.focus();

When I typing (on Chrome), caret always at the end of the i tag, but I want it must at beginning of text node. That work on firefox but not on Chrome. Thanks.