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: http://www.lazyautomation.co.uk/lazy2.html

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 = Watir::Browser.new :chrome

b.goto 'http://www.lazyautomation.co.uk/lazy2.html'
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!