How to handle element that goes from display:inline to display:none back to display:inline

[Timothy Williams]

Hello,

I have webpage that allows data to be edited using a 'Edit' button that starts out with display:inline-block. When the 'Edit' button is clicked it changes to display: none and other buttons are displayed including a 'Save' button to save changes made. After the 'Save' button is clicked the 'Edit' button is redisplayed with style display: inline-block again.
I am using page factory in Selenium. When I check the 'Edit' button webElement, isDisplayed returns false. When I use javascript executor for webdriver in code to inspect the style display css value it returns 'none'.

If I open dev tools in Chrome browser and look at the object/element it shows display: inline-block and is showing on the screen. The element has an id attribute so I am positive referencing the right element.
How can I get the dom refreshed or otherwise validate that the 'Edit' button is being redisplayed?

Any help would be appreciated.

Tim

[M T]

Hi Tim,

Opt 1 - Selecting your changed button based on the text

CSS: button:contains("Edit")

Xpath: //button[text()="Edit"]

Opt2 - Locate only the button and assert on the text

Tell us how did it go

[Timothy Williams]

Hello, 

Sorry for the late reply. 

The problem is not accessing the element, the problem is that selenium sees the element as still having the display:none and it tells me false when using isDisplayed() method, but when I look at in browser dev tool I can see the display:in-line is the current css for the element. It is like selenium dom is not being updated to the current style of the element. 

I have since noticed this with other elements on pages since moving to Selenium 4 with Chrome versions 101 and greater..

[Adrian]

Hi,

It sounds like a timing issue.

The Save button has been clicked

And then you are testing to verify that the Edit button is displayed

And it is saying that the Edit button is not displayed and yet you can see it is displayed.

After clicking the Save button is there a throbber that you need to wait for?

If there is no throbber then an option would be to add a wait for the Edit button to be clickable.

Something like:

WebDriverWait wait = new WebDriverWait(driver, 15); 

wait.until(ExpectedConditions.elementToBeClickable(By.cssSelector("#editButton")));

Cheers,
Adrian.

[kadambari saran]

Try doing a reload of the element when the exception is thrown, using try catch.

--
You received this message because you are subscribed to the Google Groups "Selenium Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to selenium-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/selenium-users/d2f3bb9b-09ba-408f-8f7e-9ee094d29e59n%40googlegroups.com.