element not visible despite availability in docume

Question

Page Link : https://contacts.google.com/u/1/?pageId=none

Desired: I want to select all contacts by clicking the highlighted SVG caret icon in attached image.

Problem facing : Getting error element not visible on svgicon.click(). Though element is clearly available in visible DOM as per image attached.

Observation : I have noticed that if we manually click on caret icon then DropDown html code is being inserted via JavaScript & on any other body click it is removing the DropDown html code.

I know following code statement used to achieve the desired is correct & working but not populating DropDown . Any help is much appreciated.

//find & click on SVG icon

svgicon = driver.find_element_by_css_selector('div.PFdmz .uzHa0d .RANAid[role="button"]')
svgicon.click()

//click on all link post dropdown appears
wait5.until(EC.presence_of_element_located((By.XPATH, '//div[@class = "jO7h3c" and text() = "All"]'))).click()

DOM Image

EDIT 1 - Sample Javascript effort to select all checkboxes

t=0
for _ in range(len(driver.find_elements_by_css_selector('.XXcuqd div[role="checkbox"]'))):
    cimgs = driver.find_elements_by_css_selector('.XXcuqd div[role="checkbox"]')
    ActionChains(driver).move_to_element(cimgs[t]).perform()
    driver.execute_script("arguments[0].click();", cimgs[t])
    t = t+1

if somehow we can use this method to reduce time taken to mark all checkboxes checked (at one go in place of using Actionchains) then this will solve problem too. At any point of time i will have 10000+ contacts for this activity.

Answer 1

For some reason you need to double click the icon:

import selenium
from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.common.action_chains import ActionChains
import time

driver=webdriver.Firefox()
# Log into Google.
url = "https://accounts.google.com/signin/v2/identifier?hl=en&passive=true&continue=https%3A%2F%2Fwww.google.com%2F&flowName=GlifWebSignIn&flowEntry=ServiceLogin"
driver.get(url)
time.sleep(1)
username = driver.find_element_by_id('identifierId')
username.send_keys("REDACTED")
time.sleep(1)
driver.find_element_by_id('identifierNext').click()
time.sleep(1)
password = driver.find_element_by_name('password')
password.send_keys("REDACTED")
time.sleep(1)
driver.find_element_by_id('passwordNext').click()
time.sleep(1)

url="https://contacts.google.com/"
driver.get(url)
time.sleep(1)
# Select the first contact and click on it to open the desired menu.
contact = driver.find_element_by_css_selector("div[role='checkbox']")
contact.click()
time.sleep(1)
# Double click the selected action icon to open menu.
svgicon = driver.find_element_by_css_selector("div[data-tooltip='Selection actions']")
ActionChains(driver).move_to_element(svgicon).double_click().perform()
time.sleep(1)
# Click the "All" button.
selectall = driver.find_element_by_xpath("//*/div[text()='All']")
selectall.click()

Answer 2

Well, after investing 15+ days in research, learning & SO community help, nothing worked as expected hence i had to go to 2nd option (undesirable) to meet the purpose.

Working answer

# get total contacts count from left side menu displayed number
totalcount = driver.find_element_by_css_selector('span.jlpDMe[dir="ltr"]').get_attribute('innerHTML')
time.sleep(1)
cimg = driver.find_elements_by_css_selector('div.XXcuqd div[role="checkbox"]')
#t=1 because **div[data-tooltip='Selection actions']** is also a checkbox & we don't want that to be a part of loop
t=1 
while t < int(totalcount)+1:
    driver.execute_script("arguments[0].click();", cimg[t])
    t+= 1

This method is way faster than using Actionchains i had shown in EDIT 1 - Sample Javascript effort to select all checkboxes.

Anyway, thanks everyone for putting your mind to solve a puzzle though it's still a puzzle to me. But considering amount of efforts put up by everyone, bounty owner is @Dan-Dev. Thanks @Dan-Dev & keep helping people like us.

Answer 3

I don't know why but Dan-dev's code performs the result you need, I have tried it and it works fine for me. In this case I'll just put another alternative to what I have done before when I encountered a similiar problem like yours might somehow work for you. Here's my code:

from selenium.webdriver.support.ui import Select


#From Dan-dev's code
svgicon = driver.find_element_by_css_selector("div[data-tooltip='Selection 
actions']")
ActionChains(driver).move_to_element(svgicon).double_click().perform()

#Alternative/Optional Solution
driver.execute_script("return arguments[0].removeAttribute('style');", svgicon)
selectall = Select(svgicon)

for option in selectall.options:
 selectall.select_by_visible_text('All')

Answer 4

In your first code example,

svgicon = driver.find_element_by_css_selector('div.PFdmz .uzHa0d 
.RANAid[role="button"]')

the selector matches four elements, and the checkbox you are looking for is the fourth. If you haven't already, please try

svgicon = driver.find_elements_by_css_selector('div.PFdmz .uzHa0d 
.RANAid[role="button"]')[3]

instead of that line.

I'm immediately sure about the JS executor but could take a look if the above code doesn't work.