How to select a "Colour" for a field value and scroll parameter value of a field?

Question

http://www.html5rocks.com/en/tutorials/forms/html5forms/input-types.html

After navigating to above URL, you can find that there are two fields named "WHAT, is your favorite color?" and "WHAT, is the airspeed velocity of an unladen swallow? 1 (m/s)". First one only accept color value(you have to choose color) and second one , you need to scroll the bar inside it to set the value.

I have tried by changing Type , Value attributes for second one but didn't work. And I have no idea how to approach to the Color field. So, How will I automate those two fields using Webdriver+java?

Answer 1

You can use the color directly using javascript executor, for example:

String color="return document.getElementById('color').value='#88AAFF';";

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript(color);

//To move the slider,use below lines of code:

  js.executeScript("javascript:document.getElementById(\"airspeed_velocity\").value=30;");
  System.out.println("Value : "+findElement.getAttribute("value"));