How to handle click intercepted error in Selenium

#interceptedexception #elementnotinteractable #cantfindelement

Dear guys, as a QA automation engineer, I have to deal with a lot of UI tests using Selenium.

One thing annoy me is that sometimes, when trying to click or get attribute from element, I usually get selenium exception error.

Before today, I already knew that I can use excute script in Selenium to perform using Javascript query. But it's not enough. Sometimes I still can't click on the targeted button.

So the 1 tip I got from today is using Chrome Developer tool.
I wil show you the example below.
This page has a lot of shadow DOM element so we have to use javascript to interact with them.

First go to the coccoc://settings/languages site (you can change to chrome://settings if you want)

We will deal with the spell checker button, try to click on that.

Next right click on the element choose copy - JS path:

Now you can click on that check box using element.click in javascript

The result will be : check box is clicked.

To perform it in Python it will be like :

// BasePage Element for define how to deal with shadow root element

class BasePageElement(object):

    @staticmethod
    def select_shadow_element_by_css_selector(browser, selector):
        element = browser.execute_script('return arguments[0].shadowRoot', selector)
        return element

    def find_shadow_element(self, driver, *string_text):
        wait = WebDriverWait(driver, 20)
        i = 0
        root = wait.until(ec.presence_of_element_located((By.TAG_NAME, string_text[i])))
        # root = driver.find_element_by_tag_name(string_text[i])
        while len(string_text) > (i+1):
            i = i+1
            shadow_root = self.select_shadow_element_by_css_selector(driver, root)
            root = shadow_root.find_element_by_css_selector(string_text[i])
        return root

// Find element using shadow root

class CocCocSettingsElements(BasePageElement):

    def find_settings_toggle_button(self, driver):
        return self.find_shadow_element(driver, 'body > settings-ui', '#main', 'settings-basic-page',
                                 '#basicPage > settings-section:nth-child(6) > settings-languages-page',
                                        '#pages > div > settings-checkbox-toggle',
                                        '#checkbox')


// Click on the element in page object class

class SettingsPageObject:
    coccoc_settings_elements = CocCocSettingsElements()

    def choose_spell_checker(self, driver):
        element_outside = self.coccoc_settings_elements.find_settings_toggle_button(driver)
        driver.execute_script("arguments[0].click()", element_outside)

// Implement the test

class TestSettingsCocCoc:

    settings_page_object = SettingsPageObject()

    def test_login_testrail_success(self):
        driver = webdriver.Chrome()
        driver.maximize_window()
        try:
            driver.get(CocCocSettingsUrls.SETTINGS_LANGUAGES)
            time.sleep(2)
            self.settings_page_object.choose_spell_checker(driver)
        finally:
            driver.quit()