As part of automation testing, I'm trying to figure out what is the best way to access a multi-select button in my company website. This button is not design in the popular way and it causes me problems using Select library. Here is how it looks like:
<div class="select-options options-overflow drop-select-link" style="position: absolute; top: 373px; left: 492px; width: 53px;">
<div class="drop-holder">
<div class="drop-list" style="height: 100px; overflow-x: hidden; overflow-y: auto;">
<ul>
<li class="jcfcalc" rel="0">
<a href="#">
<span>USD</span>
</a>
</li>
<li class="option-even jcfcalc" rel="1">
<a href="#">
<span>EUR</span>
</a>
</li>
</ul>
</div>
</div>
</div>
What you see here is a multi-select button which displayed different kind of currencies. I want to be able to choose currencies in a wise way - something like Select library. However, Select library doesn't fit to my code.
Is there a library that I'm not aware of? or would I have to do it with XPaths?
Select() couldn't be used with buttons. Any buttons! It could be used with select/option elements only!
In your case you can simply use link text to select required element (which is link, not the button) as
driver.find_element_by_link_text("EUR")
driver.find_element_by_link_text("USD")
Related
So I am automating with selenium and running into an issue where everytime I refresh a page, the element ID changes, no matter if I copy XPATH, CSS Selector, ID, they all have a number in them that changes.
so the code I'm using is simple, I just want to click the button which I can accomplish with
browser.find_element(by=By.CSS_SELECTOR, value='*VALUE HERE*').click()
But I don't know what to put as the value.
Here is the HTLM code
<a class="x4-tab x4-unselectable x4-box-item x4-tab-default x4-noicon x4-tab-noicon x4-tab-default-noicon x4-top x4-tab-top x4-tab-default-top x4-tab-after-title x4-active x4-tab-active x4-tab-default-active x4-top-active x4-tab-top-active x4-tab-default-top-active" hidefocus="on" unselectable="on" id="tab-1965" tabindex="0" data-ui-comp-name="wm-np-tab-wrkstn" style="right: auto; left: 66px; margin: 0px; top: 0px;">
<span id="tab-1965-btnWrap" role="presentation" class="x4-tab-wrap" unselectable="on">
<span id="tab-1965-btnEl" class="x4-tab-button" role="presentation">
<span id="tab-1965-btnInnerEl" class="x4-tab-inner x4-tab-inner-center"
unselectable="on">Workstations</span>
<span role="presentation" id="tab-1965-btnIconEl" class="x4-tab-icon-el " unselectable="on"
style="">
</span>
</span>
</span>
</a>
If you look at the HTML, anywhere you see that number 1965, that number will change if the page is refreshed. How do I make selenium find this element no matter what that number is?
Also, not sure if this matters but this is all in an iframe which I have selenium target by using
frame1 = browser.find_element(by=By.CLASS_NAME, value='defaultView')
browser.switch_to.frame(frame1)
Also, another problem is that HTML code is almost identical to other buttons, the only differences between the buttons is that number (that changes) and where is says "Workstations". Here is an example of another button that is next to it, this one is for servers.
<span id="tab-1964-btnWrap" role="presentation" class="x4-tab-wrap" unselectable="on">
<span id="tab-1964-btnEl" class="x4-tab-button" role="presentation">
<span id="tab-1964-btnInnerEl" class="x4-tab-inner x4-tab-inner-center"
unselectable="on">Servers</span>
<span role="presentation" id="tab-1964-btnIconEl" class="x4-tab-icon-el"
unselectable="on" style="">
</span>
</span>
</span>
</a>
You can use XPath for this:
browser.find_element(by=By.XPATH, value="//span[starts-with(#id, 'tab-') and contains(#id, '-btnEl')]").click()
I'm a bit new to selenium. I'm trying to select values from a drop-down menu using selenium in python, but for this website it does not seem to work.
Any ideas on how it can be done?
HTML code of dropdown:
<div id="dropdown-breakdown-select" class="drop-down drop-down--open">
<div class="drop-down__selected drop-down__selected--open ">Geographical breakdown</div>
<ul class="dropdown-list" tabindex="1" style="height: 246px;
display: block; overflow-y: hidden; outline: none;">
<li style="font-weight: normal;">Geographical breakdown</li>
<li style="font-weight: normal;">Rating</li>
<li style="font-weight: normal;">Maturity</li>
<li style="font-weight: normal;">Benchmark breakdown</li>
<li style="font-weight: normal;">Risk currency</li>
<li style="font-weight: normal;">Active currency risk</li>
<li style="font-weight: normal;">Active duration risk</li>
</ul>
</div>
Screenshot of dropdown:
Drop down from this page: Web link
Find element by css selector (#breakdown-select-wrapper .drop-down__selected) and click on it.
After that, iterate over lis (#dropdown-breakdown-select li) and find the one you are looking for by text.
Finally, click on it.
Because your drop down is a CSS dropdown, not native dropdown, you can't use Select class.
def choose_breakdown(option):
// click to make option list visible
driver
.find_element_by_css_selector(
"div#dropdown-breakdown-select > div.drop-down__selected"
).click()
// choose option by given option text
driver
.find_element_by_xpath(
"//div[#id='dropdown-breakdown-select']/ul/li[.='" + option + "']"
).click()
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?
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';")
<div id="crmMasthead" tabindex="-1">
<div id="crmTopBar" class="ms-crm-TopBarContainer ms-crm-TopBarContainerGlobal newNavBarMode">
<div id="crmAppMessageBar" class="crmAppMessageBar" style="display: none; height: 0px;">
<div id="crmRibbonManager" currentribbonelement="commandContainer15" style="height: 62px; display: block; visibility: visible;">
<div id="commandContainer15" style="display: inline;">
<ul class="ms-crm-CommandBar-Menu" role="application">
<li id="ewrb_importfile|NoRelationship|HomePageGrid|Mscrm.HomepageGrid.ewrb_importfile.NewRecord" class="ms-crm-CommandBarItem ms-crm-CommandBar-Menu ms-crm-CommandBar-Button" tabindex="-1" title="New Create a new Import File record." command="ewrb_importfile|NoRelationship|HomePageGrid|Mscrm.NewRecordFromGrid" style="white-space: pre-line; display: inline-block;">
<span class="ms-crm-CommandBar-Button ms-crm-Menu-Label-Hovered" tabindex="-1" style="max-width:200px">
<a class="ms-crm-Menu-Label" tabindex="0" onclick="return false">
<img class="ms-crm-ImageStrip-New_16 ms-crm-commandbar-image16by16" tabindex="-1" src="/_imgs/imagestrips/transparent_spacer.gif" style="vertical-align:top"/>
<span class="ms-crm-CommandBar-Menu" tabindex="-1" style="max-width:150px" command="ewrb_importfile|NoRelationship|HomePageGrid|Mscrm.NewRecordFromGrid"> New </span>
<div class="ms-crm-div-NotVisible"> Create a new Import File record. </div>
</a>
</span>
</li>
The Xpath Shows me like this:
.//*[#id='ewrb_importfile|NoRelationship|HomePageGrid|Mscrm.HomepageGrid.ewrb_importfile.NewRecord']/span/a
and If i use this, Selenium doesn't click the button
First try to remove "."(dot) from your xpath and check it if it works.
Secondly, try to write the xpath yourself. For this a node, try this one:
//a[#class="ms-crm-Menu-Label"]
You should check it if the part of html that you share is inside an iframe node or not. Otherwise, you should share more. With the current part that you shared, it is not possible to say that if it is inside an iframe or not.
Also, it can be a good idea to check the visibility of the button. The last thing: do you receive any error message. If yes, share it.
I'm trying to send some text to the search textarea at Google Adwords Keyplanner tool using Selenium python.
When inputting manually the text from textarea goes to its attribute 'title'.
The textarea looks like this:
<textarea class="spl-a sprb-c spl-d" rows="1" id="gwt-debug-keywords-text-area" aria-labelledby="gwt-uid-94 gwt-uid-74" wrap="off" style="overflow: hidden;" dir="ltr" title="mytext"></textarea>
As a result:
driver.find_element_by_tag_name('textarea').send_keys('mytext')
or
driver.find_element_by_id('gwt-debug-keywords-text-area').send_keys('mytext')
produces
selenium.common.exceptions.ElementNotVisibleException: Message: element not visible
Is there another way to send keys to this search textarea? I have like 500 keywords which I need to grab data for.
full code of text area:
<div class="spl-c spI-d" style="width: 575px;">
<div id="gwt-uid-119" class="sprb-a">
<div class="sprb-b spl-b" style="display: none;" aria-hidden="true">For example, flowers or used cars</div>
<textarea id="gwt-debug-keywords-text-area" class="spl-a sprb-c spl-d" rows="1" aria-labelledby="gwt-uid-139 gwt-uid-119" style="overflow: hidden;" dir="ltr" title="my keyword" wrap="off"></textarea>
</div>
</div>
</div>
The element you are trying to interact with is but addressable by Selenium, because it is inside a div which is hidden - this one:
<div class="sprb-b spl-b" style="display: none;" ...
There is another element which is actually taking the user's input - look for elements with keypress event handlers, and also what changes in DOM web you enter characters.