Selenium ElementClickInterceptedException: Other element would receive the click error clicking Like-CodePudding

I used to have the following python selenium library code to like any IG post.

Below is a snippet code:

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

"""
imagine on chrome browser you click on any IG picture of a gallery
of a specific account
then you see only that specific picture have the heart icon to click to like
see printscreen below
"""
like = browser.find_element_by_css_selector("[aria-label='Like']") 
like.get_attribute("aria-label")
like.click()  #error on this line !!!!!!

It used to work before, but recently I get the following error:

selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <span aria-label="Like" class="glyphsSpriteHeart__filled__16__white u-__7"></span> is not clickable at point (827, 76). Other element would receive the click: <div class=" _32yJO" role="dialog">...</div>
  (Session info: chrome=95.0.4638.69)

Could someone help me with this issue?

CodePudding user response：

The Element is in an svg tag. To interact with the svg tag, below is the syntax. You can refer this.

//*[local-name()='svg']
Or
//*[name()='svg']

As per the screenshot of the DOM, the xpath for the Like element would be:

//*[local-name()='svg' and @aria-label='Like']

Do check if the xpath is unique locator for that element in the DOM (1/1 match). You can refer this.

CodePudding user response：

To click on the Instagram icon you can use either of the following Locator Strategies:

Using css_selector:

driver.find_element(By.CSS_SELECTOR, "button svg[aria-label='Like']").click()

Using xpath:

driver.find_element(By.XPATH, "//button//*[name()='svg' and @aria-label='Like']").click()

The desired element is a dynamic element, so to click on the element you need to induce WebDriverWait for the element_to_be_clickable() and you can use either of the following Locator Strategies:

Using CSS_SELECTOR:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button svg[aria-label='Like']"))).click()

Using XPATH:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//button//*[name()='svg' and @aria-label='Like']"))).click()

Note: You have to add the following imports :

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

References

You can find a couple of relevant detailed discussion in:

CodePudding user response：

Typically the below xpath

//*[name()='svg' and @aria-label='Like']

should represent all the link icon in HTMLDOM.

if you want to be more specific, i.e based on IG handle you would like to press like icon, then you should use this

//a[text()='barked']/ancestor::header/../../following-sibling::div[2]//descendant::span[2]//*[name()='svg']

Also, I would recommend you to have ExplicitWait driver WebdriverWait

wait = WebDriverWait(driver, 30)
wait.until(EC.element_to_be_clickable((By.XPATH, "paste the above here"))).click()

Imports:

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

Please check in the dev tools (Google chrome) if we have unique entry in HTML DOM or not.

xpath that you should check :

//*[name()='svg' and @aria-label='Like']

Steps to check:

Press F12 in Chrome -> go to element section -> do a CTRL F -> then paste the xpath and see, if your desired element is getting highlighted with 1/1 matching node.