Java and Selenium: Problems accessing checkbox elements in a modal - java

Page with a pop-up page/modal window, showing a list of (among others) checkboxes.
I'm having problems with Selenium not finding these elements.
Markup:
<td class="journalTabell-arkivstatus">
<div class="hb-grid hb-grid--gapSM">
<div data-e2e-selector="saksjournal-checkbox-style" style="visibility: visible;">
<input type="checkbox" data-e2e-selector="saksjournal-checkbox" id="erArkivert-0">
<div class="hb-label">
<label data-e2e-selector="saksjournal-checkbox-lbl" for="erArkivert-0"</label>
</div>
</div>
<div id="journalPostArkiverStatus-0">
<div class="haster ng-star-inserted">
<hb-ikon class="haster-ikon hb-ikon id="hb-alert-circle-98ec342a-966f-4f5f-9d84-24a2ac4c271e" aria-hidden="true">
<svg focusable="false">
<use xlink:href="assets/sprite.symbol.svg#ikon-hb-alert-circle"></use>
</svg>
</hb-ikon>
<div class="ng-star-inserted">Ikke arkivert</div>
<div class="ng-star-inserted">Last ned journalpostog kryss av når du har arkivert manuelt
</div>
</div>
</div>
</div>
</td>
There are several of these checkboxes, with id's erArkivert-0, -1, -2 and so on.
See the attached screenshot.
The Java/Selenium code looking for the elements:
public List<WebElement> getArkiveringsKnapper() {
Wait().until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector("[data-e2e-selector='saksjournal-poster']")));
return driver.findElements(By.cssSelector("[data-e2e-selector='saksjournal-checkbox']"));
}
When using the above method (cssSelector for the checkbox element) to find the checkboxes, all three are found. However, Selenium throws the following error
org.openqa.selenium.ElementClickInterceptedException: element click intercepted
Earlier, I've solved this by clicking the label for the checbox instead of the checkbox itself.
But if I use this to find the checkboxes
return driver.findElements(By.cssSelector("[data-e2e-selector='saksjournal-checkbox-lbl']"));
Selenium throws this error:
org.openqa.selenium.ElementNotInteractableException: element not interactable
And if I try using xPath with the first part of the selector (since there are several of them, and they end with -0, -1, -2 etc.):
return driver.findElements(By.xpath("//*[#id=\"^erArkivert-\"]"));
Selenium doesn't find the elements at all.
Any ideas? I'm seeing more and more of these problems in test suites where the code has been working before, but after some change, Angular upgrade or other markup change, it stops working.

I have to answer my own question here, as I was able to find the cause with the help of someone much better with frontend than me.
The problem wasn't with the modal at all, which makes sense since it was able to find the element but just couldn't interact with it.
Also, it's worth remembering that - at least in my humble experience - it's allmost never possible for Selenium (or Cypress, for that matter) to directly click a checkbox. I allmost allways have to click the label element, and then verify the click on the checkbox element.
However, in this case, the label element had a size of zero. So it couldn't be clicked (hence, the "element not interactable" error).
So I solved it by click the element in which the element is placed, by going first to the outside of that, and then clicking the only inside that element.
List<WebElement> elements = driver.findElements(By.cssSelector("[data-e2e-selector=\"saksjournal-checkbox-style\"]"));
for (WebElement element : elements) {
Wait(4).until(ExpectedConditions.visibilityOf(element.findElement(By.tagName("div")))).click();
assertThat(element.findElement(By.cssSelector("[data-e2e-selector='saksjournal-checkbox']")).isSelected()).isTrue();
}

Related

selenium get li element based on index position and click the checkbox

I have this HTML now using Selenium I ant to toggle the li element with given index position say 1, where it indicates I want to click the toggle checkbox for spring.
<ul id="todo-list" data-woven="abc">
<li class="active" data-index="0">
<div class="view">
<input class="toggle" type="checkbox">
<label>Java</label>
<button class="destroy"></button>
</div>
<input class="edit">
</li>
<li class="active" data-index="1">
<div class="view">
<input class="toggle" type="checkbox">
<label>Spring</label>
<button class="destroy"></button>
</div>
<input class="edit">
</li></ul>
I am completely new to selenium so not able to understand how can we achieve this.
I know to get the UL elements using the code:
driver.findElement(By.id("todo-list"));
Now how can get the li element based on its index and click the corresponding checkbox.
To click on the checkbox element with respect to the ancestor <li> nodes index attribute you can use either of the following Locator Strategies:
cssSelector:
driver.findElement(By.cssSelector("ul#todo-list li.active[data-index='1'] input")).click();
xpath:
driver.findElement(By.xpath("//ul[#id='todo-list']//li[#class='active' and #data-index='1']//input")).click();
You can use xpath to locate an element with data-index=1
driver.findElement(By.xpath("//li[#data-index='1']//input[#class='toggle']"));
Or with cssSelector
driver.findElement(By.cssSelector("[data-index='1'] .toggle"));
You could find the element you are looking for directly with the answer #Guy gave you and that would be the right way if you knew exactly what the data-index attribute would be set to, but you could also find a collection of the li elements and then proceed to do what you need within each like this:
var container = driver.findElement(By.id("todo-list"));
var elements = container.findElements(By.tagName("li"));
with elements you can loop through each or go directly to the one you want.

I am unable to click on Button element through my code, could anybody help here

I would like to be able to click on Button through my selenium script using Java.
I tried to do it multiple ways by class, and index in xpath:
1) driver.findElement(By.xpath("contains(#class,'btn btn-alt btn-small tooltip-element') and contains(#tabindex,'0')")).click();
2) driver.findElement(By.xpath("//*button[#tabindex=0]")).click();
My html path is as below:
<a href="#" class="btn btn-alt btn-small tooltip-element" tabindex="0" role="button" data-placement="bottom" aria-label="Help" ng-click="ecdapp.uploadBlueprintModalPopup()" aria-expanded="true" aria-describedby="tooltiptextBtn"> Create <span class="arrow"></span>
</a>
Try this code:
driver.findElement(By.linkText('Create')).click();
It would seem that the link in question is part of a tooltip. Tooltips are only visible when a mouse cursor is hovered over its corresponding web element.
You'll need to hover the cursor over the element in question, then you should be able to locate the link and it should be clickable.

How do I click 1 of 2 links with same name, no id and same class. selenium java

I'm trying to get selenium to click the select button but I can't use by.linkText() because there are two buttons with the same name.
I'm using this xpath ".//*[contains(#id,'view-something_111111_2A22DF2_)']/div/a[text()='Select']"; to find the button but it can't find it.
I've also tried ".//*[contains(#id,'view-something_111111_2A22DF2_)']/div/a";.
I've looked over the Selenium documentation and can't seem to find a solution.
Here is the section of website code:
<div id="view-something_111111_2A22DF2_0" class="coverage-wrap collapse" aria-expanded="false" style="height: 30px;">...</div>
<div class="btn-raplace">
<a class="btn-beer" data-toggle="collapse" data-target="#view-effectData_111111_2A22DF2_0">Select</a>
for reference, the second Select button has this code:
<div id="view-something_111111_2A3B5DF2_0" class="coverage-wrap collapse" aria-expanded="false" style="height: 30px;">...</div>
<div class="btn-raplace">
<a class="btn-beer" data-toggle="collapse" data-target="#view-effectData_111111_2A3B5DF2_0">Select</a>
which is why I am using the id in my xpath.
Thanks.
You can try this XPATH :- //*[#class="btn-raplace"]/a[#class="btn-beer"][1] here [1] is postion of ur button. Which you want to click
I can see two mistakes in the Xpath you are using.
First Mistake:
.//*[contains(#id,'view-something_111111_2A22DF2_)'] is incorrect.You have placed the single quote at a wrong place. It should be
//div[contains(#id,'view-something_111111_2A22DF2')]
Second Mistake
The element div with the class="btn-raplace" is not the child of the above element. I can see in the HTML that the above element has the closing tags before this element.
Please replace your XPATH with:
//div[contains(#id,'view-something_111111_2A22DF2')]/following-sibling::div[1]/a
Here is the Answer to your Question:
Use this xpath:
//div[#class='btn-raplace']/a[#class='btn-beer']
Let me know if this Answers your Question.

How to check for second element with class name and click it if it exists in Selenium Java

So I am writing automation tests using selenium and I am having a lot of trouble selecting the second element in a list of divs with the same class names
Boolean isExists2Accounts = driver.findElements(By.xpath("(//div[contains(#class, 'item-name')])[2]")).size() < 0;
if(isExists2Accounts)
{
//Finds second div element that has classname of item-name and clicks on it
driver.findElement(By.xpath("(//div[contains(#class, 'item-name')])[2]")).click();
}
else
{
driver.get("javascript:alert('There isn't a second account or you don't know how to select it!');");
Thread.sleep(5000);
org.testng.Assert.fail("transferTest6() Failed due to There isn't a second account or you don't know how to select it!");
}
HTML structure looks like this:
<div class="item-list">
<div class="item-name">
<div> clickable area </div>
<div class="button-wrap"></div>
</div>
<div class="item-name">
<div> clickable area </div>
<div class="button-wrap"></div>
</div>
<div class="item-name">
<div> clickable area</div>
<div class="button-wrap"></div>
</div>
<div class="item-name">
<div> clickable area </div>
<div class="button-wrap"></div>
</div>
</div>
Not really sure what I am doing wrong here, I looked at the html and there are 5 divs with the specified class name. Very new to selenium in general, using eclipse/junit/webdriver.
I have seen several questions similiar to this, and trying solutions people have posted have not worked. I have seen some suggestions to use .get(2) and I will try and implement that in the mean time.
Any help you could give would be good.
get(2) is THIRD element, not the second, as the countage begins from 0.
So:
driver.findElements(By.cssSelector(".item-name")).get(1).click();
OR depending on where is yr clickable
driver.findElements(By.cssSelector(".item-name div:not(.button-wrap)")).get(1).click();
Hey all the answer that was given by Stanjer works, I tested it with different markup, the developer that built the system I am testing through a random mousedown event (not click) for the html I am trying to interact with which was causing the problem.
So final solution with problem if it was a click event would be:
driver.findElements(By.cssSelector(".item-name")).get(1).click();
Just like he said.
However in this case I am instead going to send Javascript to the console to work with functions that have already been created by the developer.

Unable to "click()" on an element in Selenium test

I have recorded an automatic test with Selenium, exported it into JAVA code and now I am fighting to complete it. The problem is that I cannot get click(); done.
This is my code, a part of it:
try {
assertTrue(driver.findElement(By.xpath("//*[text()='Nowa oferta dokument']"))
.getText().matches("^Nowa oferta dokument$"));
} catch (Error e) {
verificationErrors.append(e.toString());
}
driver.findElement(By.xpath("//*[text()='Nowa oferta dokument']")).click();
First I find the element using xpath and then using xpath I want to click on it so its settings open.
I have tried many ways to solve it, and still can't figure it out. Do you see any solution for this one?
HTML:
<p class="photo"><img src="img/document.png"></p>
<p class="name">Nowa oferta dokument</p>
<p class="price">123 zł</p>
<div class="rate ctrlViewRateOffer" data-value="0.0000">
<span class="stars"></span>
<span class="stars"></span>
<span class="stars"></span>
<span class="stars"></span>
<span class="stars"></span>
</div>
<p class="date"></p>
<div class="hide info">
<p></p>
<p><a class="ctrlClickSubmit delete" title="Usuń" data-value="delete_1007" data-form="formManageOffer" href="#"></a></p>
<p></p>
<p class="type">e-book</p>
<p>To jest opis nowo tworzonej oferty - dokumentu, który wystawię na sprzedaż, a następnie u...</p>
</div>
<div class="bgInfo"></div>
Most probable reason is that
By.xpath("//*[text()='Nowa oferta dokument']")
is matching more than one element...
Also, check if the returned element/s is clickable
Well, your selector is wrong for one:
driver.findElement(By.xpath("//*[#class='name'][text()='Nowa oferta dokument']")).click();
Should hopefully work. If not, your element is probably not clickable due to other elements in front of it.
In which case, you can simulate the click using javascript:
driver.executeScript("arguments[0].click()", driver.findElement(By.xpath("//*[#class='name'][text()='Nowa oferta dokument']")));
Your CURRENT selector IS matching multiple elements. Since the element you are trying to select is at least two elements in, it is matching every parent object in the tree above the element you actually want, since they ALL contain that as the text().

Categories