Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Click element by Value - protractor

I am clicking to modal window which is pretty simple. In general only relevant part is this:

<div id="partSelection">
   <button value="0" name="partSelection">BLATNÍK P L</button>
   <button value="1" name="partSelection">BLATNÍK P P</button>

I need to click one of this button, I know how to click this with: xpath:

element(by.xpath('//*[@id="partSelection"]/button[2]')).click();

also way with button text:

element(by.buttonText("BLATNÍK P P")).click();

but I noticed there as different values for each button and I belieave this is something which is not going to change by developers. Is there a way how to click element base on value?

Thank you for your advises.

like image 240
Andurit Avatar asked Feb 09 '23 11:02

Andurit


2 Answers

Adding to an existing answer.

You can solve it using the following CSS selector:

element(by.css("#partSelection button[value=0]")).click();

Or, using a by.xpath() locator:

element(by.xpath("//div[@id='partSelection']/button[@value='0']")).click();

Note that, if you are going to use the "by value" technique often, to follow the DRY principle, it could be a good idea to define a custom by.value() locator:

  • How to globally add a custom locator to Protractor?
like image 154
alecxe Avatar answered Feb 11 '23 23:02

alecxe


this example should work if you want to just look up a specific attribute. I usually refer to this css selectors when I'm trying to figure out the best way to find a specific attribute.

basically the breakdown is to find the tag you want in our case we want button and then we want to find the attribute within that tag. So we have the choice of value or name. Name is the same for both buttons so we don't want to use that. However the value is different for each button so that would be good to use in this case.

element(by.ccs('tag[attribute=""]');

tag = button

attribute = value

element(by.css('button[value="0"]')).click(); // button with text BLATNÍK P L 
element(by.css('button[value="1"]')).click(); // button with text BLATNÍK P P
like image 27
BarretV Avatar answered Feb 11 '23 23:02

BarretV