Selenium::WebDriver::Error::ElementNotVisibleError: element not interactable - capybara

I need to select a colour in my acceptance tests. The hidden colour field is rendered with jquery-minicolors#2.1.10. I use the following code to set the colour:
find('#colour', visible: false).set('#fefacb')
I use capybara (3.11.1), selenium-webdriver (3.141.0) and ChromeDriver 2.44.609545 (c2f88692e98ce7233d2df7c724465ecacfe74df5). I run the tests in headless mode
But my test fails with:
element not interactable
(Session info: chrome=70.0.3538.110)
(Driver info: chromedriver=2.43.600229 (3fae4d0cda5334b4f533bede5a4787f7b832d052),platform=Mac OS X 10.14.1 x86_64) (Selenium::WebDriver::Error::ElementNotVisibleError)
What is wrong with my code? How can I fix it?

Just like a user wouldn't be able to, you can't interact (set, click, etc) with non-visible fields. Instead you need to interact with the visible elements on the page created by jquery-minicolors -- What those elements would be is completely dependent on how you've configured jquery-minicolors but should be relatively obvious by inspecting the page.

Related

ElementNotVisibleError when using headless chrome for testing in rails

I test following assumption And I click on the text "2018/2019" within ".year" with capybara/headless_chrome and constantly get the error
element not visible
(Session info: headless chrome=67.0.3396.87)
(Driver info: chromedriver=2.40.565386 (45a059dc425e08165f9a10324bd1380cc13ca363),platform=Mac OS X 10.13.5 x86_64) (Selenium::WebDriver::Error::ElementNotVisibleError)
I've already tried to adjust the window size, as suggested here. But it didn't work.
My step definition:
When(/^(?:|I )click on the text "([^"]*)"(?: within "([^"]*)")?$/) do |link, selector|
begin
page.find(:css, selector).click
end
end
The element is actually visible and found by Capybara
[1] pry(#<Cucumber::Rails::World>)> page.find(:css, ".year")
=> #<Capybara::Node::Element tag="a" path="/html/body/div[2]/div[2]/section/div[2]/div/div[1]/div[1]/div[2]/div/div[2]/ul/li/a">
But click fails
[2] pry(#<Cucumber::Rails::World>)> page.find(:css, ".year").click
Selenium::WebDriver::Error::ElementNotVisibleError: element not visible
Why doesn't click work here?
EDIT:
The HAML of the link is
%ul.facet_values
- unselected.each do |facet_value|
%li.filtered{data: {hayf: {text: facet_value.name.downcase}}}
= link_to facet_value.path, title: facet_value.name, class: 'year' do
=truncate("#{facet_value.name}", length: 24)
- if facet.has_counts?
%span.small="(#{facet_value.count})"
I tried headless testing with Poltergeist and got Poltergeist detected another element with CSS selector 'html body header div.container-fluid' at this position which was solved with .trigger('click') and the test passed.
Since this doesn't work in non-headless Chrome or Poltergeist, then the simplest answer is that the element isn't actually visible. Firstly remove the Capybara.ignore_hidden_elements = false setting since that makes no sense when testing an app, and will screw up all sorts of waiting behaviors. Secondly use save_and_open_screenshot to get a picture of what the page actually looks like before you are trying to click the link.
I'm guessing you'll see that the link isn't actually visible at that point and your test is missing a step a user would have to do to make the link visible, is it in a menu where you have to hover over a different element first? is it in a popup where you have to click on something else first?, does it need to be scrolled to? etc.
Finally, you'll generally have less issues if you stick with Chrome via Selenium. Poltergeist uses PhantomJS which hasn't been updated in quite some time and doesn't support modern JS or CSS which can lead to all sorts of strangeness.

Appium: dealing with android system interactions

I have a simple use-case. Within the android app, press a button and the browser app will open a URL.
The "Open With" dialog pop-up appears and allows you to select Browser or Chrome.
Which looks like this in the appium inspector:
<android.widget.ListView resource-id="android:id/resolver_list">
<android.widget.LinearLayout>
<android.widget.ImageView resource-id="android:id/icon">
<android.widget.LinearLayout>
<android.widget.TextView resource-id="android:id/text1">
<android.widget.LinearLayout>
<android.widget.ImageView resource-id="android:id/icon">
<android.widget.LinearLayout>
<android.widget.TextView resource-id="android:id/text1">
Attempting to automate this seems like it should be trivial, but is causing me trouble. I can get the text of both "Browser" and "Chrome" as discrete AndroidElements, but I cannot seem to be able to actually press the actual options.
Am I allowed to actually interact with these things or is this impossible because it's part of the android system itself?
To help figure this out, here is the setup of my page object.
#AndroidFindBy(id = "android:id/resolver_list")
private AndroidElement listParentElement;
public List<OpenWithOption> getOptions() {
/* ... */
List<MobileElement> elements = listParentElement
.findElementsById(SYS_ID_PREFIX + "text1"); // Here's where I can only get the text element itself but can't figure out how to get the elements above that.
return elements.stream()
.map(mobileElement -> new OpenWithOptionImpl(mobileElement.getText(), mobileElement))
.collect(toList());
}
This was a rookie mistake. Selecting the browser enabled the choice of "Just Once" or "Always" in the bottom of the screen and I didn't notice. I thought that just pressing the browser you wanted would launch it.

Capybara click is lost on div surrounding input node

I am using Rails 4.2, Capybara 2.5, and Poltergeist 1.8. I have an input tag inside a div whose id is #foobar, and in my JS, I have a click event handler for #foobar.
<div id='foobar'><input type=submit></div>
<script>$('#foobar').click(function() {})</script>
Everything works as expected in a browser but my tests fail if I send a Capybara click to the div instead of the input tag:
Test works
page.find('#foobar input').click
Test does not work
page.find('#foobar').click
Is this a known problem, or am I understanding the expected behavior incorrectly?

Unable to findByXpath using Leadfoot / Intern

Using Intern JS with WebDirver to communicate with Appium 1.4.1, I have a simple functional test, part of which should find a text input box on the login screen of our iOS app, tap into it and type the user's login name:
define([
'intern!object',
'intern/chai!assert',
'require'
], function (registerSuite, assert, require) {
registerSuite({
name: 'Suite Name',
'Login Screen': function () {
return this.remote
.setFindTimeout(50000)
.findByXpath("//UIAApplication[1]/UIAWindow[1]/UIAScrollView[1]/UIATextField[1]/UIATextField[1]")
.tap()
.type('student1#demo.com')
.end()
.then(function (pagetitle) {
assert.strictEqual(pagetitle, 'DEMO COLLEGE',
'Should land on app dashboard with school title displayed');
});
}
});
});
When executed using intern-runner everything appears to go well, Appium launches our app and awaits my input - but no matter what I try I can't find the element I need to type into using Leadfoot's findByXpath:
$ intern-runner config=tests/appium
Listening on 0.0.0.0:9000
Starting tunnel...
Initialised iOS on MAC 8.1
Test main - Suite Name - Login Screen FAILED on iOS on MAC 8.1:
NoSuchElement: [POST http://[appium-server-address]:4723/wd/hub/session/80e20453-452e-4181-8713-4f9e0cfa427f/element / {"using":"xpath","value":"//UIAApplication[1]/UIAWindow[1]/UIAScrollView[1]/UIATextField[1]/UIATextField[1]"}] An element could not be located on the page using the given search parameters.
at Server._post <../../.nvm/v0.10.35/lib/node_modules/intern/node_modules/leadfoot/Server.js:68:9>
Using Appium's GUI "inspector" I've confirmed the Xpath to the text-input-box element is:
"//UIAApplication[1]/UIAWindow[1]/UIAScrollView[1]/UIATextField[1]/UIATextField[1]"
Can anyone suggest where I'm going wrong please?
Looks like the Appium Inspector tool on my Mac was duplicating part of the path?
.findByXPath("//UIAApplication[1]/UIAWindow[1]/UIAScrollView[1]/UIATextField[1]/**UIATextField[1]**")
.type("wibble")
Remove the duplicated element in bold (the final UIATextField[1]) ....
.findByXPath("//UIAApplication[1]/UIAWindow[1]/UIAScrollView[1]/UIATextField[1]/**UIATextField[1]**")
.type("wibble")
And it works.
Thanks Appium Inspector. Thanks a lot.

sendkeys command causing exception in selenium webdriver on IOS safari

I have been trying to run some sample Remote WebDriver tests on the Safari browser on the IOS Simulator 7.0 (IPhone) but my tests give an exception every time I try to type in values on a text box. Just trying to use the example from iosdriver
DesiredCapabilities safari = IOSCapabilities.iphone("Safari");
RemoteWebDriver driver = new RemoteWebDriver(new URL("http://<someip>:4444/wd/hub"), safari);
driver.get("http://hp.mobileweb.ebay.co.uk/home");
WebElement search = driver.findElement(By.id("srchDv"));
search.sendKeys("ipod");
search.submit();
gives me the exception
a "org.openqa.selenium.NoSuchElementException: cannot find element for criteria :{"AND":[{"l10n":"none","expected":"UIAElement","matching":"exact","method":"type"},{"l10n":"none","expected":"Address","matching":"exact","method":"name"}" .
Anyone else run into this? It is identifying the element but typing in values fail..It works fine when I try it on firefox on my desktop.
I am no expert, but am familiar with selenium webdriver..
Are you sure that the id for "search " --- ('srchDv') actually exists on the page you are trying to automate?
if so
i would then look into the UIA -Element Hierarchy / Accessibility link to UIA Element Class reference
Hope this is helpful
You have an incorrect selector. The page you are automating does not have an id srchDv. If you are getting the search box, then you need to use:
driver.findElement(By.id("gh-ac")).clear();
driver.findElement(By.id("gh-ac")).sendKeys("ipod");
Also, instead of using submit, personally i would follow the way that your user would commit the action, and that's by clicking the search button.
driver.findElement(By.id("gh-btn")).click();

Resources