How to click at any position in a slider using ruby-watir-cucumber and page object?

Question

I am using Ruby+Watir+Cucumber+Watir+CeezyPO+.... and in one test I have the next div element:

<div class="slider-importe ui-slider ui-corner-all ui-slider-horizontal ui-widget ui-widget-content"><div class="ui-slider-range ui-corner-all ui-widget-header ui-slider-range-min" style="width: 50.3384%;"></div><span tabindex="0" class="ui-slider-handle ui-corner-all ui-state-default" style="left: 50.3384%;"></span></div>

Wich is just an amount slider.

In my test I would like to click at any position of the slider and check the amount result that appears in the field text.

I have defined the Page Object for the div:

div(:slider_amount, :xpath => '//*[@id="simulatorParent"]/div[1]/div[1]/div[1]')

And later I can use it in the corresponding step:

page.slider_amount_element.click

Reference about cheezy Page Object: https://www.rubydoc.info/github/cheezy/page-object/PageObject/Accessors#div-instance_method

Using it in that way I can click in the middle of the slider, and this is ok. But, how is possible to click at any position of the slider?

Justin Ko Justin Ko · Accepted Answer · 2019-01-29T14:40:18

You will need to use Selenium's ActionBuilder - particularily the #move_to method. Unfortunately Watir, and therefore Page-Object, have not yet built a wrapper around actions (feature request #829).

The needed code is:

xoffset = 50      # how far right from the top-left corner
yoffset = 100     # how far down from the top-left corner
page.browser.driver.action.move_to(page.slider_amount_element.element.wd, xoffset, yoffset).click.perform

Where page is your PageObject.

How to click at any position in a slider using ruby-watir-cucumber and page object?

1 Answers