How do I select only visible elements using XPath?

I have a GWT application for which I'm trying to write some tests using Selenium.

I'm using XPath to identify the elements on the page for the tests. Using id won't work as the id values are auto-generated by GWT and can change. Things started going well when I realised I could find buttons by their labels as follows:

//button[.='OK']

However, when I started running multiple tests I started having problems. I realised that the issue was all the different "pages" of the GWT app once generated by the Javascript remain in the HTML in hidden <div> elements. This meant my Selenium tests were sometimes clicking hidden buttons instead of the button visible in the current view.

Examining the HTML with Firebug, it seems that GWT hides the <div> elements by adding display: none to their style attribute. This means I can find all the hidden OK buttons as follows:

//div[contains(@style,'display: none')]//button[.='OK']

This will find all the hidden OK buttons, i.e the buttons which have an ancestor <div> which is hidden by having display: none in the style.

My question is: how do I use XPath to find only the visible OK buttons? How do I find the buttons which have no ancestor <div> elements with display: none in the style?

This should work:

.//button[.='OK' and not(ancestor::div[contains(@style,'display:none')])
and not(ancestor::div[contains(@style,'display: none')])]

EDIT:

The simpler and more efficient expression below:

//div[not(contains(@style,'display:none'))]//button[.='OK']

does not work properly because every button has at least one div that's visible in its ancestors.

Selenium 2 Webdriver gives us the option of the isDisplayed() method which deals with this problem. Nice work by the selenium contributors.

This works for me:

//div[not(@hidden)]

//div[(contains(@style,'display: block'))]//button[@id='buttonid']

This worked for me. Like 'display: none' representing hidden blocks, 'display: block' represents currently displayed block and we can specify any inner tags to be identified as above

For me this worked to eliminate hidden elements:

//div[@open]//*

I added this code to the namemapping editor and it did not find the Keep button once it came up. The system sees it in the editor but it doesn't want to click on the button whenever create a new test which will include this item.

Now one other thing this is a dynamic button click so what happens is I will select a button that opens up a to drop downs where I place these items inside those dropdowns. Now it works for the first item but fails to recognize the same mapped item for the next time it is used in another screen. The buttonKeep is the same in both areas.

//div[contains(@style,'display: block')]

This code will find visible element xpath