Selenium wait for element to appear and dissapear - selenium

Question

I have the following element:
<div class="ui-helper-hidden" id="shell.indicator.busy">
<label>Processing...</label>
<br />
<img src="/RightCrowd/Images/loading.gif" alt="" />
</div>
And it appears like this:
I would like to wait for it to appear and then to disappear and continue with accessing elements. This appears on most pages of the web application. We've tried a few things but sometimes it is visible by Selenium and sometimes is not, although I can see it with my eyes.
I believe that this processing image appears on top of the current page and using the current handler may be useless. Not sure.
We've tried something like this:
WebElement element = (new WebDriverWait(webDriver, 10))
.until(ExpectedConditions.visibilityOfElementLocated(By.xpath("//img[contains(#src,'/Images/loading.gif')]")));
boolean processingEnd = (new WebDriverWait(webDriver, timeoutWaitForProgressbar))
.until(ExpectedConditions.invisibilityOfElementLocated(By.id("shell.indicator.busy")));
So we've tried both xpath and id... Please let me know what's the best way to handle this situation.

Answer 1

By default, the WebDriverWait would check the Expected Condition status every half a second. I would try to issue the expected condition check requests more often with a FluentWait class:
Wait wait = new FluentWait(driver)
.withTimeout(timeoutWaitForProgressbar, SECONDS)
.pollingEvery(100, MILLISECONDS);
wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("shell.indicator.busy")));