Writing cssselector expression for webDriver using attribute matching - java

I am a newbie to css, html, etc and thus cssselectors. I have been messing around with selenium webdriver and am trying to .click() the following button:
<button title="" class="btn addWidgButt bt-block" href="" role="button" type="button" context="UNIQUE_THING">
<span class="btn-text">UNIQUE THING</span></button>
According to http://www.w3.org/TR/css3-selectors/#selectors shouldn't the following selector work? (Rule is E[foo="bar"] for element E
By.cssSelector("button title[context=UNIQUE_THING]")
By.cssSelector("btn.addWidgButt.bt-block[context=UNIQUE_THING]")
By.cssSelector("span[btn-text=UNIQUE THING]")
I think the last one is my best bet, as span is an element and btn-text is an attribute value. Any help is appreciated, thanks.

One thing I noticed is that all of your selectors in [] are missing single quotes.
By.cssSelector("button[context='UNIQUE_THING']")
By.cssSelector(".btn.addWidgButt.bt-block[context='UNIQUE_THING']")
By.cssSelector("span.btn-text")
Your second selector is missing the leading .
Your last selector will not work, as you cannot match text with CSS Selectors. You can match a class with ., or id with #.
For more information, this is an excellent reference: http://www.w3schools.com/cssref/css_selectors.asp

Related

hasRole() within th:remove is not working

I want to disable a particular link but retain its text, giving it the appearance of being disabled. I am trying to place a th:remove with a certain condition inside the anchor tag. I found this on the ThymeLeaf tutorial page:
Link text not to be removed
Based on that I'm trying to do this:
<li>
<a th:href="#{/config/mod/}"
th:remove="${#authorization.expression('hasRole(''VIEW_MODULE_STATUS'')')}? tag">
<i class="fa fa-gear"></i> [[#{webadmin.view.config.module.title.short}]]
</a>
</li>
where VIEW_MODULE_STATUS is the role. The condition does not seem to work and I can't understand why.
FYI: I have used sec:authorize="hasRole('VIEW_MODULE_STATUS')" in the anchor tag and it works fine. I want to avoid this approach because it completely removed the text and the link. Is there any other approach to have the link disabled and retain the text using ThymeLeaf?
(I am using ThymeLeaf 3.0)
There is a mistake in the ternary operator being used in the expressions th:remove="${#authorization.expression('hasRole(''VIEW_MODULE_STATUS'')')}? tag"
A ternary operator is of form condition? 'true' : 'false'. So you have to update your expression. Then you cannot disable an <a> tag, the only thing you can do is update its href attribute to be # or javascript:void(0); so that it doesn't have any action. You could do it as shown below:
th:href="${#authorization.expression('hasRole(''VIEW_MODULE_STATUS'')') ? '/something' : '#'}"

How to click on a link with a span tag inside using selenium java

I am having a problem in clicking the link text given inside a span tag.
html code :
<div id="menu" style="width: 1752px;">
<div class="dd_menu" dd_event_id="dd_event_2">
<a class="dd_menu_menu_entry dd_menu_entry_clickable" href="javascript:void(0);" style="left: 3px; width: 111px;" dd_menu_id="0">
<a class="dd_menu_entry dd_menu_entry_clickable" href="javascript:void(0);" style="left: 114px; width: 131px;" dd_menu_id="1">
<span class="text" style="background-color: rgba(0, 0, 0, 0);">FirstMenu</span>
I need to click on the text 'FirstMenu' .
I have used the xpath : .//*[#id='menu']/div/a[2]/span
It does not seem to work. How do I fix it?
If your requirement is to "click on the link FirstMenu", then you should use that as the locator. No need to mess around with XPath.
driver.findElement(By.partialLinkText("FirstMenu")).click();
The .partialLinkText() locator strategy should account for any extra whitespace padding due to the extra span element.
Your xPath returns span element so you're clicking that span. To make your xpath return a link ament your query to the following:
//*[#id='menu']/div/a[span]
This query returns a "link" that has span element as a child.
Try to use below xpath :-
//span[contains(.,'FirstMenu')]
If it doesn't work then there may be any frame present. You need to switch it on first.
Please let me know if there is more element with name FirstMenu on DOM
Hope it will help you :)
The problem got solved by using the same xpath i specified above with the usual syntax driver.findElement(By.xpath("//*[#id='menu']/div/a[2]/span")).click(); after i gave the order by which testcases have to be executed and using #Test(priority=something) and giving some implicit waits.
Thank you all for the suggestions.
regards,
roma
It is not good to use xpath. If the html of the page is changed your code would stop working. Try with css selector.
This is is simple code and you can modify it for you case:
var collection = driver.getelementsBy(By.cssSelector('div#menu div'))
It should return you collection with elements
And after that you can iterate through collection and find the element you want to click.
Hope the answer helps you.

Finding element with dynamic xpath not working

I have this in the HTML:
<textarea name="comment" class="form-control" rows="3" id="textarea_1160688690910416779_2159935466"></textarea>
I want to interact with id=textarea_, but the numbers are constantly changing after the "_". To solve this, I used this code:
driver.findElement(By.xpath("[starts-with(#id, 'textarea')")).sendKeys(comment);
However I am getting the error:
org.openqa.selenium.NoSuchElementException: Unable to locate element:
Use
driver.findElement(By.xpath("//textarea[starts-with(#id,'textarea_')]")).sendKeys(comment);
The reason you're getting this error is that you need to add '//' before your current XPath.
You could either use starts-with, this way:
("//textarea[starts-with(#id, 'textarea_')]")
You could also give 'contains' a try:
("//textarea[contains(#id, 'textarea_')]")
In both ways, you could use //*[... instead of textarea, for more cases
Your Xpath is not a valid Xpath.
It should contain a path and tag name
and it should be balanced (your [ is not closed)
So, if your tag is, textarea, and if it is at top: use /textarea
if not at top, use //textarea
This gives: "//textarea[starts-with(#id, 'textarea')]"
To use with selenium, you could also read that: JAVA - How to use xpath in selenium
and that: Webdriver findElements By xpath

Get xpath of div having multiple occurence in page

I am having a weird requirement. I am having a div class named "expandThisSection". And I have
<div id=​"requiredAccessoriesContentPlaceHolder" class=​"expandThisSection">​No required accessories are available for this product.​</div>​
<div id=​"requiredAccessoriesContentPlaceHolderMeasurement" class=​"expandThisSection">​ ​</div>​
<div id=​"optionalAccessoriesContentPlaceHolder" class=​"expandThisSection">​No optional accessories are available for this product.​</div>​
<div id=​"optionalAccessoriesContentPlaceHolderMeasurement" class=​"expandThisSection">​ ​</div>​
<div class=​"expandThisSection">​
<div style=​"width:​95%">​mytext</div>​
​<ul class=​"movePos">​…​</ul>​
<div><b>test</b>​</div>
​<div>​<b>abc</b> Get this text</div>
​<div id=​"vendLogo">​…​</div>
</div>
<div class="expandThisSection">
<table>...</table>
</div>
I want the content of the div that has style of 95% width.That is value I want is "mytext". But I am not able to find out xpath for the same.
Also I want xpath for finding the div content just above div with id=​"vendLogo". That is I want "Get this text".
NOTE: ITS ASSURED THAT THIS Bold tag WILL CONTAIN "abc"
How to do it? I am using selenium with Java
Got the first one. Not able to get second one.
Code:
List<WebElement> currentSkuDescription = driver.findElements(By.xpath("//div[#class='expandThisSection']/div"));
for(WebElement currentItem: currentSkuDescription) {
WebElement descriptionBlock = currentItem.findElement(By.xpath("//div[contains(#style, 'width:95%')]"));
description= descriptionBlock.getText();
}
Try dropping the #class='expandThisSection' because the div you want does not have that class attribute (it's parent does). Also, an exact match may be possible.
By.xpath("//div[#style='width:95%']
By.xpath("//div[contains(#style, 'width:95%')]
Either of those should work. If you want to make sure you are grabbing the right one, relative to the parent, use XPath axes...
//div[contains(#class, 'expandThisSection')]/child::div[contains(#style, 'width:95%')]
If you to search for the div by a specific text (in this case 'mytext') this you can use this xpath:
"//div[text()[contains(.,'mytext')]]/ancestor::div[#class='expandThisSection']"
Or if you want by the styling, the you can use this xpath:
"//div[#style='width:95%']/ancestor::div[#class='expandThisSection']"
Note that the second xpath will only work where the inline styling is done on the tag.
For the second query, try this xpath:
"//div[#id='vendLogo']/preceding-sibling::div[1]"
To get the specific text you require, you can do the following:
String text = driver.findElement(By.xpath("//div[#id='vendLogo']/preceding-sibling::div[1]")).getText();
text.replace(div.findElement(By.tagName("b")).getText(), "");

Handle elements that have changing ids

I am running the script to automate test cases and found that id's keep on changing. Below is my HTML code
Firebug for test drive:
<button class="G0036HC-b-a G0036HC-b-o G0036HC-b-g" id="gwt-uid-470" tabindex="0" aria-labelledby="gwt-uid-470" role="button" type="button"><div class="G0036HC-b-j">Click to continue</div></button>
Inspector:
<button class="G0036HC-b-a G0036HC-b-o G0036HC-b-g" id="gwt-uid-320" tabindex="0" aria-labelledby="gwt-uid-320" role="button" type="button"><div class="G0036HC-b-j">Click to continue</div></button>
Only id's changes.
Any Help would be appreciated.
You can get the element by xpath and check that id attribute starts with gwt-uid-:
//button[starts-with(#id, "gwt-uid-")]
Besides, the answer #alecxe suggested I would also suggest you to try with text based xpath search. I often faced issue with wait so also suggest to use explicit wait this.
// //div[.='Click to continue']/..
By byXpath = By.xpath("//div[.='Click to continue']");
WebElement myDynamicElement = (new WebDriverWait(driver, 10)).until(ExpectedConditions.presenceOfElementLocated(byXpath));
// myDynamicElement.click();
Considering the following observations, the below code should work fine.
All the buttons on the page are prefixed with gwt-uid- with changing number suffix
If the buttons on the page have a unique text then use
By.xpath("//button/div[text()='Click to continue']")
If there are multiple buttons with same text then use indexes. eg. two close buttons with same text then use,
By.xpath("(//button/div[text()='Close'])[2]") # for the 2nd occurence, mind that selenium is not zero indexed
use following...
//input[#id=’’]/following::input[1]
You can use preceding in the same way to identify the child node

Categories

Resources