Dealing with iframes

Written by Aidy.

Sometimes people use iframes on websites and when they do this and they put elements like buttons that you want to click inside the iframes then this means you actually have to reference the iframe aswell as the element you want to use. To illustrate this I've created another test web page that's basically just an iframe within which I've put the other test page. You can check it out here:

If you right click on the 'Hello World' button and inspect it in Google Chrome you'll notice that nothing's really changed with this button but if you attempt to click it on this new page using any of the techniques we discussed in previous tutorials it won't actually work on this page. If you scroll up you'll notice the tag for the iframe that the button is now sitting in, it has an id of 'iframe01'.

Here's the new code that let's you click the button within the iframe.

require "watir-webdriver"
b = :chrome

b.goto ''
b.iframe(:id, 'iframe01').button(:id, 'hello1').click


As you can see, on line 5 we've simply reference the iframe before the button. Easy!

Basic Validation

Written by Aidy.

Let's have a look at a couple of simple methods that we can use to validate that an automated test has either passed of failed. We're going to do this using an 'if statement'.

Checking An Element Exists
Let's write a little test that opens a browser, navigates to the test web page and then confirms that the 'Hello World' button exists. We can do this like so.

require "watir-webdriver"
b = :chrome

b.goto ''

if b.button(:id, 'hello1').exists?
  puts 'PASS - Hello World Button Exists'
  puts 'FAIL - Hello World Button is Missing'

As you can see it's pretty easy to write, we have an 'if statement' that checks to see if the button exists using exists? and if it does then we output some text to say that the test has passed, otherwise we output some text to say that the test has failed. If you try running this it should pass. Try changing the button ID on line 6, this should stop it from finding the button and the test should fail.

Checking For Some Text
Now let's write a test that goes to the test web page, clicks the 'Hello World' button and validates that after the button has been clicked that the words 'HELLO WORLD' appear on the web page. 

require "watir-webdriver"
b = :chrome

b.goto ''

b.button(:id, 'hello1').click

if b.text.include? 'HELLO WORLD'
  puts 'PASS - Text is displayed'
  puts 'FAIL - Text was NOT displayed'

As you can see we're navigating to the site on line 4, clicking the button on line 6 and then we have our 'if statement'. Using include? We can validate that the text is included on the web page. Try changing the text to something else e.g. 'GOODBYE WORLD' and you should see the test fail.


Written by Aidy.

When you first start trying to automate web testing there's one issue that you'll probably run into fairly quickly. Webpages don't always load that quickly and there's also the added problem of the buttons, iFrames, links and other elements loading slowly too. This can result in an automated test failing due to something like trying to click a button that hasn't loaded yet. So let's look at waiting!

Sleep is used to specify an exact wait in seconds, the seconds are specified in brackets after the command. In this example we'll end up waiting for 5 seconds. It's considered bad practice to use sleep in web automation due the potential inaccuracy of either waiting too long or not long enough for something to happen. However that doesn't mean you should dismiss them entirely. They can have their uses. E.g. testing a specific time-out on a webpage.


This is a much safer way to wait and whatever we put in the curly brackets, shown in the example below is what we'll end up waiting for. So we could wait for a specific element to exist or for any other statement to become true. In the following example we're waiting for a button to exist using the exists? command. We could also wait for something like a variable to become equal to a certain value.

Watir::Wait.until{b.button(:id, 'button01').exists?}

Just to clarify, the exists? command that's used in the previous example is generally used to check if a specific element exists on a webpage, such as a button or a div.

This works in the same way as exists? but obviously it waits until an element is visible. There can be situations where an element exists but is not visible. For example a page may load with a lightbox that displays for a few seconds in front of a button we want to click. So if we used exists? then we'd still be attempting to click something that wasn't clickable yet, so visible? would be a better option in this case.

Watir::Wait.until{b.button(:id, 'button01').visible?}

The includes? command can be used to wait for some text to exist on a webpage before continuing. The example below will wait until the webpage being tested includes the text 'Hello World'.

Watir::Wait.until{b.text.include? 'Hello World'}



Basic Interaction with Web Pages

Written by Aidy.

NOTE: The following tutorial uses Chrome for the examples.

Let's have a look at how to use Watir and Ruby to take control of the most commonly used web elements that you'll find on most websites such as text fields, links and buttons. To interact with any of these is very simple and requires pretty much just one line of code per element interaction. I've mocked up a little webpage with a load of different elements on it that we'll use in the following examples, check it out here: