Selenium Click on a Button with Complex HTML Structure

When attempting to click a button with a complex HTML structure using Selenium, you may encounter the NoSuchElementException. This can occur when the button's HTML contains multiple classes or elements with onclick attributes.

To accurately click such buttons, follow these steps:

1. Verify the HTML Structure: Inspect the element to confirm its HTML structure. Ensure that the target button has an onclick attribute. For instance, the HTML provided includes two buttons with onclick attributes.

2. Remove Spaces in CSS Selectors: When using the CSS selector to locate the element, ensure that there are no spaces between the class names. Correct the following selector:

   driver.find_element_by_css_selector('.button .c_button .s_button').click()

   To:

   driver.find_element_by_css_selector('.button.c_button.s_button').click()

3. Target Unique Elements: Focus on identifying unique elements within the button's HTML. In this case, the span element with the text "Search" and "Reset" can serve as unique identifiers.

4. Use Precise CSS Selectors: Construct CSS selectors that target specific elements within the button's HTML. For example:

   • To click the "Search" button:

     driver.find_element_by_css_selector('.s_button span:contains("Search")').click()

   • To click the "Reset" button:

     driver.find_element_by_css_selector('.s_button span:contains("Reset")').click()

By following these steps, you can accurately click buttons with complex HTML structures using Selenium.