CODEWITHSUNDEEP
internet-explorerseleniumiframeselenium-webdrivertextarea
Akash Arora
Akash Arora

Reputation: 43

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

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;"

Upvotes: 2

Views: 11447

Answers (3)

Talha Akbar
Talha Akbar

Reputation: 859

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'")

Upvotes: 0

Himanshu Sahu
Himanshu Sahu

Reputation: 26

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");

Upvotes: 1

AA007
AA007

Reputation: 23

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);

Upvotes: 2

Related Questions