Handle Sliders using selenium Webdriver_Selenium online Training

Now a days, many applications are having sliders to change price range for filtering records.Ex:Travel Domain,E-Commerce websites.




We have to handle this kind of slider while designing effective automation script.There are two ways to handle sliders using Action class.

1) By Using  dragAndDropBy(WebElement source, int xOffset, int yOffset) :

This is method that performs click-and-hold at the location of the source element, moves by a given offset, then releases the mouse.

          //web element
   WebElement slider = driver.findElement(By.xpath("xpath"));

           // Creating Object for a Actions class
    Actions action = new Actions(driver);
         
          // move slider by 300 pixel offset using dragAndDropBy method
  action.dragAndDropBy(slider, 300, 0).build().perform();

2)By using clickAndHold and moveByOffset(int xOffset, int yOffset):
Here Clicks (without releasing) in the middle of the given element using clickAndHold  method and Moves the mouse from its current position to the given offset using moveByOffset method.
          
           //web element
   WebElement slider = driver.findElement(By.xpath("xpath"));

           // Creating Object for a Actions class
    Actions action = new Actions(driver);

           //Moves the mouse from its current position to the given offset.
   action .clickAndHold(slider).moveByOffset(100,0).release().perform();  

Please find below sample code for the same.

Sample Code:
     
public class Slider {
 public WebDriver driver;

 @BeforeClass
 public void start() throws InterruptedException{
     driver = new FirefoxDriver();
     driver.manage().window().maximize();
     driver.get("http://jqueryui.com/demos/slider/");
     Thread.sleep(5000);
 }
 @Test
 public void handleDateSlider() throws InterruptedException{

  //Handle frame
  driver.switchTo().frame(driver.findElement(By.className("demo-frame")));
           //Handling Sliders
  WebElement slider = driver.findElement(By.xpath("//div[@id='slider']/span"));
   Actions action = new Actions(driver);
  action.dragAndDropBy(slider, 300, 0).build().perform();
  //action.clickAndHold(slider).moveByOffset(100,0).release().perform();


 } 

}