...BySECTION_OVERLAY_ANCESTOR_LOCATOR=By.xpath("./ancestor::div[contains(@id, 'section-overlay-')][1]");...privateWebElementfindUnblockedElement(Byby){WebElementelement=driver.findElement(by);if(isBlockedByOverlay(element)){thrownewElementNotInteractableException(String.format("Element [%s] is blocked by overlay",element.getAttribute("id")));}else{returnelement;}}privatebooleanisBlockedByOverlay(WebElementelement){List<WebElement>ancestors=element.findElements(SECTION_OVERLAY_ANCESTOR_LOCATOR);WebElementoverlayAncestor=ancestors.get(0);StringoverlayClass=overlayAncestor.getAttribute("class");return!StringUtils.isBlank(overlayClass);}
var/*WebDriver*/webdriver=require('selenium-webdriver');varbrowser=newwebdriver.Builder().forBrowser(webdriver.Browser.CHROME).build();varBy=webdriver.By;/** * Find the given element if it is accessible to the user (it's visible, and there's no blocking overlay on top of it). * @param by locator to use to find the element */functionfindUnblockedElement(/*By*/by){letelementPromise=browser.findElement(by);returnelementPromise.then(element=>{letancestorsPromise=element.findElements(By.xpath("./ancestor::div[contains(@id, 'section-overlay-')][1]"));returnancestorsPromise.then(function(ancestors){return/*WebElement*/ancestors[0].getAttribute('class').then(className=>{returnnewPromise(function(resolve,reject){if(className!==''){reject(newError('Element '+by+' is blocked by overlay.'));}else{resolve(element);}});})});});}findUnblockedButtonByText=function(text){letxpath="//button[text()='%s']".replace("%s",text);returnfindUnblockedElement(By.xpath(xpath));};
Comments (1)
V
The key concept in this scenario was: there were blocking (and not blocking) overlays, with IDs in the form of section-overlay-1, section-overlay-2, section-overlay-3, etc. To determine whether or not a WebElement was blocked (user cannot edit / access the element) by an overlay, I had to find its ancestor div with that section-overlay-* ID. Once I had a reference to that ancestor, I could check if this ancestor had a class attribute. If the class attribute existed, in our case, it was av-block-ui (React Block UI library?), then the current WebElement is blocked.
HTTPSSSH
You can clone a snippet to your computer for local editing.
Learn more.
The key concept in this scenario was: there were blocking (and not blocking) overlays, with IDs in the form of
section-overlay-1
,section-overlay-2
,section-overlay-3
, etc. To determine whether or not aWebElement
was blocked (user cannot edit / access the element) by an overlay, I had to find its ancestordiv
with thatsection-overlay-*
ID. Once I had a reference to that ancestor, I could check if this ancestor had a class attribute. If the class attribute existed, in our case, it wasav-block-ui
(React Block UI library?), then the currentWebElement
is blocked.