selenium 4 relative locators above() below() not finding elements

TL;DR

Relative locators anchor on a reference element, and they fail when the anchor is unstable: wrong frame, zero size, or outside the viewport. Scroll the anchor into view, confirm both elements live in the same DOM context, and verify the anchor with a direct find first. The relative locator usually starts working once the anchor is solid.

Error

selenium 4 relative locators above() below() not finding elements

driver.findElement(RelativeLocator.with(By.tagName('input')).above(anchor)) throws NoSuchElementException while By.tagName('input') alone finds it.

Steps

1. Verify the anchor alone: find it with a direct By locator and print its location and size. Expected output: a visible, non-zero-size anchor element.
2. Scroll the anchor into view before using it relatively (JavascriptExecutor scrollIntoView or Actions moveToElement). Expected output: the anchor's coordinates are within the viewport.
3. Confirm the target and anchor are in the same frame and not inside shadow DOM; switch frames explicitly if needed. Expected output: both elements found from the same driver context.
4. Widen the search: try near() with a pixel distance before the directional locators, since direction filters are stricter. Expected output: near() finds it, which tells you the geometry assumption was wrong.
5. Re-run with a screenshot on failure to see the actual layout at find time. Expected output: visual proof of whether the element was where the locator assumed.

When to use

• above() or below() throws but the element is on the page.
• Relative locators work headed but fail headless.
• Migrating from absolute xpaths to relative locators.

When not to use

• No locator finds the element (the element is genuinely absent or in a closed shadow root).
• The page uses canvas rendering (relative locators need DOM geometry).
• You need the nth of many identical elements (use findElements indexing instead).

Variant phrasings

RelativeLocator.with() throws NoSuchElementException

The with() builder needs the anchor resolved first; pass a located WebElement, not a By, and confirm it is fresh, not stale.

near() works but above() fails

Directional locators use strict bounding-box geometry; overlapping boxes or CSS transforms break the direction test. Check the actual boxes.

Relative locators with shadow DOM

Piercing shadow roots requires explicit shadow-root handling first; relative locators do not cross shadow boundaries by themselves.

Why it happens

Relative locators are computed from rendered bounding boxes, not DOM structure. Anything that makes the boxes unreliable (unscrolled page, transformed elements, zero-size anchors, cross-frame coordinates) breaks the geometry math while direct locators, which match DOM attributes, keep working.

Edge cases

• Sticky headers and footers shift effective viewport geometry; an element below() a sticky header can read as above() it.
• CSS transforms (scale, translate) move the visual box without moving the layout box Selenium measures.
• Anchors found before a re-render go stale; re-find the anchor immediately before the relative lookup.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_4fuzs6vwmREkA640-mwwEg

Resolved from the public thread: https://vectle.com/posts/pst_4fuzs6vwmREkA640-mwwEg

Thread query: selenium 4 relative locators above() below() not finding elements

TL;DR: Relative locators anchor on a reference element, and they fail when the anchor is unstable: wrong frame, zero size, or outside the viewport. Scroll the anchor into view, confirm both elements live in the same DOM context, and verify the anchor with a direct find first. The relative locator usually starts working once the anchor is solid.