Watir-webdriver: I can't click a visible div in an iframe

Question

I have a facebook app which I'd like to test using Watir. The problem is I can't access its divs. The is located within an iframe. I can find it and it even says it's visible. The problem is I can't click it (it says it's invisible when trying)

Can you help please? I posted my code with a XXX instead of the user name and a different App for Facebook.

Thanks a lot.

require "watir-webdriver"

browser  = Watir::Browser.new
browser.goto "http://www.facebook.com"

sleep(2)
if browser.text_field(:id => 'pass').exists?
   browser.text_field(:id => 'email').set 'XXXXXXXXX'
   browser.text_field(:id => 'pass').set 'ZZZZZZZ'
   browser.button(:value => 'Log In').click
end
sleep(2)
browser.text_field(:id => 'q').set 'World Of Fun'
browser.send_keys :enter
sleep (2)

browser.goto "https://www.facebook.com/dialog/oauth?client_id=277448022299830&redirect_uri=http%3A//apps.facebook.com/worldoffun/%3Fref%3Dts&canvas=1&fbconnect=0&scope=email,publish_actions"
sleep (2)

if browser.button(:name => 'grant_clicked').exists?
  browser.button(:name => 'grant_clicked').click
  sleep(3)
end
sleep(1)

Answer 1

That's because the element you are trying to identify, is not present on that page, try this instead:

  if browser.label(:id => 'grant_clicked').exists?
  browser.label(:id => 'grant_clicked').click
  sleep(3)

I also noticed that the app is in flash, so Watir will not be able to handle flash elements within it, i'd recommend using AutoIt or Project Sikuli together with Watir-Webdriver.