I have problem that I don't know how to solve. I need to set to TRUE checkbox declared as:
<li class="consents">
<form class="consents__form">
<div class="checkbox-group">
<input name="5b51a49046e0fb0001bd7b5e" class="checkbox-group__input" id="5b51a49046e0fb0001bd7b5e-SJ7k5D714Q" type="checkbox" value="false">
<label class="checkbox-group__label" for="5b51a49046e0fb0001bd7b5e-SJ7k5D714Q">
<span>...</span>
<span class="checkbox-group__required">*</span>
</label>
</div>
<button class="consents__submit" type="submit">Dalej</button>
</form>
</li>
Because those element are in list I created in python loop that iterates over elements:
consents = self.driver.find_elements_by_css_selector('input.checkbox-group__input')
for consent in consents:
checkbox = consent.find_element_by_css_selector('label.checkbox-group__label::before')
checkbox.click()
But every time I got error:
selenium.common.exceptions.NoSuchElementException
I tried also use xpath, but the effect was the same :(
Sorry! My bad! #Andersson had right and also there was a bug in my code. The loop should looks like bellow:
self.driver.find_element_by_css_selector('li.consents')
consents = self.driver.find_elements_by_css_selector('div.checkbox-group')
for consent in consents:
checkbox = consent.find_element_by_css_selector('label.checkbox-group__label')
checkbox.click()
Related
I am testing a react.js front end web application with selenium and C# automation framework, I need to click all the elements in a drop down list, ideally, I would like to select the drop down as a list of elements, and iterate through each element and click it.
I have tried to locate the dropdown menu By Xpath, Cssselector, cssName, none seems to work, when I debug the code, my "dropDown" variable is always null
Here is the code of the drop down menu
<div class="dropdown-menu shadow px-4 show">
<div>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox" value="1">1 </label>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox" value="2">2</label>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox"value="3">3</label>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox" value="4">4</label>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox" value="5">5</label>
<label class="dropdown-item m-0 px-0 d-block"><input type="checkbox" value="6">6</label>
</div>
</div>
here is my selenium code
public static IList<IWebElement> dropDownClick (IWebDriver _driver) {
IList<IWebElement> dropdown = _driver.FindElements (By.ClassName ("dropdown-menu shadow px-4 show"));
return dropdown
}
I expected the variable "dropdown" is not null when I run the code in debug mode
Please use code written below in order to get the elements and to click on each element in iteration:
//Below line Finds the dropdown
WebElement dropdownElement = driver.findElements(By.xpath("//div[contains(#class,'dropdown-menu')]"));
//Below line stores all elements present in dropdown in a list of webelements
List<WebElement> elements = driver.findElements(By.xpath("//div[contains(#class,'dropdown-menu')]//label"));
for(WebElement ele : elements){
//To click on dropdown
dropdownElement.click();
//To click on label present in dropdown. This will change with each Iteration
ele.click();
}
Hope it helps :)
For xpath why not just use:
//div[#class='dropdown-menu shadow px-4 show']//label ---yields 6 rows
If this is not working, make sure the drop down is not in an iframe. You need the //label added so all elements appear in your "FindElements". Without it your return is 1.
Please try with below xpath. May be it is because of sapce,
//div[contains(#class,'dropdown-menu')]//label
Problem: there are couple of radio button with same id and I need to perform click on these. The first radio button gets the click where the second one is getting StaleElementReferenceException.
Can Anybody Suggest me how it can be handled so that when I click the second radio button it does not throw StaleElementReferenceException
HTML:
<solvup-radio-type _ngcontent-c7="" _nghost-c10=""><div _ngcontent-c10="" class="validation-error ng-untouched ng-pristine ng-invalid">
<solvup-label _ngcontent-c10="" _nghost-c33=""><label _ngcontent-c33="" class="control-label">
Have you been able to resolve the issue based on this information? <!----><span _ngcontent-c33="" class="required-mark">*</span>
</label>
<solvup-tooltip _ngcontent-c33="" _nghost-c36=""><!---->
</solvup-tooltip>
</solvup-label>
<!----><div _ngcontent-c10="" class="radio">
<label _ngcontent-c10="">
<input _ngcontent-c10="" type="radio" id="ts_note_questions" class="ng-untouched ng-pristine ng-invalid">
Yes, issue is resolved - close case
</label>
</div><div _ngcontent-c10="" class="radio">
<label _ngcontent-c10="">
<input _ngcontent-c10="" type="radio" id="ts_note_questions" class="ng-untouched ng-pristine ng-invalid">
No - continue to next step
</label>
</div>
</div>
<solvup-hint-text _ngcontent-c10="" _nghost-c34=""><!----><p _ngcontent-c34="" class="help-block"></p>
</solvup-hint-text>
<solvup-validation-messages _ngcontent-c10="" _nghost-c35=""><!---->
<!----><div _ngcontent-c35="" class="form-group">
<small _ngcontent-c35="" class="err"><i _ngcontent-c35="" aria-hidden="true" class="fa fa-exclamation-triangle"></i> Please select an option</small>
</div>
</solvup-validation-messages>
</solvup-radio-type>
Selenium Code:
#Given("^User fills details in First of Five Troubleshooting page$")
public void user_fills_details_in_First_of_Five_Troubleshooting_page() throws Throwable {
Thread.sleep(2000);
List<WebElement> li = driver.findElements(By.className("radio"));
Actions ob = new Actions(driver);
ob.moveToElement(li.get(1));
ob.click(li.get(1));
Action action = ob.build();
action.perform();
}
Please suggest.
Looking at the dom-structure, you might be trying to click an element that might not be the right one. I would think
List<WebElement> li = driver.findElements(By.Id("ts_note_questions"));
Actions ob = new Actions(driver);
ob.moveToElement(li.get(1));
action.perform();
li.get(1).click();
would work, as you are trying to click on the input instead of the div.
I noticed you copied the first radio-button but it looks like you forgot to change the id of the second radio-button. Try to change the id of the second radio-button to a unique one.
Toggle button is present in an web application similar to
http://www.dhtmlgoodies.com/index.html?whichScript=on-off-switch
Search for "option two" in the above link.
Html code of the button is like this when turned Off
<div class="field-block button-height">
<label style="width:175px" class="label" for="input-2"><b>Case Association</b><sup>*</sup>
<span id="reqCaseAssociationTD" style="display: none;">
required</span>
</label>
<p style="margin:0px" class="field switch">
<label style="margin:0 0 4px" class="cb-enable"><span>On</span></label>
<label style="margin:0 0 4px" class="cb-disable selected"><span>Off</span></label>
<input type="checkbox" class="checkbox" id="caseAssociation">
</p>
<span style="margin-top:8px;margin-left:2px" data-tooltip="Simulataneous post from the same user (Twitter and Facebook) would get associated with the previous open case of the user." class="helpText showToolTip"></span>
</div>
Html code of the button is like this when turned ON
<div class="field-block button-height">
<label style="width:175px" class="label" for="input-2"><b>Case Association</b><sup>*</sup>
<span id="reqCaseAssociationTD" style="display: none;">
required</span>
</label>
<p style="margin:0px" class="field switch">
<label style="margin:0 0 4px" class="cb-enable selected"><span>On</span></label>
<label style="margin:0 0 4px" class="cb-disable"><span>Off</span></label>
<input type="checkbox" class="checkbox" id="caseAssociation" checked="checked">
</p>
<span style="margin-top:8px;margin-left:2px" data-tooltip="Simulataneous post from the same user (Twitter and Facebook) would get associated with the previous open case of the user." class="helpText showToolTip"></span>
</div>
Used the following identifiers
//Case Association Turned On
#FindAll(#FindBy(how = How.CSS, using = "a.cb-enable.selected"))
public List<WebElement> caseAssociationIsON;
//Case Association Turned OFF
#FindAll(#FindBy(how = How.CSS, using = "a.cb-disable.selected"))
public List<WebElement> caseAssociationIsOFF;
While running using the selenium getting the error
org.openqa.selenium.support.ui.UnexpectedTagNameException: Element
should have been "select" but was "span"
How do fix this. If more details are needed, please suggest.
I don't see any element that would match your selector, you should use label instead of a, like:
label.cb-enable.selected
and
label.cb-disable.selected
or use a selector based on input. a means link and you don't have any.
In case you still have the error what happens is that you must add an specific route:
In my case:
enter image description here
This is the resultant code:
enter image description here
I can neither recognize the on-off switch nor get its current value (On / Off).
Please help to have a look
try using xpath = "//span[#class='onoffswitch-inner' and contains(#id,'aui')]" but it doesn't help to recognize this button
"id" is a dynamic one, it will be changed once loading the page
Code:
<li id="aui_3_4_0_1_1099">
<div id="aui_3_4_0_1_1098" class="onoffswitch">
<input id="notificationActive" class="onoffswitch-checkbox" type="checkbox" autocomplete="off" checked="checked" name="notificationActive"></input>
<label id="aui_3_4_0_1_1097" class="onoffswitch-label" for="notificationActive">
<span id="aui_3_4_0_1_1096" class="onoffswitch-inner">
::before
::after
</span>
<span class="onoffswitch-switch"></span>
</label>
</div>
</li>
Thanks,
I'm having trouble getting Cucumber to "choose" a radio button and hoping someone can give me a sanity check. Without quoting a huge mass of HTML junk, here's the relevant portion (which I collected from print.html). It's within a modal div that is activated by a button. I can "click" that button and see the modal window appear (I'm running it as a #javascript scenario in Selenium).
<div class="modal-body pagination-centered">
<img src="/assets/payment.png" alt="Payment" />
<form novalidate="novalidate" method="post" id="edit_cart_1" class="simple_form edit_cart" action="/carts/complete" accept-charset="UTF-8">
<div style="margin:0;padding:0;display:inline">
<input type="hidden" value="✓" name="utf8" />
<input type="hidden" value="put" name="_method" />
</div>
<div class="control-group hidden cart_property_id">
<div class="controls">
<input type="hidden" name="cart[property_id]" id="cart_property_id" class="hidden" />
</div>
</div>
<div id="payment_fat_buttons" class="fat-buttons">
<div class="vertical-button-wrapper">
<input type="radio" value="cash" name="cart[payment_type]" id="cart_payment_type_cash_pay" data-property-id="1" />
<label for="cart_payment_type_cash_pay">Cash</label>
</div>
<div class="vertical-button-wrapper">
<input type="radio" value="credit" name="cart[payment_type]" id="cart_payment_type_credit_pay" data-property-id="1" />
<label for="cart_payment_type_credit_pay">Credit</label>
</div>
</div>
<div style="display: none;" id="cart_room_number_area_pay">
<div class="control-group string optional cart_room_number">
<label for="cart_room_number_pay" class="string optional control-label">Room number</label>
<div class="controls">
<input type="text" value="" size="50" name="cart[room_number]" id="cart_room_number_pay" class="string optional" />
</div>
</div>
</div>
<input type="checkbox" value="1" style="display: none;" name="receipt" id="receipt" />
<div class="sell-modal-footer">
<input type="submit" value="Complete With Receipt" name="commit" id="cart_complete_with_receipt" data_disable_with="Processing..." class="btn btn-danger" />
<input type="submit" value="Complete Sale" name="commit" data_disable_with="Processing..." class="btn btn-danger" />
</div>
</form>
</div>
I've tried as many different equivalent ways of getting at it that I can think of. Most obviously just by the label, or the ID, like:
choose 'cart_payment_type_cash_pay'
choose 'Cash'
which just gives me the error:
Unable to find radio button "cart_payment_type_cash_pay" (Capybara::ElementNotFound)
I thought it might have something to do with the modal dialog, visibility, etc. but I introduced the ID #payment_fat_buttons just for testing, and when I look for it like this:
find('#payment_fat_buttons').choose('Cash')
it finds that DIV OK, but still not the radio button. I also tried getting at it with :xpath on the whole page, and within a scope like:
within(:xpath, "//div[#id='payment_methods']") do
find(:xpath, ".//input[#id='cart_payment_type_cash_pay']").choose
end
which acts like it can also find the outer DIV, but not the radio button - I get the error:
Unable to find xpath ".//input[#id='cart_payment_type_cash_pay']" (Capybara::ElementNotFound)
Generally, it seems like I can find any arbitrary element around the radio buttons with :xpath or CSS expressions, just not the radio buttons. I can also push the submit buttons on the form without any problem. I tried dropping the data attributes as a test - no difference. Any help would be greatly appreciated. This is driving me nuts because it seems so simple, and yet I'm getting nowhere. I need to choose that for a big segment of Scenarios, so if I can't figure it out, I'll have to resort to something hokey and horrible. Many thanks in advance...
Relevant versions from Gemfile.lock:
rails (3.2.13)
cucumber (1.3.8)
gherkin (2.12.2)
cucumber-rails (1.4.0)
capybara (2.1.0)
selenium-webdriver (2.35.1)
I finally figured this one out. Capybara wasn't finding the radio button because buried deep in my styles was some CSS that hid it in order to change the appearance. Once I realized that, I figured out that I could side-step the whole issue of finding the radio button by just doing a click on the label instead:
find(:xpath, "//label[#for='the_radio_button_id']").click
I didn't realize it was possible to get at radio buttons that way - but in any case, it solves the issue of how to click a radio button that Capybara won't find due to styling or other issues. Hope that helps someone else.