Automating ‘Auto Complete’ text field using Watir-WebDriver

Requirement:

1. Navigate to Google.com

2. Type “Ravee” in text Field

 3. Select “Raveendran” from Auto Complete option from Suggested option.

Steps to Solve the issues:

1. Navigate to Google.com

2. Type “Rav” in text Field

3. Using IE Developer Tool Bar –> Click The suggested Option (So You will get the source code for suggestion lists)

4. Find the parent id –> Ex. It should TABLE mostly.

So we have Table id/name/class

5. Collect All the Rows under this table

6. Check the text for each and every row

7. If Any one of the row matches  ”Raveendran”

8. Then Simply Click It

Code:

require 'rubygems'
require 'watir-webdriver'

browser=Watir::Browser.new :ie
browser.goto("google.com")

browser.text_field(:name,"q").set("Ravee")
sleep 3
auto_content=browser.table(:class,'gssb_m').trs

auto_content.each do |g|
  if g.text.downcase == "raveendran"
    g.click
    sleep 3
    break
  end
end

 

Demo –> http://bit.ly/j_autocomplete_watir

RSpec + Watir WebDriver

Installation:

1. Install Ruby

2. CMD>gem install watir-webdriver

3. CMD>gem install rspec

Code:

google_search.rb

require 'rubygems'
require 'watir-webdriver'

class Google
def search(browser,term,result)

if browser.downcase=="ie"
br= :ie
elsif browser.downcase=="ff"
br= :ff
elsif browser.downcase=="chrome"
br= :chrome
else
br= :ie
end

$ie=Watir::Browser.new br
$ie.goto("http://google.com")
$ie.text_field(:name,'q').set(term)
sleep 3
$ie.button(:name,'btnG').click
sleep 3
$result=$ie.text.downcase.include?(result)

$ie.close
end

end

googleSearch_spec.rb

require 'rubygems'
require 'rspec'
require 'google_search'

describe Google, "#Searchresult" do
it "returns the expected result in search result page" do
bowling = Google.new
bowling.search("chrome","Raveendran","ruby")
$result.should eq(true)
end
end

describe Google, "#Searchresult" do
it "returns the expected result in search result page" do
bowling = Google.new
bowling.search("chrome","Raveendran","wordpress")
$result.should eq(true)
end
end

describe Google, "#Searchresult" do
it "returns the expected result in search result page" do
bowling = Google.new
bowling.search("chrome","Watir, Selenium,Cucumber highline","raveendran")
$result.should eq(true)
end
end

describe Google, "#Searchresult" do
it "returns the expected result in search result page" do
bowling = Google.new
bowling.search("chrome","Ruby highline","raveendran")
$result.should eq(true)
end
end

RUN THE RSPEC code:

1. Navigate to the folder where files available

>rspec googleSearch_spec.rb

 

OUTPUT:

It will launch Chrome browser and will execute the test cases. Finally You will get the output like,

Started ChromeDriver
port=4113
version=14.0.836.0
.Started ChromeDriver
port=4164
version=14.0.836.0
.Started ChromeDriver
port=4218
version=14.0.836.0
.Started ChromeDriver
port=4260
version=14.0.836.0
.

Finished in 77.28 seconds
4 examples, 0 failures

 

Watir WebDriver — Handling New Window

Situation:

1. You are in Parent Page.
2. Clicking link “Open” in Parent page.
3. It opens new window
4. You need to do actions  there and come back to your parent window

Solution:

To Click the Link

require 'rubygems'
require 'watir-webdriver'
ff=Watir::Browser.new :ff
ff.goto("website.com")
ff.link(:text,'open').click

To handle the New window and performing some actions within that window,

ff.window(:title,/TITLE of the new window/i).use do
ff.send_keys('SampleText')
ff.button(:id,'insert').click
puts ff.title #returns the new window title
end

within a loop The button belongs to Newly opened window.

puts ff.title #returns the parent window title

Watir-webdriver cheatsheet

Getting Started

Load the Watir Webdriver library

require 'watir-webdriver'

Open a browser (Ex: Internet Explorer)

driver = Watir::Browser.new :ie

Go to a specified URL

driver.goto 'http://www.orbitz.com/'

Close the browser

driver.close

Access an Element

Type something in the Text box or text area

driver.text_field(:id,'airOrigin').set("MAA")

To Clear the text from text field 

driver.text_field(:id,'airOrigin').clear

Button

To click the button
driver.button(:id,'BUTTON_ID'').click

Drop down list

To select the value from list
driver.select_list(:id,'airStartTime').select("1 am")

To get the selected value from select field
 driver.select_list(:id,'airStartTime').value

Check box

To clik the check box

driver.checkbox(:id,'airNonStopsPreferred').click
OR
driver.checkbox(:id,'airNonStopsPreferred').set
To know the clicked? or not ?
driver.checkbox(:id,'airNonStopsPreferred').set?

Radio button driver.radio(:id,'htlChoice').click

To verify Flights radio button selected or not

driver.radio(:id,'htlChoice').set?

#if it returns TRUE then radio button already selected.

To get the title of the webpage puts driver.title

Return true if the specified text appears on the TAG

 puts driver.li(:class,'welcomeText').text.include("Welcome to Orbitz")

To Click SPAN Elements driver.span(:text,'Find Flights').click

Sample Page Object Model for Watir-WebDriver

This is the sample code for creating the page objects in separate file.

page_object_sample.rb

def config
  #common Settings
  @browser="ie"
end

def google_homepage
  #Web Application URL details
  @url="http://google.com"
  #Google Homepage Page Object Models
  @search_field=$browser.text_field(:name,'q')
  @search_button=$browser.button(:name => 'btnG')
end

def bing_homepage
  @url = "http://bing.com"
  @search_field=$browser.text_field(:id,'sb_form_q')
  @search_button=$browser.button(:name => 'go')
end

———————————————————————————————————

Code.rb

require 'watir-webdriver'
require 'd:\\page_object_sample.rb'

config
  $browser = Watir::Browser.new @browser.to_sym
google_homepage
  $browser.goto @url
  @search_field.set("Raveendran - Watir Webdriver")
  @search_button.click
  puts $browser.title

bing_homepage
  $browser.goto @url
  @search_field.set("Raveendran - Watir Webdriver")
  @search_button.click
  puts $browser.title

  $browser.close

NOTE:

a. We can create the page object model with,
     1. IE Developer tool bar for IE browser
     2. Firebug for Firefox browser.
b.  This is the sample and basic page object model code. 
We can customize/develop depends up on our requirement.

c. If the page object will change in future then No need
 to worry about the actual script. Just updating the page
 object model will fix those kind of issues.

Watir and Cucumber

This is the best website to start cucumber with watir

http://bit.ly/j_cucu_watir

For more details http://cukes.info

Watir Day 2011 Speakers Announced!

The speakers list for Watir Day 2011 in San Francisco on April 3rd 2011

• Alister Scott: ThoughtWorks: The Elements of Cucumber Style
• Andreas Tolfsen: Opera Software: Watir 3 and the future
• Bret Pettichord: Convio: Opening & Host
• Hugh McGowan: Convio: Testing with Vision
• Marek Jastrzebski: Convio: Domain Specific Watir Page Objects
• Simon Stewart: Google: WebDriver
• Tim Koopmans: Altentee: WatirGrid
• Željko Filipin: WA Research: Adventures in promoting Watir

 

Watir — Integration with Fitnesse

Fitnesse –Open source Test managment and acceptance testing tool

Watir –Open source Functional testing tool

 

1. Download the JAR file from http://fitnesse.org/FrontPage.FitNesseDevelopment.DownLoad

2. Save it in d:\fitnesse\fitnesse.jar

3. Install Ruby

4. Install the gem fit with the help of command

>gem install fit

>gem install watir

5. Open Command Prompt and navigate to

D:\fitness>java -jar fitnesse.jar

FitNesse (v20100103) Started…
port:              80
root page:         fitnesse.wiki.FileSystemPage at ./FitNesseRoot
logger:            none
authenticator:     fitnesse.authentication.PromiscuousAuthenticator
html page factory: fitnesse.html.HtmlPageFactory
page version expiration set to 14 days.

6. Open Browser and Navigate to “http://localhost/”

7. Click Properties or Navigate to “http://localhost/FrontPage?properties”

Change as per the snapshot and click Save Properties

8. Click “Edit”

Paste this code

!define COMMAND_PATTERN {ruby -I %p C:/ruby/lib/ruby/gems/1.8/gems/fit-1.2/bin/FitServer.rb}
!path D:/fit
!|mytest.Division|
|term|result_term|search?|
|Raveendran |music |true|
|Ruby |program |true|

9. In D:\ create folder named as “fit”
“Fit” folder should contain another one forlder named as “mytest”
“mytest” folder should contain “division.rb”

10.

Open division.rb file

paste the code

require ‘fit/column_fixture’
require ‘rubygems’
require ‘watir’

module Mytest

class Division < Fit::ColumnFixture
attr_accessor :term, :result_term
def search
@ie=Watir::IE.new
@ie.goto(“google.com”)
puts “Entering Term”
@ie.text_field(:name,’q').set(@term)
@ie.button(:name,’btnG’).click
@output = @ie.text.include?(@result_term)
@ie.close
return @output

end
end

end

11. Click “Test” in “http://localhost”

12. Fitnesse will provide the test result for your definitions. For ex, see the snapshot

Watir — Verifying the Current style Properties

require ‘rubygems’

require ‘watir’

ie=Watir::IE.new

ie.goto(“google.com”)

ie.image(:id,’logo’).document.currentstyle.height

#=> “190px”

ie.image(:id,’logo’).document.currentstyle.width

#=> “315px”

ie.image(:id,’logo’).document.currentstyle.fontfamily

#=> “arial,sans-serif”

ie.image(:id,’logo’).document.currentstyle.textalign

#=> “center”

ie.image(:id,’logo’).document.currentstyle.borderwidth

#=> “0px”

For more details,

Watir — Priority for using attributes

Source:

<input id=”query1″ type=”text” autocomplete=”off” value=”" name=”query”/>

Code:

require ‘rubygems’
require ‘watir’
$ie=Watir::IE.new
$ie.maximize
$ie.goto(“http://search.aol.in/aol/webhome”)
$ie.text_field(:id,’query1′).value=”Raveendran”

Issue:

Change the last line of the code like this

$ie.text_field(:name,’query’).value=”Raveendran”

It is not working . Rit ?

Solution:

So the first priority goes to the “ID” attirbute  to access the input fields.