The golden rule of web application testing states that "You can find a number of bugs by simply clicking randomly on various places." This is especially true for User Interface bugs. If you are using Selenium or Sauce Connect for automating your application’s User Interface tests, it is important to know how the “Selenium.click()” command works in order to simulate user clicks.
The “Selenium.click()” command is a lesser known, yet powerful capability for testing the behavior of app UI elements, without manual intervention. For instance, we recently tested a JSP form with a few dozen dropdown lists (single and multi-select), checkboxes, and a plethora of radio buttons. Clicking each UI control manually would have been a pain in the hand. In contrast, simulating these clicks using Selenium not only saved crucial manual testing effort, it helped uncover a number of important bugs in the application as well.
How to use the Selenium Click command
To put it in simple words, the click command emulates a click operation for a link, button, checkbox or radio button. In Selenium Webdriver, execute click after finding an element. In SeleniumIDE, the recorder will do the identifying, and the command is simply click.
Example: The following command invocation simulates a click on a button element named myButton
element = driver.find_element :xpath, '//input[@name="q"]'
element.click();
Advanced Click Techniques
Previous versions of Selenium had a driver-level .click() event that could click any object on the screen by an identifier. These identifiers included css=, name=, id=, link= and xpath=. Today, that functionality only exists in the IDE. The IDE also has the ability to set wherein an object you click, in terms of offset from top-left, using the “click at” command.
Rotating through clicking objects can be extremely powerful. Here is a simple example that clicks objects in linear order. You could watch the elements as they are added, write code to do the check, or, with a little work, randomize the clicking.
The HTML is simple enough. It is a web page with ten buttons that adds a click number after each click:
<HTML>
<TITLE>TEST SCREEN</TITLE>
<script>
var i = 1;
function printme() {
doc = document.getElementById("printmediv");
txt = document.createTextNode("Clicknumber " + i + " ");
doc.appendChild(txt);
doc.appendChild(document.createElement("br"));
i=i+1;
}
</script>
<BODY>
<FORM>
<H2 ID="First">Sample Text</H2>
<BR/>
This is a test
<Br/>
<div>Click here friend
<input type="button" value="yoyoyo" id="yoyoyo"/>
<BR/>
<input type="submit" value="Submit1" id="submitter1" onclick="printme(); return false;" />
<input type="submit" value="Submit2" id="submitter2" onclick="printme(); return false;"/>
<input type="submit" value="Submit3" id="submitter3" onclick="printme(); return false;" />
<input type="submit" value="Submit4" id="submitter4" onclick="printme(); return false;" />
<input type="submit" value="Submit5" id="submitter5" onclick="printme(); return false;" />
<input type="submit" value="Submit6" id="submitter6" onclick="printme(); return false;" />
<input type="submit" value="Submit7" id="submitter7" onclick="printme(); return false;" />
<input type="submit" value="Submit8" id="submitter8" onclick="printme(); return false;" />
<input type="submit" value="Submit9" id="submitter9" onclick="printme(); return false;" />
<input type="submit" value="Submit10" id="submitter10" onclick="printme(); return false;" />
<BR/>
<BR/>
</div>
<H2>Simple Text</H2>
<div id="printmediv"></div>
</FORM>
<BODY>
</HTML>
The HTML is available in Github for your review.
The interesting bit, of course, is the code to do the clicking.
Ruby Loop Through The Clicks
The code below (and it Github) loops through submit buttons, clicking them. Code to check that the text is created, or to do different text for different buttons, or to click in random order, is an exercise for the reader. Fork our git and link to your work in the comments to build your reputation!
require "selenium-webdriver"
require 'test/unit'
class SampleTest < Test::Unit::TestCase
def setup
options = Selenium::WebDriver::Chrome::Options.new
options.add_argument('--ignore-certificate-errors')
options.add_argument('--disable-popup-blocking')
options.add_argument('--disable-translate')<
@driver = Selenium::WebDriver.for :chrome, options: options
end
def teardown
@driver.quit
end
def test_click_button
#Only tested on mac - finds sample.html in the current working directory
directory = File.expand_path File.dirname(__FILE__)
specific_filename = "file://" + directory + "/sample.html"
@driver.navigate.to specific_filename
for i in 1..10 do
id = "submitter"+i.to_s();
css = "input[id='" + id + "']";
puts "clicking " + id;
element = @driver.find_element :css, css;
element.click()
sleep(1);
end
#If we get this far we are okay
assert(true);
end
end
