Unable to locate element 'username' while logging in Instagram with Selenium hosted on Heroku

Question

I have a problem with a headless mode of Selenium while making log in with Instagram. I have found a default web code snippet for Selenium headless mode, but it does not work to find a particular element on webpage (like username in Instagram main page). The code works fine locally on my pc, but when it is deployed on Heroku, it shows the error. The logs of error are below the code.

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
import time
import random as rd
import os
import schedule


def job():
  try:

    user_agent = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.96 Safari/537.36"

    options = webdriver.ChromeOptions()
    options.headless = True
    options.add_argument(f'user-agent={user_agent}')
    options.add_argument("--window-size=1920,1080")
    options.add_argument('--ignore-certificate-errors')
    options.add_argument('--allow-running-insecure-content')
    options.add_argument("--disable-extensions")
    options.add_argument("--proxy-server='direct://'")
    options.add_argument("--proxy-bypass-list=*")
    options.add_argument("--start-maximized")
    options.add_argument('--disable-gpu')
    options.add_argument('--disable-dev-shm-usage')
    options.add_argument('--no-sandbox')
    options.binary_location = os.environ.get("GOOGLE_CHROME_BINARY")

    CHROMEDRIVER_PATH = os.environ.get("CHROMEDRIVER_PATH")
    wd = webdriver.Chrome(executable_path=CHROMEDRIVER_PATH,chrome_options=options)
    
    wd.get('https://instagram.com')
    time.sleep(rd.uniform(9,11))

    username = os.environ.get("INSTAGRAM_USER")
    password = os.environ.get("INSTAGRAM_PASSWORD")

    time.sleep(rd.uniform(2.5,3.5))
    wd.find_element_by_name('username').send_keys(username)
    time.sleep(rd.uniform(0.95,1.45))
    wd.find_element_by_name('password').send_keys(password + Keys.ENTER)
    time.sleep(rd.uniform(6,8))

    wd.get('https://instagram.com')
    time.sleep(rd.uniform(2.5,3.5))
    print("SUCCESS")

    wd.quit()
  except Exception as e:
    print(e)


schedule.every(3).minutes.do(job)


while True:
  schedule.run_pending()
  time.sleep(10)

Error:

Message: no such element: Unable to locate element: {"method":"css selector","selector":"[name="username"]"} 
(Session info: headless chrome=88.0.4324.96)

DebanjanB · Accepted Answer · 2021-01-27T15:29:02.217

To send a character sequence within the username field on Instagram you can use either of the following Locator Strategies:

Using css_selector:

driver.find_element(By.CSS_SELECTOR, "input[name='username']").send_keys("Artem")

Using xpath:

driver.find_element(By.XPATH, "//input[@name='username']").send_keys("Artem")

However, the username field on Instagram is a ReactJS enabled element, so ideally, to send a character sequence to 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, "input[name='username']"))).send_keys("Artem")

Using XPATH:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[@name='username']"))).send_keys("Artem")

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

Browser Snapshot:

Thanks, you have suggested 4 options, the last of them with WebDriverWait and XPath has worked for me.) — Artem, Jan 28 '21 at 15:40
@Artem Yeah, I guess I have properly explained why the first two options may fail :) — DebanjanB, Jan 28 '21 at 16:40

Unable to locate element 'username' while logging in Instagram with Selenium hosted on Heroku

1 Answers1