Can't fill in the Hidden text area element

Question

F1, need some help or hints with Hidden element using Robotframework.
The problem consist that to fill any text in the text area, I need to change the state of text area from display:none; to display:block;

Needed text area for input

Code that I see from WebDev Tool

The code itself:

<div class="col-md-12">
<div class="cazary" style="width: 664px;">
    <div class="cazary-commands-wrapper">
        <ul class="cazary-commands-list">
            <li unselectable="on" title="Size" class="cazary-command-fontsize">Size</li>
        </ul>
        <ul class="cazary-commands-list">
            <li unselectable="on" title="Foreground Color" class="cazary-command-forecolor">Foreground Color</li>
        </ul>
        <ul class="cazary-commands-list">
            <li unselectable="on" title="Background Color" class="cazary-command-backcolor">Background Color</li>
        </ul>
        <ul class="cazary-commands-list">
            <li unselectable="on" title="Remove Format" class="cazary-command-removeformat">Remove Format</li>
        </ul>
    </div>
    <iframe class="cazary-edit" src="javascript:" style="height: 39px;"></iframe>
    <textarea id="summernote" class="required-preview field cazary-source" placeholder="Tell us all about your Advertisement. This description will be prominently displayed in your Advertisement notice. Feel free to adjust the fonts and background colour too." name="observations" cols="50" rows="10" style="display: none;"></textarea>
</div>

My Robotframework code tries:

Select Frame      //iframe[@class="cazary-edit"]
# First try
Input text      //textarea[@id="summernote"]    ${UniversalVariableforName}
# Second try
Input text      //iframe[@class="cazary-edit"]    ${UniversalVariableforName}
# Third try
Input text      //div[@class="cazary"]//iframe[@class="cazary-edit"]    ${UniversalVariableforName}
# Fourth try
Input text      //body[@class="empty"]    ${UniversalVariableforName}
# Fifth try
Input text      //iframe[@class="cazary-edit"]//body[@class="empty"]    ${UniversalVariableforName}

Errors that were returned: image

May be there is a solution with Execute Javascript keyword?

text area is out side of iframe and also, it is hidden. you cann't interact with it. — Murthi
Hi @Murthi, Yes, I'm able to fill manually any info in the specified text area — Alex
Please don't post pictures of the errors. Take the time to properly copy, paste, and format them into your question. — Bryan Oakley
If you're able to fill it in manually, most probably there is another element that is actually taking the input, and then propagates the value to the textarea by JS. Find the other one, and target it - by manipulating the display of the textarea your test will not replicate real user interaction. — Todor Minakov

DebanjanB DebanjanB · Accepted Answer · 2017-12-15T12:14:48

The concerned <textarea> is outside of the <iframe class="cazary-edit">. Hence we don't need to switch to the <iframe>

To send the text to the Input field you can try to :

Use xpath as :

"//textarea[@class='required-preview field cazary-source' and @id='summernote']"

Click the Input field first.
Next Clear the Input field.
Finally try to send the text.

Update :

As the concerned textarea have the style attribute set as "display: none;", we have to change to "display: block;" through JavascriptExecutor then send the text.

Python Sample Code :

driver.execute_script("document.getElementById('ID').style.display='block';")

Can't fill in the Hidden text area element

1 Answers

Update :

Python Sample Code :