How to select last element in Selenium Webdriver using Javascript?

Question

I create a script to verify that an element is successfully added. The added element always at the end of the page or become last element in different div. I am using selenium webdriver and javascript. Here's HTML code

<div class="row">
<div class="form-group col-sm-2 col-xs-12">
        <label>Entity Name</label>
        <input value="ttax" class="form-control entity-name" disabled="">
</div>
</div>
<div class="row">
<div class="form-group col-sm-2 col-xs-12">
       <label>Entity Name</label>
       <input value="Room" class="form-control entity-name" disabled="">
</div>
</div>

I tried this

let new_entity = await driver.findElement(By.css("div:nth-child(2) > div.form-group.col-sm-2.col-xs-12 > input").last()
let entity_value = await new_entity.getAttribute('value')
expect(entity_value).to.be.eq(entity_name)

But I got error element.last() is not function

Can anyone help me? I can not find references about selenium webdriver in javascript, most of them using java. ss

Already we have post on the same issue please find it here https://stackoverflow.com/questions/15788679/selenium-xpath-how-to-select-last-matching-element-in-a-table — issuesolver in, Aug 31 '20 at 05:41

issuesolver in · Answer 1 · 2020-12-08T17:13:35.250

0

Here when you want to use the last or first element then we have to get an element array. Instead of findElement, we can use findElements

let new_entity = await driver.findElements(By.css("..")).last();

let entity_value = await new_entity.getAttribute('value'); expect(entity_value).to.be.eq(entity_name);

edited Dec 08 '20 at 17:13

answered Aug 31 '20 at 05:43

issuesolver in

41
3

I tried using yours but got error ```InvalidSelectorError: invalid selector: An invalid or illegal selector was specified``` – herawati manurung Aug 31 '20 at 05:57

DebanjanB · Accepted Answer · 2020-08-31T07:19:13.113

0

As the added element always becomes the last element to verify the added element you need to locate the last-child of the parent element which you haven't shown us in the HTML within the question. So to locate the last-child you can use the following css-selectors based Locator Strategy:

Using css:

let new_entity = await driver.findElement(By.css("immediateParentTag div:last-child > div.form-group.col-sm-2.col-xs-12 > input"))

edited Aug 31 '20 at 07:19

answered Aug 31 '20 at 06:25

DebanjanB

118,661
30
168
217

I still can not get the last element, I got first element, I want to get 'Room'. I attached the snippet code on my post – herawati manurung Aug 31 '20 at 06:34
Instead of the image can you update the question with the text based HTML? – DebanjanB Aug 31 '20 at 06:37
You need to provide the HTML of the first element which you don't want so we can adjust the locator, preferably along with the parent element. – DebanjanB Aug 31 '20 at 06:47
html of 1st element added – herawati manurung Aug 31 '20 at 06:50
@herawatimanurung Checkout the updated answer and let me know the status. – DebanjanB Aug 31 '20 at 07:19
1

solved using ```let entity_last_block = await driver.findElement(By.css('div.card.card-entity:last-child'))``` as parent. Thanks, debanjanB – herawati manurung Aug 31 '20 at 07:31

How to select last element in Selenium Webdriver using Javascript?

2 Answers2