I have a submit button on my UI page but I am not able to click on that button even if I take the XPath of that. Below is the UI code for button
<input type="submit" class="btn btn-primary btn-lg col-sm-2" value="Submit">
but the XPath i am getting is
//*[#id="form"]/div[5]/input
So please provide me some inputs to select the button. I also need to scroll down the page a bit as the button is also not visible on the page.
u may try by using cssSelector like below:
driver.findElement(By.cssSelector(".btn.btn-primary.btn-lg.col-sm-2"));
for this, class "btn.btn-primary.btn-lg.col-sm-2" must be unique.
if the element is not visible in the screen, than use like below:
JavascriptExecutor js = (JavascriptExecutor)driver;
WebElement elem = driver.findElement(By.cssSelector(".btn.btn-primary.btn-lg.col-sm-2"));
//this line will scroll down to make element visible
js.executeScript("window.scrollTo(" + elem.getLocation().x + "," +(elem.getLocation().y- 100) + ");");
than click on that element:
elem.click();
Hi please use this xpath it will work
//*[#id='form']/div[5]/input // if nodes are correct then
if yor page has got only on tag with attribute value value="Submit" then
//*[#value='Submit']
You can try following xpath
//input[#class='btn btn-primary btn-lg col-sm-2']
this should work
Related
New to Angularjs. In a form i have a button and clicking upon, it would call a function with formname in its input:
<button ng-show="!ask" id="id1" class="btn btn-primary save" ng-click="checkfunction(claim.ProviderJSON,claimform)" style="margin-right: 60px;">Add</button>
The checkfuntion is below:
$scope.checkfunction = function(obj,claimform) {
console.log(claimform);
console.log($scope.claimform.svcDateFrom.$pristine);
$scope.claimform.svcDateFrom.$pristine='true';
$scope.claimform.svcDateFrom.$setPristine();
$scope.claimform.svcDateFrom.$setPristine('true');
claimform.svcDateFrom.$pristine='true';
claimform.svcDateFrom.$setPristine();
claimform.svcDateFrom.$setPristine('true');
console.log(claimform);
console.log(claimform.svcDateFrom.$pristine);
console.log($scope.claimform.svcDateFrom.$pristine);}
Now when i am clicking the "Add" button, and check on console.log(claimform); (before updatinng pristine) the claim form has as $pristine:false
but console.log($scope.claimform.svcDateFrom.$pristine); is coming as true.
I am not able to update the pristine values. I need to keep it true and dirty as false after clicking on Add button. I tried different methods but all in vain.
Thanks in advance!!
I'm using material-ui as my css framework and I want to select button that contains a specific text.
My current code:
cy.get('button').contains('Edit Claim').should('be.disabled');
It fails because the button component of material ui outputs the text inside a div so cypress is asserting the disabled attr to the div. I want it to assert to the button.
Edit:
I solved it using cy.contains('button', 'Edit Claim').should('be.disabled');
On the Material-UI demo page the label is in a child <span> (not <div>),
<button class="MuiButtonBase-root MuiButton-root MuiButton-contained Mui-disabled Mui-disabled" tabindex="-1" type="button" disabled="">
<span class="MuiButton-label">Disabled</span>
</button>
but there may be variations - in any case, you can reference the button by adding .parent() to the test
cy.visit('https://material-ui.com/components/buttons/');
cy.get('button')
.contains('Disabled') // span is the subject
.parent() // move up to the button
.should('be.disabled');
I have a bootstrap popover which has 2 buttons Yes or No. Based on the response from the user i need to call AngularJS service function. How do i do that??
Popover is created only if it meets a certain criteria (like existence of duplicate records)
HTML code looks something like below, but currently doesn't have 2 buttons & still need to work on it
$(document).ready(function () {
if (DuplicateRecord) {
$('[data-toggle="popover"]').popover();
}
});
<button href="#" data-toggle="popover" title="Popover Header"
data-content="Some content inside the popover" data-trigger="click"
data-html="false" data-placement="left">
Toggle popover
</button>
Looks like you are mixin concepts (or maybe I'm not getting your question), you can have a popover but the data-trigger="click" makes showing the popover on the click event and you wanna use that event to call the service method. Change the popover trigger to hover and then use the click event to call your service. Something like this just as an idea, the snippet is not tested.
<button
type="button"
data-toggle="popover"
title="Popover Header"
data-content="Some content inside the popover"
data-trigger="hover"
data-html="false"
data-placement="left"
ng-click="$ctrl.callSomeMethod()"
>
Toggle popover
</button>
You can take a look to UI Bootstrap lib which has a directives for the Bootstrap's components equivalents.
I have two button that are overlapping, and use ng-hide for the m with the same flag.
On Chrome it work perfectlly, but when I use IE 11, the icons are overlapping on page load.
I have two icons on in my search box:
And On IE11, when the page is loading:
The code is:
<button type="submit" class="btnSubmit" ng-show="vm.isSearchIconVisible" >
<i class="iconMglass"></i>
</button>
<button type="reset" ng-show="!vm.isSearchIconVisible" class="clearTextButton" ng-click="vm.clearSearchText()">
<span class="clearIcon">X</span>
</button>
How can I fix it ?
Try using ng-ifinstead of ng-show.
The ng-if directive removes the content from the page and ng-show/ng-hide uses the CSS display property to hide content.
Not using CSS by changing to ng-if prevents these CSS problems. Although the ng-ifcreates a new scope but that impact is nothing.
<button type="submit" class="btnSubmit" ng-if="vm.isSearchIconVisible" >
<i class="iconMglass"></i>
</button>
<button type="reset" ng-if="!vm.isSearchIconVisible" class="clearTextButton" ng-click="vm.clearSearchText()">
<span class="clearIcon">X</span>
</button>
If you don't want to change to ng-if, then please share a working Plunkr/... so help you find your problem. Since it will be a cssissue most likely.
The Problem was that IE11 save cash with old code, CTR+R dident solve this problem.
In the IE11 option I revoce the option to save cash and it solve the problem, the new code appear.
Here is the code
<button type="button" class="btn btn-default btn-sm pull-right" ng-click="move(1)" tabindex="-1"><i class="glyphicon glyphicon-chevron-right"></i></button>
I have to click on arrow button 3 times using ng-click or class.
Pleas help me
Since, you have mentioned that's hidden element and Selenium does not interact with hidden element the only option you have is javascript. I would try the following and see if that does the work:
driver.execute_script("document.querySelector(\"[ng-click='move(1)']\").click();")
Or:
button = driver.find_element_by_css_selector("button[ng-click*=move]")
driver.execute_script("arguments[0].click();", button)