bgilhutton
bgilhutton

Reputation: 71

A way around Element cannot be scrolled into view - Watir-webdriver with Ruby

So, we have the following code in our page:

<div class="toggle-wrapper">
  <input id="HasRegistration_true" class="registration_required toggle" type="radio" value="True" name="HasRegistration" data-val-required="The HasRegistration field is required." data-val="true">
  <label for="HasRegistration_true" class="">On</label>
  <input id="HasRegistration_false" class="registration_required toggle" type="radio" value="False" name="HasRegistration" checked="checked">
  <label class="checked" for="HasRegistration_false">Off</label>
</div>

These are 2 radio buttons. 'On' and 'Off'. 'Off' is the default value.

Using Watir-webdriver and Ruby, we want to select the 'On' radio button. We do so like this:

browser.radio(:id => "HasRegistration_true").set

But in doing so, we get the following error:

`WebElement.clickElement': Element cannot be scrolled into view:[object HTMLInputElement] (Selenium::WebDriver::Error::MoveTargetOutOfBoundsError)

We know Selenium 2 scrolls the page to the element, so trying to scroll down is useless. We are always using the latest releases of watir-webdriver and ruby.

We can't change the HTML of the page since we're QA engineers.

Upvotes: 7

Views: 6996

Answers (5)

Ruberzen
Ruberzen

Reputation: 51

I'm not using watir but I have the same error as you "...could not be scrolled into view ...". I tried to use watir just to solve it and didn't work for me. Then, I use an ActionBuilder (move_to with click) and the error disappeared.

My line to avoid the error is:

@driver.action.move_to(*webelement*).click.perform

I hope it will be useful for you

Upvotes: 0

pjd
pjd

Reputation: 1173

Here are two solutions that have worked for me:

There is a Ruby gem called watir-scroll that can work.

Then

require 'watir-scroll'
browser.scroll.to browser.radio(:id, "HasRegistration_true")

If you don't want to add a gem, my co-worker suggested something that somewhat surprisingly (to me) had the same effect as the above code:

browser.radio(:id, "HasRegistration_true").focus
browser.radio(:id, "HasRegistration_true").set

In my code, ".focus" scrolled straight to the element that was previously not visible. It may work for you as well.

Upvotes: 1

Ike Lionel
Ike Lionel

Reputation: 1

If the element is contained within a form and a div (Wrap) class I found that I had to do the following to click the 'No' radio button on the "https://quote.comparethemarket.com/Motor/Motor/AboutYourVehicle.aspx?" page:

div_list = @browser.form(:action => "AboutYourVehicle.aspx?ton_t=CTMMO&prdcls=PC&rqstyp=newmotorquote&AFFCLIE=CM01").div(:class => "inputWrap").divs(:class => "custom-radio")

And then: div_list[1].click

Hope this solves your issue too :-)

Upvotes: 0

Matt
Matt

Reputation: 87

You could manipulate the html on the fly by executing some javascript to make the radio element settable. To execute javascript on a page, do something like: @browser.execute_script("your javascript here")

I used something like the following javascript to strip the class out of a label tag which moved it out of the way of the input tag I was attempting to act on for a Chrome specific problem I had. execute_script("$(\"label.classname\").removeClass(\"classname inline\")")

Upvotes: 0

Xwris Stoixeia
Xwris Stoixeia

Reputation: 1861

First of all try locating the element using XPATH:

browser.element(:xpath, "//input[@id='HasRegistration_true']").click

or

alternatively if it is a hidden element you are trying to locate then you are better off using CSS. Download firebug add-on for firefox and copy the CSS path of your element.

It should be something like:

browser.element(:css => "the CSS path you have copied from Firebug").click

One of the 2 should do it for you!!

Best of luck!

Upvotes: 0

Related Questions