element not interactable: [object SVGGElement] has no size and location error interacting with search field on YouTube homepage using Selenium Python

Question

Code trials:

from selenium import webdriver
from selenium.webdriver import Keys, ActionChains
from selenium.webdriver.chrome.service import Service
from time import time
from selenium.webdriver.common.actions.action_builder import ActionBuilder
from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC


service = Service(executable_path="C:\\Users\\aps\\Desktop\\Python\\chromedriver.exe")
driver = webdriver.Chrome(service=service)
driver.get("https://youtube.com")


search = WebDriverWait(driver, 10).until(EC.presence_of_element_located((By.ID, "search")))

ActionChains(driver).move_to_element(search).pause(2).click_and_hold().send_keys("Iktarfa").perform()
button = driver.find_element(By.ID, "search-icon-legacy").click()

Search field is getting fetched.

But after that I am getting following error, I am out of ideas and a new learner. Please HELP!!

Can you confirm the page url? – Barry the Platipus Jul 30 '22 at 07:59 — Barry the Platipus, Jul 30 '22 at 07:59
Yes, it is https://youtube.com – Ashutosh Goyal Jul 30 '22 at 08:14 — Ashutosh Goyal, Jul 30 '22 at 08:14

score 1 · Accepted Answer · answered Jul 30 '22 at 07:39

The locator strategy which you have used:

(By.ID, "search")

identifies multiple elements within the HTML DOM.

youtube_search

and the first WebElement having the property style="display: none;". Hence you see the error.

Solution

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, "ytd-searchbox#search"))).send_keys("text")

Using XPATH:

WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//ytd-searchbox[@id='search']"))).send_keys("text")

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

Thank you so much, It was silly at my part. I did not check it. I presume that it is Id not class, so it will be used only one. — Ashutosh Goyal, Jul 30 '22 at 08:04

score 0 · Answer 2 · answered Jul 30 '22 at 08:08

There is no need to add a Actions class for this scenario. It is perfectly capable of doing the search after just using the click and then searching for the element.

I used this code piece and it works perfectly fine

import time
from seleniumwire import webdriver
from webdriver_manager.chrome import ChromeDriverManager
from selenium.webdriver.chrome.options import Options
from selenium.webdriver.chrome.service import Service
from selenium.webdriver.common.by import By
from selenium.webdriver.support.wait import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

svc = Service(ChromeDriverManager().install())
options = Options()
options.add_argument('--allow-running-insecure-content')
options.add_argument('--ignore-certificate-errors')
driver = webdriver.Chrome(service=svc,options=options)
driver.maximize_window()


driver.get("https://youtube.com")
search = WebDriverWait(driver, 20).until(EC.presence_of_element_located((By.ID, "search")))

driver.find_element(By.NAME,'search_query').click()
time.sleep(5)

driver.find_element(By.NAME,'search_query').send_keys('Iktarfa')

button = driver.find_element(By.ID, "search-icon-legacy").click()

time.sleep(5)

driver.quit()

I've used the sleep method, but you should in general use an intelligent wait mechanism like Explicit waits.

Output screenshot -

element not interactable: [object SVGGElement] has no size and location error interacting with search field on YouTube homepage using Selenium Python

2 Answers2

Solution