Capybara + Selenium / Webkit : Selecting *within* a div (rails / rspec) - ruby-on-rails-3

Good evening,
I'm trying to set up a request spec with RSpec / Capybara for a page that contains a Flot graph. I have the page set up such that the user has to click on a marked element within the graph (tick/data point) to continue. Obviously the graph is generated with Javascript (flot).
Is there a way to get capybara/selenium to click on a specific x/y position with the chart div? I can measure it out in the development environment such that it should hit the datapoint in the test.
I have found ways to generate this click event with javascript:
$(document.elementFromPoint(x, y)).click();
But I don't think there is a way to get this to work in RSpec. I'm looking for something more like:
find(".overlay").click(top:10px; left:50px;) # click offset from the top and left of graph div
response.body.should have_selector(# stuff that should show up on the page)
Not sure if it makes any difference, but I prefer Selenium over webkit at the moment so that I can see what it is doing... will switch to webkit once tests are running.

Capybara should allow you to execute Javascript from within an example when the driver supports it, e.g.:
page.execute_script('$(document.elementFromPoint(10, 50)).click();')

Related

Cant find navbar element in Selenium Webdriver for Heroku

So we're using Heroku for a student project and we are supposed to use Selenium to test the product throughout the course, however I am not able to locate any of the elements inside the navbar. This given that we decide to show the navbar etc as a precondition.
I could locate it before we introduced the toggle thingy if i am not mistaken.
https://c3-solutions-staging.herokuapp.com/
I was not able to locate any of the elements inside the navbar, including the navbar itself with the find element function, although i tried xpath, css, id etc. What i want to do is to either click the Enhetsöversikt or select the input type field so that i can search. Been bugging me out for a few hours by now : ) We're using Javascript with Vue as framework so that might be an issue? Has been an interesting experience lately <:

Finding xpath of shadow dom elements with robot framework

I'm writing automated UI tests using Robot Framework with python. I'm testing a Polymer application that uses the shadow dom Robot's standard libraries don't seem to be able to locate elements in the shadow dom using xpath.
I've been sorting through selenium's repo/overflow/internets and polymer's repo/overflow/internets and haven't found the intersection of a solution for using robot with python (the selenium workaround isn't that graceful either). I was hoping someone had run into this issue with this specific framework that might be willing to share a solution (or note that there's not one).
Test Case
Wait Until Page Contains Element xpath=(//html/body/some-root-shadow-dom-element/input)
This of course results in an error because the shadow dom is not put into the main document of the DOM tree.
Open the browser console and type this into the console:
dom:document.querySelector("apply-widget").shadowRoot.querySelectorAll("div)
Make sure to hit enter after so it will be ran.

Robot Framework - Locating input element with accept attribute fails

I am writing an automation script for an avatar upload module with the following CSS locator:
input[accept="image/png,image/jpeg,image/gif,image/bmp"]
I am using Robot Framework's Wait Until Element Is Visible keyword to look for the locator above but is unsuccessful with the error:
Element 'css=input[accept="image/png,image/jpeg,image/gif,image/bmp"]' not visible after 30 seconds.
Increasing the timeout also doesn't work. Using the same in Chrome Dev Tools would successfully find the element. My guess is that the commas/slashes are messing with Robot's locator parsing. My question is: What is the correct way to write the locator?
Though present in the DOM, an element may not be visible/rendered. This is very often the case with file upload input elements - the UI renders something different, a button, div that had applied styling and fits in better with the overall design.
Thus a check is it visible will rightfully fail. Change your pre-usage approach to validate the input is in the HTML - this is actually the same as what you did in the browser's dev tools - with the Page Should Contain Element keyword, and proceed on success.
There is no problem with the CSS locator your are using. Maybe the element is in another iframe?

Unable to click button in mobile web in appium

After exhaustively searching for this over various forums, I still don't have an answer.
Here are complete details
I'm identifying the element through classname which points to multiple(4) buttons. I'm iterating through buttons and then search for text and when there is a match i click it.
This works fine with selenium webdriver and browsers such as firefox,chrome
Now I'm doing the same thing with appium.
Out of 4 buttons which are identified through classname, the script clicks 2 buttons successfully but for two buttons click happens(i can see the button being clicked) but new page which should be loaded is not loaded. The buttons for which click is not happening are in a footer class and other two are in div class.
Things i have already tried
Actions builder - click(), clickandhold()
Javascript executor
I'm currently trying with touch options, tap and by switching to native view but haven't found any success.
If any has encountered the same, a solution will be appreciated.
I want to avoid xPath because that might change in the page I'm working on, and I want to stress that the script is able to find the button, but is not able to click it properly.
You can filter your locator by using class name and index. Like this:
driver.findElementsByXPath("//*[#class='android.widget.ImageView' and #index='0']");
This xpath won't get change on other devices too.
Could you see: Unable to find an element in Browser of the Android emulator using Appium and C# ?
In case of testing web apps in browser the elements should be located as usual elements on the web page ( not as some classes like android.widget.EditText and android.widget.Button).
Upadting appium java client to 1.5.0 (from 1.3.0) solved the issue. Need to check why!

Selenium evaluates DOM or Visible elements

I would like to understand how Selenium evaluates the page.
I have set of test to check elements on the page. Written with Nunit, Selenium and PhantomJS as Driver.
Page.Visit();
Page.FindElement(By.Id("testid").Text.Should().NotBeNull(); // PASS
Page.FindElement(By.Id("testid").Text.Should().NotBeEmpty(); // does NOT PASS
The test DOES NOT pass if the browser size is set to be very small:
driver.Manage().Window.Size = new Size(10,10);
Based on this test, it is confusing how PhantomJS evaluates the page. I always thought that it checks the DOM but seems like for element TEXT it evaluates based on visibility!
Although this surprised me too when I first discovered it, Selenium will only find elements visible in the viewport of the browser. For this reason, you will want to ensure at the start of your tests that your browser viewport is large enough to accommodate the content of your application.
Typically this can be done by maximizing the browser window. If you are using Windows, triggering the F11 key via Selenium should work.