Hello I'm new to selinium ide and xpath thing, that's why I need help regarding this one. I need to click some links on a website i can make it work in 1 link I don't know how it will search and click the other link because it has different number and post title. The link look like this one.
http://imageshack.com/a/img27/328/zv17.png
post
post
post
I use this xpath and it works on first link
//div[#id='main']/ul[2]/li[1][#class='notification-posted']/a[2]
What is the right xpath that will click 1 link and the preceding links
please help me with this one
Edit
Thank you so much your first code it works but not the second one. but every post in ul is important, your code is working on the first post in ul.
<h5>20 seconds ago</h5>
<ul>
<li class="notification-posted">
<img height="15" alt="" src="/assets/images/icons/notification-posted.png" />
wews
send new
post <!--//li[#class='notification-posted'][1]/a[2]-->
</li>
</ul>
<h5>3 minutes ago</h5>
<ul>
<li class="notification-posted">
<img height="15" alt="" src="/assets/images/icons/notification-posted.png" />
yokol
submitted a new
post <!--//li[#class='notification-posted'][2]/a[2]-->
</li>
</ul>
<h5>4 minutes ago</h5>
<ul/>
<h3>6 minutes ago</h3>
<ul/>
<h5>7 minutes ago</h5>
<ul>
<h2>8 minutes ago</h2>
<ul />
<li class="notification-posted" />
<li class="notification-posted" />
<li class="notification-posted" />
<li class="notification-posted" />
<li class="notification-posted" />
<img height="15" alt="" src="/assets/images/icons/notification-posted.png" />
hey
send new
post <!--***Problem was here***-->
</ul>
that should be
//li[#class='notification-posted'][6]/a[2]
right? but it parse other link. thank you for your answer.
/ul[2]... should return the first post of the second ul
Assuming that the number of posts per ul is both variable, and also not important (i.e. you want the posts irrespective of which ul they are in), then you can bypass the ul.
If <li class='notification-posted'> uniquely identifies posts, you can reference the 3 links as follows:
(//li[#class='notification-posted'])[1]/a[2]
(//li[#class='notification-posted'])[2]/a[2]
(//li[#class='notification-posted'])[3]/a[2]
(// ... )[n]/a[2]
The a[2] is needed because you are after the second link in each instance.
If this isn't selective enough, you can add the filter that the li must also contain an img of notification-posted.png icon is always associated with the hyperlink:
(//li[#class='notification-posted'][img src="/assets/images/icons/notification-posted.png"])[1]//a[2]
and the same for links [2] and [3]
Edit
You can find all links which have the text post with the following xpath:
//a[#href][normalize-space(.)='post']
Tested on the (xhtmlized version of your html) with the following xsl:
<xsl:for-each select="//a[#href][normalize-space(.)='post']">
<Link>
<xsl:value-of select="#href"/>
</Link>
</xsl:for-each>
Gives:
<Link>/news/53235</Link>
<Link>/news/253129-loss</Link>
<Link>/news/25151-helloworld</Link>
You can find all links like this:
//a[starts-with(#href,'/news/')]
or:
//a[starts-with(#href,'/news/')]/#href
Related
I am working on a bespoke WordPress build and for some reason, I just cannot get some anchor links to work. It's driving me potty and I just don't know what the problem is.
I have discovered, static anchor links are working fine (the back to top button works). However, I am using Advanced Custom Fields to generate ID's for the anchor tags. The IDs are generating correctly, but won't work as anchor tags.
Anyone have any ideas? The bit I am referring to is the service boxes near the bottom of the page. The idea being you click on these and that they will take you to the services page, and down to the relevant section.
The markup I am using is:
<ul class="cf">
<li>
<div>
<a href="/services/#dimensional-surveys">
<div class="filter"></div>
<img width="500" height="600" src="pexels-photo-175771-500x600.jpeg" class="attachment-feature size-feature" alt="" />
<h3>3D Dimensional Surveys</h3>
</a>
</div>
</li>
</ul>
<ul class="service-list cf">
<li id="#dimensional-surveys">
<div class="feature" style="background-image:url(pexels-photo-175771.jpeg);">
</div>
</li>
</ul>
Just remove the # from id and it will work.
<ul>
<li id="example"></li>
</ul>
I have looked at your page
The point where an ancor should jump to should have no #
You do: <li id="#dimensional-surveys">
But do just <li id="dimensional-surveys">
Fix that first and test again.
You don't want the '#' on the anchor: <li id="#example"></li> should be <li id="example"></li>
I'm new to selenium ide and i want to automate some websites. i want it to be like this.
Click
Click Link 1
do some clicking inside that link
go back to the list of link
Click Link 2
do some clicking inside that link
go back to the list of link
Click Link 3
and so on
my only problem here is i don't know how it will click the first link from the top. this is the html of the website.
<h5>20 seconds ago</h5>
<ul>
<li class="notification-posted">
<img height="15" alt="" src="/assets/images/icons/notification-posted.png">
wews
send new
post **Link 1**
</li>
</ul>
<h5>3 minutes ago</h5>
<ul>
<li class="notification-posted">
<img height="15" alt="" src="/assets/images/icons/notification-posted.png">
yokol
submitted a new
post **Link 2**
</li>
</ul>
<h5>4 minutes ago</h5>
<ul>
<h3>6 minutes ago</h3>
<ul>
<h5>7 minutes ago</h5>
<ul>
<h2>8 minutes ago</h2>
<ul>
<li class="notification-posted">
<li class="notification-posted">
<li class="notification-posted">
<li class="notification-posted">
<li class="notification-posted">
<img height="15" alt="" src="/assets/images/icons/notification-posted.png">
hey
send new
post **link 3**
</li>
</ul>
I haven't used Selenium ide, but I have used Selenium Webdriver for python which is similar
You just need to locate your element by css selector, specifically structural selectors; this is prob the easiest way if you have to dig through a lot of markup that doesn't have ids/classes
CSS has descendent selectors and psuedo-element selectors that allow you to target specific elements based solely on their position within the DOM, without needing an id or class
you can use the :nth-of-type() psuedo element, which targets the specific occurrence of that element based on the number you pass to it
for example in plain css:
a:nth-of-type(1)
would look within the body and select the a that is the first of its type. if you used 2 instead, it would target the second occurrence of an anchor.
for example, in selenium.webdriver this is how you'd find your element:
# ff is the webdriver.Firefox() instance
firstAnchor = ff.find_element_by_css_selector("a:nth-of-type(1)")
secondAnchor = ff.find_element_by_css_selector("a:nth-of-type(2)")
You can use that to target the 1st, 2nd, 3rd etc elements. There's also css attribute selectors too if you need to target an element based on a specific attribute value
ff.find_element_by_css_selector("a[href='/account/54351-wews']")
good luck mayne. cholla cholla hee haw
I'm fairly new to expression engine so forgive me if this question comes across pretty obvious I have a slight problem with integrating exp:resso store tag in my temple, for some reason all
the code i apply under exp:resso's {store} tag doesn't appear on my broswer. The code below demonstrates how i have structured my EE tags, please correct me if i'm wrong...
{exp:channel:entries channel="products" limit="6" paginate="bottom"}
{exp:store:product entry_id="1" return="cart"}
<ul class="inventory">
<li class="item2"> {p_productimage}<img class="itemImg" alt="" src="{p_productimage_image}"/>{/p_productimage}
<div class="product-fam1">
<h3>{p_title}</h3>
<a class="viewItem" href="#"><img src="iamnatesmithen.com/fluotics/css/images/viewItem.jpg";</a>
</div>
</li>
</ul>
{/exp:store:product}
{/exp:channel:entries}
ExpressionEngine test site: http://www.iamnatesmithen.com/ExpressionEngine2/index.php/inventory
Current static site: http://iamnatesmithen.com/fluotics/products.html
Looks like you're not passing the product's entry id to {exp:store:product} correctly. Have you tried this? Note {exp:store:product entry_id="{entry_id}"...
{exp:channel:entries channel="products" limit="6" paginate="bottom"}
{exp:store:product entry_id="{entry_id}" return="cart"}
<!-- snip -->
{/exp:store:product}
{/exp:channel:entries}
I have two CSS files,
pic off the problem:
this pick shows no caps in the css. the css you see in the first pick is not that of the menu but that does not matter seeing it affects all css.
1: is the original
link
2: the copy
link
IE problem only
now my problem is that they do not act the same way as you would expect. the original shows the content as you would expect. the second does not show the drop down menu as it supposed to do.
the second thing is that if I look at the CSS on the in the browser it self than the original is all lowercase and the copy the tags are capitals. with seems to cause some of the trouble.
things I have checked:
DOCTYPE
ID
Classes
structure
style tag vs .css
HTML
original:
<div style="margin-left: 50px;">
<ul id="menu">
<li>Login </li>
<li>Help
<ul id="help">
<li>
<img alt="" class="corner_inset_left" src="corner_inset_left.png" />
General help
<img alt="" class="corner_inset_right" src="corner_inset_right.png" />
</li>
<li>Posts</li>
<li>Pages</li>
<li class="last">
<img alt="" class="corner_left" src="corner_left.png" />
<img alt="" class="middle" src="dot.gif" />
<img alt="" class="corner_right" src="corner_right.png" /> </li>
</ul>
</li>
</ul>
<img alt="" src="menu_right.png" style="float: left;" /> </div>
Copy http://pastebin.com/qsdz7pnj
Files are different - at least the second one contains additional min-width: 130px; in #menu li style. Also #menu li ul has different color set in those files. Maybe there's something more, haven't looked further.
As Sergey Kudriavtsev says the files are different. The most significant potentially being:
Original:
#menu > li {
"Copy":
#menu li
And there is this again somewhere else. This is changing the selector and thus potentially what elements the style is applying to.
Are these files meant to be the same? The fact that you call them a copy makes me think they are but they are quite clearly not which makes me wonder if the underlying problem is just how they got to be different in the first place...
The way to solve the CAPS in the CSS is a simple meta tag in the head.the caps in the script came from Quirks-mode. to stop the IE browser to use this mode use the meta tag shown here
<!-- Enable IE9 Standards mode -->
<meta http-equiv="X-UA-Compatible" content="IE=9" >
There seems to be conflicting examples in documents relating to the <nav> tag in html5. Most examples I've seen use this:
<nav>
<ul>
<li><a href='#'>Link</a></li>
<li><a href='#'>Link</a></li>
<li><a href='#'>Link</a></li>
</ul>
</nav>
But I'm wondering if that's only because people are used to using divs. There are examples that I've seen that simply do this
<nav>
<a href='#'>Link</a>
<a href='#'>Link</a>
<a href='#'>Link</a>
</nav>
The second way seems cleaner and more semantic to me. Is there an "official" correct version? Is there a good reason to still use a <ul> inside the nav tag rather than just use anchor elements directly?
Both examples are semantic.
In the first example, the list of anchors is explicitly an unordered list. In the second example, the list of links is just a collection of anchor elements.
If you simply want a one-dimensional collection of links, I recommend sticking with
<nav>
<a href='#'>Link</a>
<a href='#'>Link</a>
<a href='#'>Link</a>
</nav>
however, using ul elements allows for explicit hierarchical menus (such as drop-downs or tree-lists):
<nav>
<ul>
<li>
Link
</li>
<li>
Link
<ul>
<li>
Sub link
</li>
<li>
Sub link
</li>
<li>
Sub link
</li>
</ul>
</li>
<li>
Link
</li>
<li>
Link
<ul>
<li>
Sub link
</li>
<li>
Sub link
</li>
</ul>
</li>
</ul>
</nav>
The only real difference might be how search engines might look at the links. When in an unordered list Google might for example understand that all the items in that list are related. In the second example Google might just as well assume none of the links are related. Google can use that information for indexing and display your information more accurately.
They may display the same, but really a lot of markup is about how information should be presented if there was no style attached to the page at all or if a bot is searching your website for relevant information.
You can use either.
A list only tends to be used as a list of links is generally just that, a list. But, it's up to you.
There is no real difference between them. However like Caimen said, search engines use the page markup to group data to better web search results. I'd advise you use the first if the links are quite similar on topic (eg for a blog) and the second if the links aren't so similar (for navigating results from a website search).