Suggestions for getting Selenium to play nice with Bootstrap modal fade?

Question

I'm working to live life the BDD way. I'm using Cucumber (with Selenium) and happen to be using Twitter Bootstrap modals in my application. While running Cucumber tests, I was getting a `"Selenium::WebDriver::Error::MoveTargetOutOfBoundsError"` error. After much searching, debugging and general despair, I have concluded that it has to do with the use of the `"fade"` parameter in my Bootstrap modals. If I use `"fade"`, the error is thrown: ``` ``` If I remove `"fade"`, then Selenium is full of happiness and my tests clear: ``` ``` So, I am now removing `"fade"` from my various modals. But, this makes me sad because I like the fade effect. Has anyone else experienced problems using Selenium with fade in Bootstrap modals? If so, is there some clever way of getting the two to work nicely together? By the way (n…

Accepted Answer

I did a quick test with inserting a WebDriverWait that takes a look at the opacity of the modal. It seems to work, but time will tell as (at least for me) it's an intermittent problem. Here's my implementation in Java.

```
//Ensure the modal is done animating
new WebDriverWait(driver, 5).until(
    new ExpectedCondition<Boolean>() {
        @Override
        public Boolean apply(WebDriver webDriver) {         
            return webDriver.findElement(By.id("videoModal")).getCssValue("opacity").equals("1");
        }
    }
);
```

Suggestions for getting Selenium to play nice with Bootstrap modal fade?

Solution

Problem

Related problems