So I'm using Mechanize in Ruby to do some website scraping and want to find all nodes with a specific style attribute.
I want to return all nodes with a style attribute that has specific top value on the webpage.
The HTML will look like this:
<div id="c11285" style="position:absolute;top:1px;left:333px;width:65px;height:226px;overflow:hidden;background-color:transparent;z-index:10;border: 1px solid #000" onclick="">
In this case I cannot use the id, because each variation of the page has different ids so I want to search by the top value in the style attribute which in this case is 1px.
I've tried using webPage.search("div['style=top: 1px;']")
However, this does not work as px seems to cause an error.
Any suggestions on how I could achieve this or is this even possible?
It scans all elements and return those which have top:1px in style attribute.
//*[contains(#style, 'top:1px')]
Related
I want to select the text "Auto-Publish" in Span. How can I do it with a CSS selector? with Xpath I know how to do it. I am using Nightwatch for UI automation. I want to make a generic function in the page object which will take a value as a parameter.
SelectFilterValue(value){
.click(`//span[text()="${value}"]`)
}
I can't do it like this since it's an XPath and I have to specify that it's an XPath. If it was a CSS selector I could do it since I don't have to specify that it's a CSS selector. Or is there is any way that I can do it with Xpath too?
CSS does not have any method like text. So in HTMLDOM, it is not possible at this point of time to locate the element based on text.
Moving further, You could do below in nightwatch.js
.useXpath().click('//span[contains(text(), "' + desiredText+ '")]')
and before calling this assign Auto-Publish to the desiredText variable.
Give a specific id to span tag and then edit css. You can also use inline css which will be the best option.
<span style="color:blue;">
I am trying to retrieve the value in the data-appid field, I have tried using following-sibling but its not really a sibling per se. Not sure how to go about retrieving this. Any pointers will really be great.
<div class="section app" data-appid="532054761" data-updateid="10184169">
The sibling axis applies to elements, not attributes.
You can reference data-appid simply as an attribute of the div element. For example,
//div/#data-appid
will select 532054761
If you need to be more specific about the particular div element for which you want its data-appid, you can use a predicate to select a particular div element. For example:
//div[#data-updateid='10184169']/#data-appid
You need to use getAttribute() method
Try the following code
String dataAppId = driver.findElement(By.xpath("//div[#class='section app']")).getAttribute("data-appid");
System.out.println(dataAppId);
I have 2 elements that have the same attributes but shown one at a time on the page (When one is shown, the other disappears).The only difference between the two is that the element which is displayed will have the '::before' selector. Is it possible to use an xpath or css selector to retrieve the element based on its id and whether or not it has ::before
I bet also to try with the javascript solution above.
Since ::after & ::before are a pseudo element which allows you to insert content onto a page from CSS (without it needing to be in the HTML). While the end result is not actually in the DOM, it appears on the page as if it is - you see it but can't really locate it with xpath for example (https://css-tricks.com/almanac/selectors/a/after-and-before/).
I can also suggest if possible to have different IDs or if they in different place in the DOM make more complex xpath using above/below elements and see if it is displayed.
String script = "return window.getComputedStyle(document.querySelector('.analyzer_search_inner.tooltipstered'),':after').getPropertyValue('content')";
Thread.sleep(3000);
JavascriptExecutor js = (JavascriptExecutor) driver;
String content = (String) js.executeScript(script);
System.out.println(content);
I've found lots of Nokogiri examples of how to use XPath, or CSS, to find nodes with a particular attribute 'foo'.
I'm not quite getting how to find all the node where a certain attribute equals a certain value.
Specifically, given a HTML doc that might contain multiple instances of:
<span class='irrelevant' attrFoo='valueBar'>Some Text</span>
How would I find them using Nokogiri?
I thought this would do the trick:
doc.xpath("//span[contains(#attrFoo, 'valueBar')]")
But it returns an empty array.
Doh. The XPath in my question works perfectly. I had the wrong case for the attribute, e.g., it should have used #attrFoo but I had #attrfoo.
I am trying to use xpath within selenium to select a div element that is within a td.
What I am really trying to do is determine the class of the div and if it is either classed LOGO1, LOGO2, LOGO3 and so on. Originally I was going to just snag the image:url to determine with logo.jpg was used but whoever made the target website used one image for each logo type and used css to determine which portion of the image will be displayed. So Imagine 4 images on one sprite image. This is the reason why I have to determine the class of the div instead of digging through the css paths.
In selenium I am using storeElementPresent | /html/body/form/center/table/tbody/tr/td[2]/div[3]/div[2]/fieldset/table/tbody/tr[2]/td/div/table/tbody/tr[${i}]/td[8]/div//class | cardLogo .
The div has multiple classes so I am thinking that this is the issue, but any help is appreciated. Below is the target source. This is source from within the table in the tbody. Selenium has no problems identifying all the way up to td[8] but then fails to gather the div. Please help!
<td class="togglehidefields" style="width:80px;">
<div class="cardlogo LOGO1" style="background-image:url(https://www.somesite.com/merchants/images/image.jpg)"></div>
<span id="ContentPlaceHolder1_grdCCChargebackDetail_lblCardNumber_0">7777</span>
</td>
I was fiddling with selenium.getAttribute() but it kept erroring out, any ideas there?
This <div/> element has one class attribute with one value, but this one is tokenized when parsed as HTML.
As selenium only supports XPath 1.0, you will need to check for classes like this:
//div[contains(#class, "LOGO1") or contains(#class, "LOGO2")]
Extend that pattern as needed and embed it in your expression.
With XPath 2.0 and better, you could tokenize and use the = operator which works on a set-based semantics:
//div[tokenize(#class, ' ') = ("LOGO1", "LOGO2")]
Old post but I'll put the solution I used up just in case it can help anyone.
xpath=//div[contains(#class,'carouselNavNext ')]/.[contains(#class, 'disabled')]
Fire of your contains, and then follow with /. to check children AND the current element.