如何設置contenteditable span中的插入符號位置，然後發送鍵？

Question

<span name="workitemContent" contenteditable="">root 0 child 0 zzzz</span> 

例如，我怎樣才能使用量角器在單詞「child」後面設置光標，然後將其他文本（使用sendKeys或類似的方法）發送到該位置的跨度？

此後，它可能看起來像：

<span name="workitemContent" contenteditable="">root 0 child with red hair 0 zzzz</span> 

我已經看到這個問題的答案如何使用JavaScript（如How to set caret(cursor) position in contenteditable element (div)?）做到這一點其他問題，但不能與量角器。

Answer 1

您可以用偏移執行點擊的元素，例如：

var elm = element(by.name("workitemContent")); 
browser.actions().mouseMove(elm, 5, 0).click().perform(); 

但是，我不知道你是否可以把它叫做一個可靠的方法。

---

另一種選擇是跟隨你鏈接的問題提供的解決方案，並通過browser.executeScript()執行的javascript：

var elm = element(by.name("workitemContent")); 

function setCursor(arguments) { 
    var range = document.createRange(); 
    var sel = window.getSelection(); 
    range.setStart(arguments[0].childNodes[2], arguments[1]); 
    range.collapse(true); 
    sel.removeAllRanges(); 
    sel.addRange(range); 
} 
browser.executeScript(setCursor, elm.getWebElement(), 5);