so I have this textfield, on an HTML page, that accepts number from 1-100 on a modal box. If you enter a number to big -> error message in div below appears and class gets assigned to the div. Same thing for negative numbers. Entering text is not possible, leaves the field blank, and clicking ok in the modal box with an empty field also triggers an error message as the ones I described before.
When I manually test everything, all works fine and I can locate the element, that has the class I mentioned before.
When I automate this however... I always get the error: no such element: Unable to locate element: {"method":"css selector","selector":".class"}
when I check if the error-message is present after clicking Ok with an empty field.
With the number too big or negative, the element can be located correctly.
It appears that the Ok button is clicked but the message does not appear. So there seams to be a difference in clicking the button manually and automatically.
Does anyone of you ever noticed something like this and can give me some input in what may be the cause of this and how I can fix this?
Already asked some coworkers and none of them has any idea why this happens.
Let me know, if you need any additional info.
Thanks
Edit:
<div class="classes" width="400px">
<div class="classes">
<h4 class="classes">Some text</h4>
<svg
stroke="currentColor"
fill="currentColor"
stroke-width="0"
viewBox="0 0 24 24"
class="classes"
size="20"
height="20"
width="20">
<path
d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"></path>
</svg>
</div>
<div class="classes">
<form novalidate="" class="classes">
<h3 class="classes">Some text</h3>
<div class="">
<div class="classes">
<div class="classes">
<input
class="classes"
name="name"
type="number"
id="name"
step="any"
autocomplete="new-password"
value="70"
/>
</div>
<div class="classes">
HERE IS THE ERROR MESSAGE DISPLAYED
</div>
</div>
</div>
<div class="classes">
<button class="classes" type="button" id="cancel">
<p class="classes">Abbrechen</p></button
><button class="classes" type="submit" id="ok">
<p class="classes">Ok</p>
</button>
</div>
</form>
</div>
</div>
Here is some selenium code:
This is the function to fill the field with the desired input:
public void fillField(String input) {
driver.findElement(byId).click();
driver.findElement(byId2).click();
driver.findElement(byId2).clear();
driver.findElement(byId2).clear();
driver.findElement(byId2).sendKeys(input);
}
we need to clear the field twice here because for some reason once doesn't clear it. But thats not an issue for now.
Then we simply click ok with:
public void clickOk() {
driver.findElement(byOkModal).click();
}
But the thing is, that Ok is clicked and the error message does not appear. It appears when clicked manualy.
Also tried different approaches on waiting, clicking multiple times, moving the mouse and clicking somewhere else... nothing works...