How to Enter text in rich text editor in selenium webdriver?

此生再无相见时 提交于 2021-01-21 11:56:27

问题


We have a rich text editor in our application which we are automating using selenium . Below is the html for the same .

<iframe style="height: 76px; width: 1004px;"></iframe>
<html><head></head><body spellcheck="false"></body></html>
<head></head>
<body spellcheck="false"></body>
<html><head></head><body spellcheck="false"></body></html>
<iframe style="height: 76px; width: 1004px;"></iframe>
<div class=""><iframe style="height: 76px; width: 1004px;"></iframe></div>
<textarea class="form-control Editor" name="actionUpdate" id="actionUpdateId" style="display: none;"></textarea>

I have tried multiple options . Following code works perfectly fine on chrome browser

driver.switchTo().frame(0);
WebElement el  =  driver.switchTo().activeElement();
new Actions(driver).moveToElement(el).perform();
driver.findElement(By.xpath("/html/body")).sendKeys("Check");

However it does not work on IE11 browser as it is unable to find element using xpath. The difference between both the browsers is when I type something in text field using IE it goes to textarea tag. However in chrome it types in body tag . I have tried finding element using ID= "actionUpdateID" in IE but it throws an exception saying Element not displayed, maybe because of style = "display : none;"


回答1:


Since manually entering text in your application goes into the textarea element, you can try to set value using sendKeys to textarea element in selenium.
When you set some value in textarea element using selenium, the same value will be added to the rich text editor in the web application.

But as per your HTML code the textarea element is styled as display:none due to which your selenium code will throw an Exception when you sendKeys to the element. This can be fixed if the display attribute is changed to inline or block.

Thus, you first need to set style of textarea to display:inline and then set some value to the element using sendKeys.

To change style of textarea element using JavascriptExecutor :

((JavascriptExecutor)driver).executeScript("document.getElementsByName('actionUpdate')[0].style.display='inline'");

To set some value to your rich text editor, use the below code :

driver.findElement(By.name("actionUpdate")).sendKeys("Show this message in rich text editor");



回答2:


JavaScriptExecutor is better way to handle rich text boxes. Just switch to proper iframe and set innerHtml to body of that iframe.

WebElement text= driver.findElement(By.cssSelector("body")); (JavascriptExecutor)driver.executeScript("arguments[0].innerHTML = 'Set text using innerHTML'", text);




回答3:


Thank Himanshi I solved this issue by your approach. Here's my code.

driver.execute_script("document.getElementsByName('description')[0].style.display='inline'")
driver.execute_script("document.getElementsByName('description')[0].style.visibility='visible'")


来源:https://stackoverflow.com/questions/40023544/how-to-enter-text-in-rich-text-editor-in-selenium-webdriver

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!