I want to achieve clicking a HTML button via reading its Value or innerText in C# Selenium, none of the methods for click is seem to work, no idea why?
I was wondering if this is possible if so please advise my code is below.
Html below
<div class="a-button-stack">
<span class="a-declarative" data-action="dp-pre-atc-declarative" data-dp-pre-atc-declarative="{}" id="atc-declarative">
<span id="submit.add-to-cart-ubb" class="a-button a-spacing-small a-button-primary a-button-icon">
<span class="a-button-inner">
<i class="a-icon a-icon-cart"></i><input id="add-to-cart-button-ubb" name="submit.add-to-cart-ubb" title="Add to Shopping Basket" data-hover="Select <b>__dims__</b> from the left<br> to add to Basket" class="a-button-input" type="submit"
value="Add to Basket" aria-labelledby="submit.add-to-cart-ubb-announce">
<span id="submit.add-to-cart-ubb-announce" class="a-button-text" aria-hidden="true">Add to Basket</span></span></span>
</span>
</div>
My code in C# is the following:
driver.FindElement(By.XPath("//button[contains(text(), 'Add to Basket')]")).Click();
driver.FindElement(By.XPath("//button[contains(text(), 'Add to Basket')]")).Click();
driver.FindElement(By.XPath("//*[contains(text(),'Add to Basket')]")).Click();
driver.FindElement(By.XPath("//button[contains(text(), 'Add to Basket')]")).Click();
//input[#value='Add to Basket']
There is no button tag but you can grab the input tag by it's data attribute value like so.
You are trying to use an element of a button but a button element does not exist.
The add to cart button in the html is:
//input[#id='add-to-cart-button-ubb']
Related
How can i write test scripts for login button without button name and id?
Here my code,
<button _ngcontent-lcu-6="" class="md-primary pull-right" md-raised-button="">
<span class="md-button-wrapper">Login</span>
<div class="md-button-ripple" md-ripple="" mdripplebackgroundcolor="rgba(0, 0, 0, 0)">
<div class="md-ripple-background"></div>
</div>
<div class="md-button-focus-overlay"></div>
</button>
You can use XPath or CSS to locate an element when there is no ID or name associated with a target element.
XPATH
//button/span[text()='Login']
CSS
button>span.md-button-wrapper
Sample code
driver.FindElement(By.XPath("//button/span[text()='Login']")).Click();
driver.FindElement(By.CssSelector("button>span.md-button-wrapper")).Click();
I have one HTML form where I need to click on checkbox but somehow it is not able to click on checkbox and instead it click on link
HTML Element - When checkbox is not clicked
<div class="form-group">
<input id="chkTermAndCondition" type="checkbox">
<label for="chkTermAndCondition">
I have read and agree to the
<a id="lnkTermsAndCondition" href="javascrip:void(0);">terms and conditions.</a>
</label>
</div>
HTML Element - After checkbox is clicked
XPAth Used but not working and clicking on "link"
//*[#for='chkTermAndCondition'] - click on link
//*[#id='chkTermAndCondition'] - This doesn't work
//div[#id='sellerInformationDiv']/div[3]/div/label - click on link
Both the above xpath is not clicking on checkbox
Try below code:
IJavaScriptExecutor js = (IJavaScriptExecutor)driver;
js.ExecuteScript("arguments[0].click();", driver.FindElement(By.xpath("//input[#id='chkTermAndCondition']"));
<div class="pill-wrap double">
<a ng-click="modalCancel()" class="button pill">No</a>
<a ng-click="modalSuccess()" class="button pill">Yes</a>
</div>
I want to get the button with class button pill and where the innertext is 'No' and click it
To click on the button with innertext as No you can use the following line of code :
driver.FindElement(By.XPath("//div[#class='pill-wrap double']//a[#class='button pill' and #ng-click='modalCancel()']")).Click();
I am trying to click on a button, but I get "element is not currently visible and so may not be interacted with", how can I fix this?
I tried using commands like:
driver.FindElement(By.Id("btnSave")).Click();
driver.FindElement(By.Xpath(".//*[#id='btnSave']")).Click();
sorry I did not understand how to use html properly in comments(just deleted all the <>)
button id="btnSave" class="btn btn-primary" type="submit" value="save" data-target="#" name="command"
i aria-hidden="true" data-icon="Z" /i
span class="title" Saugoti /span
/button
I just found out that there is a hidden element with the same id, so how do I deal with this situation?
This means that you've located the "Save" button that is invisible.
You should improve your location strategy. For instance, look for the button inside a specific form:
driver.FindElement(By.CssSelector("form#myform button#btnSave")).Click();
Or, just get all the buttons and choose the one by index:
driver.FindElements(By.Id("btnSave"))[1].Click();
I'm trying to figure out how to get my Javascript code to check whether or not a button has been chosen. If it has, I would like to display the button's value.
I have the following HTML:
<li class="control-group">
<label for="amount" class="control-label">Select an amount</label>
<div class="controls">
<div class="btn-group radioButtons amountButtons" data-toggle="buttons-radio">
#if (Model.PresetValues.Count > 0){
foreach (int value in Model.PresetValues) {
<button type="button" data-value="#value" class="btn #(Model.chargeViewModel.ChargeAmount == value ? "active" : "")">$#value</button>
}
}
<button type="button" data-value="other" class="btn toggleDiv toggleOnce" data-toggle-id="#manualAmount">Other</button>
</div>
<input type="hidden" class="radioHidden validate required validateAmount" value="" id="amount" name="ChargeAmount">
</div>
<div class="controls hide resize" id="manualAmount">
<div class="input-prepend input-append">
<button class="btn minus" type="button"><i class="icon-minus"></i></button>
<input class="span2 plusminus" data-max="100" data-min="10" data-increment="5" data-value="25" id="manualAmountInput" type="text" value="$25" disabled>
<button class="btn plus" type="button"><i class="icon-plus"></i></button>
</div>
</div>
</li>
Those are my two options for the button and I would like to edit the following span
<span class="help-block">Your card will automatically reload $<span id="autoAmount">0</span> when your balance is lower than your reload threshold.</span>
I have the following script which I was led to believe will change the value of the span as it is clicked, but I am having a difficult time connecting them together.
<script>
javascript: void (document.getElementById("autoAmount").innerHTML = amount);
</script>
if anyone has any suggestions or ideas, it would be greatly appreciated.
Thanks!
To expand on kyllo's answer a little bit...
First you would need to bind a click event to your button. You can set it as an onClick attribute:
<input type="button" onClick="captureAmount(e); return false;">
Including the 'e' inside captureAmount will pass the click event itself over to our function, which we can use to figure out which button was clicked (if you are using this function in more than one place).
You can also use jQuery if you've included that library, to attach the function to every button on the page at once.
$('input[type=button]').click(captureAmount(e));
Or, specify buttons with a particular class..
$('input.amountBtns').click(captureAmount(e));
And your function could look a little something like this:
function captureAmount(e){
var clicked = e.target
, clickedAmount = clicked.value
, display = document.getElementById("autoAmount")
;
display.innerHTML = clickedAmount;
}
If you want the innerHTML of the autoAmount span to change when you click a button, then you would need to bind an onclick event to that button, and then when the onClick event fires, you would do document.getElementById("autoAmount").innerHTML = amount.value
for example, in the button declaration you can add
onclick="updateAmount()"
and then inside the script tags you would declare a javascript function that is called by the onclick event:
function updateAmount(){
document.getElementById("autoAmount").innerHTML = document.getElementById("amount").value
}
(Keep in mind that your "amount" input box is hidden, though.)