Katalon Selenium Element is visible but displayed is false

Question

I'm trying to click a button in vue js with vuetify with selenium/katalon. It is fully visible in the UI but still can be clicked on. I can find the element with no issues, but clicking on it returns a element not visible error. I tried various solutions including:

clicking with javascript (The js performs the click script but does NOT click the button)
using the Action class to move to the element and then click on it (it does NOT move to the element)
focusing and scrolling to the element
waits
switch to active element, default content, and maximize window
no parent elements with display none

When debugging I noticed the following:

// Able to find element with no issues
WebDriver driver = DriverFactory.getWebDriver();
String xPathForButton = "//div[@id='validationStepper']/div[3]/div[1]/div/div[2]/fieldset/div[1]/div/div/div/div[3]/button[1]";
def element = driver.findElement(By.xpath(xPath));
// Element not visible exception
element.click();

KeywordUtil.logInfo('X: ' + element.getLocation().x); // Prints 0
KeywordUtil.logInfo('Y: ' + element.getLocation().y); // Prints 0
KeywordUtil.logInfo('Element is enabled: ' + element.isEnabled()); // Prints true
KeywordUtil.logInfo('Element is displayed: ' + element.isDisplayed()); // Prints false

I need to use the xpath to find this element. Can someone help me on how I can properly detect and click on this element?

The button. I have no issues finding it. But when I click it throws a not visible exception, even though its visible. — usr4896260, Sep 05 '18 at 12:34

score 0 · Accepted Answer · answered Sep 05 '18 at 18:25

The issue turned out to be that a parent element was display: none during runtime. While I had no parent elements initially that were displayed none, the CSS changed dynamically, causing this to happen. I made corrections and afterwards the element was visible.

Katalon Selenium Element is visible but displayed is false

1 Answers1