CODEWITHSUNDEEP
pythonselenium-webdriver
stephan
stephan

Reputation: 2403

selenium fails when adding to cart, how to click on a javascript button?

Here is a snippet of what I am trying to do, which is basically just adding an item to the cart and going to the checkout page using Selenium webdriver.

        driver.get("http://store.nike.com/us/en_us/pw/mens-tops-t-shirts/7puZobp?ipp=120")
        driver.find_element_by_xpath("//div[@id='exp-gridwall-wrapper']/div[2]/div[2]/div[2]/div/div/div/div/div/div[3]/div[2]/p").click()
        size_button = driver.find_element_by_css_selector(".exp-pdp-size-dropdown")
        actions = ActionChains(driver)
        actions.move_to_element(size_button).perform()
        driver.find_element_by_id("buyingtools-add-to-cart-button").click()
        checkout_button = driver.find_element_by_css_selector(".checkout_button")
        actions = ActionChains(driver)
        actions.move_to_element(checkout_button).perform()

I am currently getting this error during the step "click add to cart":

   WebDriverException: Message: Element is not clickable

And I believe everything after that is broken as well...

The part that I'm stumbling on is identifying the correct css elements to click on.

If anyone can explain what I'm doing wrong or show me the correct element to choose so that I can add to cart and click checkout, it would be very much appreciated!

Upvotes: 2

Views: 1468

Answers (1)

alecxe
alecxe

Reputation: 474161

I'm pretty sure it's because you've opened the size dropdown and it covers the "Add to Cart" button.

Just maximize the browser window:

driver.maximize_window()
driver.get("http://store.nike.com/us/en_us/pw/mens-tops-t-shirts/7puZobp?ipp=120")
# ...

Plus, you have a typo in the button class name - it is checkout-button and not checkout_button. And, you need to add Explicit Waits to tackle the visibility and timing issues:

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


driver = webdriver.Firefox()
driver.maximize_window()
driver.get("http://store.nike.com/us/en_us/pw/mens-tops-t-shirts/7puZobp?ipp=120")

wait = WebDriverWait(driver, 10)

driver.find_element_by_xpath(
    "//div[@id='exp-gridwall-wrapper']/div[2]/div[2]/div[2]/div/div/div/div/div/div[3]/div[2]/p").click()

# opening size dropdown
size_button = wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, ".exp-pdp-size-and-quantity-container a.exp-pdp-size-dropdown")))
actions = ActionChains(driver)
actions.move_to_element(size_button).click().perform()

# selecting size
size = wait.until(EC.visibility_of_element_located((By.XPATH, "//li[contains(@class, 'nsg-form--drop-down--option') and normalize-space(.) = 'S']")))
actions = ActionChains(driver)
actions.move_to_element(size).click().perform()

# adding to cart
driver.find_element_by_id("buyingtools-add-to-cart-button").click()

# checkout
checkout_button = wait.until(EC.visibility_of_element_located((By.CSS_SELECTOR, ".checkout-button")))
actions = ActionChains(driver)
actions.move_to_element(checkout_button).click().perform()

Works for me.

Upvotes: 1

Related Questions