I have following element on the page:

<div class="valueDisplay"><span>Untitled</span></div>

I need to clear "Untitled" and enter my value - "MyValue".

I have following element:
 

@FindBy(how = How.XPATH, using = "//div[@class='valueDisplay']//span")
private WebElement inputElement;

I tried following ways:

Using JS:

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].innerHTML='" + "MyValue" + "'", inputElement);

Result: value in the input is changed, but when I click somewhere (even click on this element) on the page or click Save, old value is presented.

Using Send keys:
 

inputElement.click();
inputElement.sendKeys("MyValue");
inputElement.click();

Result: org.openqa.selenium.ElementNotInteractableException: element not interactable

I have the following element on a page:

<div class="valueDisplay"><span>Untitled</span></div>

I need to clear "Untitled" and enter my value - "MyValue".

I have the following WebElement:

@FindBy(how = How.XPATH, using = "//div[@class='valueDisplay']//span")
private WebElement inputElement;

I tried the following:

Using JS:

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].innerHTML='" + "MyValue" + "'", inputElement);

Result:

Value in the input is changed, but when I click somewhere (even click on this element) on the page or click Save, old value is presented.

Using Send keys:

inputElement.click();
inputElement.sendKeys("MyValue");
inputElement.click();

Result:

org.openqa.selenium.ElementNotInteractableException: element not interactable