Inserting links inside each iteration - express

I'm new to jade and i've been trying to iterate over an array containing some text that needs to be turned into URL's. Anything I put in the parentheses after list-group-item= besides the array value will break the page. The only thing that works is putting the anchor tag in the next like. Is there no way to make the iteration into a link?
extend layout
block content
.container
.row
.col-md-6.col-md-offset-3
ul.list-group#servers
- each server in servers
li.list-group-item=( server.name)
a.small(href="server/"+server.id) List
Things I've tried:
li.list-group-item=( a.small(href="server/"+server.id) List )
I tried searching their docs but couldn't find any explanation or examples.

Solved it
extend layout
block content
.container
.row
.col-md-6.col-md-offset-3
ul.list-group#servers
- each i in servers
li.list-group-item
a(href="server/"+i.id)
=i.name
Moved the anchor to the next line and nested it under li. Nested the name underneath the anchor tag.

Related

Click on first element contained in a div

I have a div that contains a set of dynamic elements. I want to click on the first search result.
I want to click on the first element contains in
I tried using creating a custom xPath like so but it didn't work. Any ideas here?
//div[1][contains(text(), 'listing')]
First of all It would've helped if you had provided more information.
best will be using pseudo-child like div.firstChild or if the elements are generated dynamically you can add a class and use document.querySelectorAll(".class") which will give you an array of elements that had the class.
You can use array[0] to use click on the first element.
For anyone coming across this thread here is the solution
const listings = await page.$x('//*[contains(#id,"listing_")]')

Selenium find element next to another one

I need to find an element that is located next to another one depending to an if condition.
For example, I'm trying to retrieve the bottom with the word “Log In & Pay” only if I found the words ‘DANA’ before.
I can find the first element with text DANA in this way, but how can I find then the next botton element with the text “Log In & Pay” ?
driver.findElement(By.xpath ("//*[contains(text(), 'DANA')]"));
Below the Html page:
Get the span with the desired text, find the closest ancestor div which contains both els, find the el you want from there. i.e.
//span[contains(text(), 'DANA')]
//ancestor::div[#class='web-pay-wallet-inside-wrap']
//div[#class='action']
/div[contains(text()='Log In & Pay')]
try using nested predicates
//div[span[contains(text(), 'DANA')]]/following-sibling::div[#class='action']/div
Explanation
//div[span[contains(text(), 'DANA')]] finds the div which contains span with text DANA
following-sibling::div finds the following div at the same level
Selenium 4 introduces relative locators which allow to look up elements in relative position to others. Like:
above
below
right of
left of
and even "near"
You can find examples here.

How I can add an ul li list element using an element of WebControls in VisualBasic

I'm working in an old project creating a User Control to add code that will change as I need.
I'd like to add a list element but I only found the property to create list type of <select> using <asp:ListBox, but this is not that I'm looking for
Do you know how generate a <ul><li> elements using Global.System.Web.UI.WebControls? or at least modify its CssClass properties since my VB code. It'd be amazing if I can use a loop to generate the list items.
Thanks in advance
One solution would be to add a BulletedList in your WebForm.aspx:
<asp:BulletedList ID="BulletedList1" runat="server"></asp:BulletedList>
Then in your WebForm.aspx.vb you can add items:
For i As Integer = 1 To 3
BulletedList1.Items.Add("item" & i)
Next
If you inspect your page in a web browser you will see these are equivalent to <ul><li> HTML tags.

Selenium finding elements returns incorrect elements

I'm using Selenium to try and get some elements on a web page but I'm having trouble getting the ones I want. I'm getting some, but they're not the ones I want.
So what I have on my page are five divs that look like this:
<div class="membershipDetails">
Inside each one is something like this:
<div class="membershipDetail">
<h3>
VIP Membership
</h3>
</div>
They DO all have this same link, but they don't have the same text ('VIP Membership' would be replaced by something else)
So the first thing was to get all the divs above in a list. This is the line I use:
listElementsMembership = driver.find_elements_by_css_selector(div[class^='membershipDetail'])
This gives me five elements, just as I would expect. I checked the 'class' attribute name and they are what I would expect. At this point I should say that they aren't all EXACTLY the same name 'membershipDetail'. Some have variations. But I can see that I have all five.
The next thing is to go through these elements and try and get that element which contains the href ('VIP Membership').
So I did that like this:
for elem in listElementsMembership:
elemDetailsLink = elem.find_element_by_xpath('//a[contains(#href,"EditMembership")]')
Now this does return something, but it always got me the element from the FIRST of the five elements. It's as if the 'elem.find_element_by_xpath' line is going up a level first before finding these hrefs. I kind of confirmed this by switching this to a 'find_elements_by_xpath' (plural) and getting, you guessed it, five elements.
So is this line:
elemDetailsLink = elem.find_element_by_xpath('//a[contains(#href,"EditMembership")]')
going up a level before getting its results? If it is, now can I make it not do that and just restrict itself to the children?
If you are trying to find element with in an element use a . in the xpath like below:
listElementsMembership = driver.find_elements_by_css_selector(div[class^='membershipDetail'])
for elem in listElementsMembership:
elemDetailsLink = elem.find_element_by_xpath('.//a') # Finds the "a" tag with respect to "elem"
Suppose if you are looking for VIP Membership:
listElementsMembership = driver.find_elements_by_css_selector(div[class^='membershipDetail'])
for elem in listElementsMembership:
value = elem.find_element_by_xpath('.//a').get_attribute("innerText")
if "VIP Membership" in value:
print(elem.find_element_by_xpath('.//a').get_attribute("innerText"))
And if you dont want iterate over all the five elements try to use xpath like below: (As per the HTML you have shared)
//div[#class='membershipDetail']//a[text()='VIP Membership']
Or
//div[#class='membershipDetail']//a[contains(text(),'VIP Membership')]
You've few mistake in that css selector.
Quotes are missing.
^ is for starts-with, not sure if you really need that. In case it's partial matching please use * instead of ^
Also, I do not see any logic for the below statement in your code attempt.
The next thing is to go through these elements and try and get that
element which contains the href ('VIP Membership').
Code :
listElementsMembership = driver.find_elements_by_css_selector("div[class*='membershipDetail']")
for ele in listElementsMembership:
e = ele.find_element(By.XPATH, ".//descendant::a")
if "VIP Membership" in e.get_attribute('href'):
print(e.text, e.get_attribute('href'))
You can give an index using a square bracket like this.
elemDetailsLink = elem.find_element_by_xpath('(//a[contains(#href,"EditMembership")])[1]')
If you are trying to get an element using XPath, the index should start with 1, not 0.

How to select the element in HTML tags based on its text in Behat?

I'm running the following Behat scenario:
Then I should see "Testing body" in the "strong" element
for the following HTML snippet:
<strong>Testing body</strong>
However I am getting an error:
The text "Testing body" was not found in the text of the element matching css "strong"
What is the best way to check if element contains below tags?
<em>Testing body</em>
<ol><li>Testing body</li>
</ol>
<ul><li>Testing body​​​​​​​</li>
</ul>
I am trying to use wysiwyg.feature with syntax:
Then I should see "Testing body" in the "<Element>" element with the "<Property>" CSS property set to "<Value>" in the "Pearson Content" region
Make sure the selector used is unique.
Depending on the method used you might need id|name|label|value or css selector.
I your case the selector used is too general, you need to narrow the section by adding an extra element in front of this to tell him to search in a smaller section.
For example: #myid strong -> will search strong in the element that has the id myid
Same thing for the other elements, you could have ol>li or ul>li, but if more elements are found you will need to add an extra selector in front to narrow the section.
Always check the CSS manually in the browser and make sure is unique or the element that you need is found first.
If you want to check for an element that contains some text, you could use XPath like this:
//strong[contains(text(), 'Testing body')]
You can also use a css if you can identify this section as I said above, but I need more from the html, a large section in order to get a better selector.
The following method may help:
/**
* #Given I should see :text in the :tag element
*/
public function iShouldSeeInTheElement($text, $tag) {
$this->verifyElementByXpath("//${tag}[contains(text(), '${text}')]");
}
Instead of contains, you can also use starts-with and other.
Note: I haven't tested it, so please suggest improvements if you do.