CODEWITHSUNDEEP
angularjsseleniumprotractor
Utpal
Utpal

Reputation: 807

How to test a click event in protractor for an element which do not have id

We have build a website which i need to test using Protractor. The site have many elements which do not have any id. So protractor.by.id will not work here. I have the protractor.by.css option but how will I distinguish a unique element if group of element have the same css applied. Please suggest.

<div class="buttons contact_page"> 
<a href="http://mysite.se/om-oss/" class="btn btn-default button">Om oss</a>
<a href="http://mysite.se/offert-3/" class="btn btn-default button">Offert</a> 
<a href="http://mysite.se/tjanster/" class="btn btn-default button">Våra Tjänster</a>
</div>

Thanks Utpal

Upvotes: 1

Views: 9409

Answers (5)

Thilina Koggalage
Thilina Koggalage

Reputation: 1084

Try this. This will click the the second tag.

element(by.css('.contact_page ')).all(by.tagName('a')).get(1).click();

Upvotes: 0

Aaron
Aaron

Reputation: 2477

This can be done by using by.cssContainingText(). Check out the docs.

In your case, if you wanted to select the middle button:

element(by.cssContainingText('.btn', 'Om oss');

Upvotes: 0

Ziwdigforbugs
Ziwdigforbugs

Reputation: 1214

In your case you can use :

element(by.partialLinkText("oss"));

Upvotes: 1

Bastien Caudan
Bastien Caudan

Reputation: 4490

There is a lot of different ways to select an element with protactor. You can take a look at protractors unit test to see all available locators.

The right locator mostly depends on your specific case to make your test be as robust as possible.

Rely on text or index could sometimes be a bit flaky and adding a specific id or css class to an element could also be an option to consider.

Upvotes: 1

mylescc
mylescc

Reputation: 6859

Have you tried using the :nth child selector with the css selector? So you could do something like:

var firstBtn = element(by.css('.contact_page btn:nth-child(0)')),
    secondBtn = element(by.css('.contact_page btn:nth-child(1)')),
    thirdBtn = element(by.css('.contact_page btn:nth-child(2)'))

Here's a good article on how nth-child works, just in case http://css-tricks.com/how-nth-child-works/

Let me know how it goes!

Upvotes: 1

Related Questions