I am writing selenium script for Autotrader.com signup page. I am not able to click on 'I Agree' Check box. This is what I have written:
WebElement cboxlink = driver.findElement(By.id("j_id_29-j_id_2h-"
+ "myatcRegisterForm-j_id_3n-acceptTerms"));
cboxlink.click();
The HTML is:
<div id="j_id_3n" class="atcui atcui-form-row atcui-clearfix atcui-small terms" style="">
<input id="j_id_29-j_id_2h-myatcRegisterForm-j_id_3n-acceptTerms" class="checkbox" type="checkbox" value="true" name="j_id_29-j_id_2h-myatcRegisterForm-j_id_3n-acceptTerms">
<label for="j_id_29-j_id_2h-myatcRegisterForm-j_id_3n-acceptTerms">
I accept terms of the
<a target="_blank" href="/privacy.jsp">Privacy Statement</a>
and <a target="_blank" href="/legal/visitor-agreement.xhtml">Visitor Agreement</a>.
</label>
Related
I am writing a test automation solution with Selenium in Java.
I want to select to first option in a radio button group on my page.
The HTML id and content of these options are dynamically generated.
The options belong to a radio button group with data-cy=tv-select and name=selectTv.
How can I select the first option in this radio button group?
EDIT This is the html code:
<section _ngcontent-hqh-c168="">
<span _ngcontent-hqh-c168="">
<vi-select-tv _ngcontent-hqh-c168="" _nghost-hqh-c167="">
<mat-radio-group _ngcontent-hqh-c167="" role="radiogroup" name="selectTv" data-cy="tv-select"
class="mat-radio-group tvken-select ng-pristine ng-valid ng-star-inserted ng-touched">
<mat-radio-button _ngcontent-hqh-c167="" class="mat-radio-button mat-accent ng-star-inserted" id="mat-radio-8">
<label class="mat-radio-label" for="mat-radio-8-input">
<span class="mat-radio-container">
<span class="mat-radio-outer-circle"></span>
<span class="mat-radio-inner-circle">
</span>
<input type="radio"
class="mat-radio-input cdk-visually-hidden"
id="mat-radio-8-input"
tabindex="0"
name="selectTv"
value="NIEUW_a11fd55d-5792-4f19-8764-ccb188d20591">
<span mat-ripple="" class="mat-ripple mat-radio-ripple mat-focus-indicator">
<span class="mat-ripple-element mat-radio-persistent-ripple">
</span>
</span>
</span>
<span class="mat-radio-label-content">
<span style="display: none;"> </span>tv 1: 02-10-2021 13:20 tot 02-10-2021 15:20</span>
</label>
</mat-radio-button>
<mat-radio-button _ngcontent-hqh-c167="" class="mat-radio-button mat-accent ng-star-inserted mat-radio-checked"
id="mat-radio-9">
<label class="mat-radio-label" for="mat-radio-9-input">
<span class="mat-radio-container">
<span class="mat-radio-outer-circle"></span>
<span class="mat-radio-inner-circle"></span>
<input type="radio"
class="mat-radio-input cdk-visually-hidden"
id="mat-radio-9-input"
tabindex="0"
name="selectTv"
value="new">
<span mat-ripple="" class="mat-ripple mat-radio-ripple mat-focus-indicator">
<span class="mat-ripple-element mat-radio-persistent-ripple"></span>
</span>
</span>
<span class="mat-radio-label-content">
<span style="display: none;"> </span>NEW</span></label>
</mat-radio-button>
</mat-radio-group>
</vi-select-tv>
</span>
</section>
I am interested in the radio button with ID mat-radio-8-input, but that ID changes with every new test run.
This is how I identify my radio button group:
#FindBy(how = CSS, using = "mat-radio-group[data-cy='tv-select']")
private List<WebElement> tv;
How can I select the first option of this group?
You can do this:
#FindBy(how = CSS, using = "mat-radio-group[data-cy='tv-select'] mat-radio-button")
private List<WebElement> radioBtns;
To get first item:
WebElement firstRadioBtn = radioBtns.get(0);
You can do this simply by executing a JS code on the page. Just inspect the target page to find a unique selector for the radio button and set selector.checked = true; using js...
For example, if my radio button have id mat-radio-9, I can use js code :- document.getElementById("mat-radio-9").checked = true;
Check Out These Questions :- Executing js code Check a radio button in js
I have one check box and two links with same classes & same Div.During the automation testing using protractor, i want to click on check box but it click on Links.
i am writing this code but its not working, please provide a solution.
Code:
element(by.id('Remember')).click();
[1
please find HTMl code:-
<div class="input-field">
<div class="pas_rembr">
<input name="remember" id="Remember" class="css-checkbox ng-dirty ng-valid-parse ng-touched ng-not-empty ng-valid ng-valid-required" ng-model="rememberMe" type="checkbox" ng-required="true" required="required">
<!-- <label for="Remember" class="css-label">I agree with the <a class="text_link" target="_blank" ng-href="{{baseUrl}}terms-conditions">Terms & Conditions</a>.</label> -->
<label for="Remember" class="css-label">I have read and I agree with <a class="text_link" target="_blank" ng-href="/lmd/terms-conditions" href="/lmd/terms-conditions">Terms and Conditions</a> and the <a class="text_link" target="_blank" ng-href="/lmd/privacy" href="/lmd/privacy">Privacy Policy</a> of this site.</label>
</div>
<span class="errorForm ng-hide" ng-show="(memberForm.remember.$dirty || submitted) && ((memberForm.remember.$error.required))">
<span class="errorForm ng-scope ng-hide" ng-show="memberForm.remember.$error.required" translate="TERAMS_CONDITION_IS_REQUIRED">Terms and condition is required</span>
</span>
</div>
Try this:-
var el = element(by.css('label[for="Remember"]'));
browser.actions().mouseMove(el, {x: 20, y: 3}).click().perform();
For your tests, the CSS selector would be
element = $$('label.css-label > a:nth-child(2)');
This should be able to click on the second a child of the label element.
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
Can any one please help me out how to select a radio button if it is inside a fieldset??
I can access individual radio button using foreach but when i try to select it or click it its giving some Ajax error.
HTML code is given below
I have tried to select it with radio button's label as well as given in above comment but not able to select it.
<fieldset id="edit-cvs-options" class="form-wrapper">
<legend>
<div class="fieldset-wrapper">
<div class="ios-content" style="display: none;">test</div>
<div class="form-item form-type-radio form-item-use-stored">
<label for="edit-use-stored">
<span>test</span>
<input id="edit-use-stored" class="form-radio" type="radio" name="use_stored" checked="TRUE" value="on" display-title-fix="1"/>
</label>
</div>
<fieldset id="edit-cvs-1" class="form-wrapper" style="display: inline-block;">
<div>
<div class="form-item form-type-radio form-item-use-uploaded">
<label for="edit-use-uploaded">
<span>test</span>
<input id="edit-use-uploaded" class="form-radio" type="radio" name="use_uploaded" display-title-fix="1" value="off"/>
</label>
</div>
</div>
</fieldset>
This is my Behat step definition:
$session = $this->getSession(); // get the mink session
$escapedValue = $session->getSelectorsHandler()->xpathLiteral('use_uploaded');
$radioButton = $session->getPage()->find('named', array('radio', $escapedValue));
$radioButton ->click();
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,