XPath: The element seems to be absent from the DOM, yet it still exists in some form or another

Question

XPath: The element seems to be absent from the DOM, yet it still exists in some form or another

Struggling to check this checkbox using XPath, but every attempt fails as it accidentally clicks on the link in the legend (Lorem ipsum)

https://i.sstatic.net/v3Wmz.png

HTML code:

https://i.sstatic.net/dyaL0.png

<div class="input-outer checkbox">
   <div class="section-head sec-head2">
      <!---->
      <div class="pull-left">Tick this box</div>
      <!----><!---->
      <p aria-label="required" class="requiredAsteric">*</p>
   </div>
   <div class="input-validation">
      <div class="input-icon-outer">
         <!---->
         <!---->
         <!---->
         <!---->
         <input class="filled-in ng-untouched ng-pristine ng-invalid" type="checkbox" aria-label="Acceptera villkor" aria-required="true" aria-describedby="err_icon_prefix2_1" id="icon_prefix2_1"><!---->
         <label class="leadform-checkbox" tabindex="0" for="icon_prefix2_1">
            <div>
               <p>Lorem ipsum dolor sit amet, consectetur  <a href="https://www.google.com" target="_blank">adipiscing elit</a> adipiscing elit , sed do <a href="https://www.stackexchange.com" target="_blank">eiusmod tempor </a> incididunt ut labore et dolore magna aliqua.</p>
            </div>
         </label>
         <!---->
      </div>
   </div>
</div>

All attempts with these XPaths have been unsuccessful.

//label[@class='leadform-checkbox']/div";
//input[@aria-label='Tick this box']";
(//div[@class='input-icon-outer'])[3]";

Seems like the checkbox doesn't use the standard HTML functionality, rather a custom CSS-class that resembles a checkbox. Clicking on the div sends the click to the text content instead of the checkbox, leading to the accidental link click.

Is there a fix for this? How do I direct the click to the square?

Edit: Other fields in the "dialog" are accessible with these XPaths:

String xpText = "//input[@aria-label='text']";
String xpNumber = "//input[@aria-label='number']";

All elements are within the same iframe. Multiple switches between the main content and various iframes were done prior.

The heading 2.2 is visible at the top of the screenshot from the HTML source above, indicating correct frame/content selection. Also, links within the text related to this checkbox were accessible.

Included the complete dialog below for easier reference:

https://i.sstatic.net/I1NDv.png

javascript selenium selenium-webdriver xpath webdriverwait

Answer 1

Answer №1

//input[@aria-label='Check this box']

is the solution you're looking for.

Answer 2

//input[@aria-label='Check this box']

is the solution you're looking for.

Answer 3

Answer №2

Ensure that when inspecting the element, you are referencing the correct line in the HTML code that highlights the desired element. If this approach fails, double-check for the presence of an <iframe on the page and consider leveraging parent/child relationships to pinpoint the target element. I recommend trying: //div[@class='input-outer checkbox'] or //div[@class='section-head sec-head2']

Answer 4

Ensure that when inspecting the element, you are referencing the correct line in the HTML code that highlights the desired element. If this approach fails, double-check for the presence of an <iframe on the page and consider leveraging parent/child relationships to pinpoint the target element. I recommend trying: //div[@class='input-outer checkbox'] or //div[@class='section-head sec-head2']

Answer 5

Answer №3

To interact with the checkbox, you have a choice of using various XPath-based Locator Strategies:

Find the checkbox by <label> tag attribute:

driver.find_element_by_xpath("//label[@for='icon_prefix2_1']").click()

Locate the checkbox using the <p> tag attribute:

driver.find_element_by_xpath("//label[@class='leadform-checkbox'][.//p[contains(., 'Lorem ipsum dolor sit amet')]]//preceding::input[1]").click()

Identify the checkbox by its <input> tag attributes:

driver.find_element_by_xpath("//input[@class='filled-in ng-untouched ng-pristine ng-invalid' and @aria-label='Acceptera villkor']").click()

For successful interaction with the element, it is recommended to use WebDriverWait for element_to_be_clickable(). You can choose from the following XPath-based Locator Strategies:

Utilize the <label> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//label[@for='icon_prefix2_1']"))).click()

Use the <p> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//label[@class='leadform-checkbox'][.//p[contains(., 'Lorem ipsum dolor sit amet')]]//preceding::input[1]"))).click()

Employ the <input> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@class='filled-in ng-untouched ng-pristine ng-invalid' and @aria-label='Acceptera villkor']"))).click()

Note: Don't forget to include the necessary imports:

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC

Answer 6

To interact with the checkbox, you have a choice of using various XPath-based Locator Strategies:

Find the checkbox by <label> tag attribute:

driver.find_element_by_xpath("//label[@for='icon_prefix2_1']").click()

Locate the checkbox using the <p> tag attribute:

driver.find_element_by_xpath("//label[@class='leadform-checkbox'][.//p[contains(., 'Lorem ipsum dolor sit amet')]]//preceding::input[1]").click()

Identify the checkbox by its <input> tag attributes:

driver.find_element_by_xpath("//input[@class='filled-in ng-untouched ng-pristine ng-invalid' and @aria-label='Acceptera villkor']").click()

For successful interaction with the element, it is recommended to use WebDriverWait for element_to_be_clickable(). You can choose from the following XPath-based Locator Strategies:

Utilize the <label> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//label[@for='icon_prefix2_1']"))).click()

Use the <p> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//label[@class='leadform-checkbox'][.//p[contains(., 'Lorem ipsum dolor sit amet')]]//preceding::input[1]"))).click()

Employ the <input> tag attribute:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@class='filled-in ng-untouched ng-pristine ng-invalid' and @aria-label='Acceptera villkor']"))).click()

Note: Don't forget to include the necessary imports:

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC

XPath: The element seems to be absent from the DOM, yet it still exists in some form or another

https://i.sstatic.net/I1NDv.png

Answer №1

Answer №2

Answer №3

Similar questions

How can I add a variable to an object in Three.js?

Issue with Angular Factory not being invoked

Error: SEC_ERROR_UNKNOWN_ISSUER encountered while using Selenium-wire with Firefox

"Integrating JavaScript files into HTML using Flask: A step-by-step guide

selenium script execution encountered an error

The IF ELSE condition in Python Selenium WebDriver fails to execute the ELSE block when the specified element is missing

When incorporating express.static(), the Express .use() callback may be triggered multiple times

Is it feasible to conceal certain parameters within a URL using Angular UI Router?

Error: The PyCharm is unable to locate the imported file for SeleniumLibrary

Selecting and combining arrays in JavaScript

The sluggish loading speed of the page is being caused by both jQuery and an external file containing Amazon

SSR with Material UI Drawer encounters issue during webpack production build meltdown

Modify the database value linked to an <input> element each time its value is modified

Tips for sequentially arranging and rearranging an array of numbers, even when duplicates are present

I've been working on a script in JavaScript to retrieve lectures for a specific day, but I'm having trouble connecting my jQuery code to it

Having trouble obtaining error message in selenium using Java and JUnit

Place a user input field within a div element having the specified class

Utilizing Angular.JS to implement a template featuring tags

Tips for ensuring a method is not invoked more than once with identical arguments

Error encountered: Unexpected token '"', expecting "}". Perspective from React : It is an unfortunate occurrence which h