Q:

Selenium element selection on Instagram

I am trying to create an Instagram bot that likes images by selecting the 'heart element' from the webpage and clicking it.
I saw that the element was wrapped like so:
<div class="eo2As ">
<section class="ltpMr Slqrh">
<a class="fr66n tiVCN" href="#" role="button">
<span class="Szr5J coreSpriteHeartOpen ">Like</span></a>

and the class values are same for all the unliked heart elements for the whole page.
My code:
from selenium import webdriver
username = "----"
password = "----" #values present in original file

getdriver = ("https://www.instagram.com/accounts/login/")

driver = webdriver.Chrome(r'C:\testDir\chromedriver_win32\chromedriver.exe')
driver.get(getdriver)

driver.find_element_by_xpath("//input[@name='username']").send_keys(username)
driver.find_element_by_xpath("//input[@name='password']").send_keys(password)
driver.find_element_by_xpath("//button[contains(.,'Log in')]").click()

#working perfectly till here

like = driver.find_element_by_css_selector('.Szr5J.coreSpriteHeartOpen')
#spits error in this line

for x in range(0,len(like)):
    if like[x].is_displayed():
        like[x].click()

It keeps spitting the error:
selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":".Szr5J.coreSpriteHeartOpen"}

I tried using different patterns of class names but I am unable to figure out how to do this! 
Any help will be appreciated!

A:

Try following options:
# the script is too quick and tries to locate the element before the page is fully loaded. That's why it is useful to use `WebDriverWait`
like = WebDriverWait(driver, 5).until(EC.presence_of_element_located((By.CSS_SELECTOR, '.Szr5J.coreSpriteHeartOpen')))

or:
import time

time.sleep(5) # pause 5 sec after login in istagram
like = driver.find_element_by_css_selector('.Szr5J.coreSpriteHeartOpen')

PS if I right understand you want to locate all 'hearts' on the page. Therefore you should use driver.find_elements_by_css_selector like this:
# gives an array of elements found
like = driver.find_elements_by_css_selector('.Szr5J.coreSpriteHeartOpen')

then you can iterate this elements using loop.
The full working code here:
username = "----"
password = "----" #values present in original file

getdriver = ("https://www.instagram.com/accounts/login/")

driver = webdriver.Chrome(r'C:\testDir\chromedriver_win32\chromedriver.exe')
driver.get(getdriver)

driver.find_element_by_xpath("//input[@name='username']").send_keys(username)
driver.find_element_by_xpath("//input[@name='password']").send_keys(password)
driver.find_element_by_xpath("//button[contains(.,'Log in')]").click()

# after login there is a popup which should be closed
popup = WebDriverWait(driver, 10).until(EC.element_to_be_clickable((By.XPATH, '//div/div/button[contains(., Close)]')))
driver.find_element_by_xpath("//div/div/button[contains(., Close)]").click()

WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.CSS_SELECTOR, '.Szr5J.coreSpriteHeartOpen')))
# find all 'hearts' presented on the page
likes = driver.find_elements(By.CSS_SELECTOR, ".Szr5J.coreSpriteHeartOpen")
print(len(likes))
print("WORKS")

for x in range(0,len(likes)):
    if likes[x].is_displayed():
        likes[x].click()
        print(x)

Output:
3
WORKS
0
1
2

