How to click on the ember.js enabled button using Selenium and Python

Question

I have been trying to make this clickable and I just cannot understand what I am doing wrong. I am also trying to induce webdriverwait, so that it is clicked when it appears.

This is my code so far:

def order(k):
    driver = webdriver.Chrome(os.getcwd()+"\\webdriver\\chromedriver.exe") 
    driver.get("website.com/login-to-checkout")
    driver.find_element_by_id('i0116').send_keys(k["email"])
    driver.find_element_by_id('i0118').send_keys(k["password"])
    driver.find_element_by_id('idSIButton9').click()
    delay()
    #sign in button
    driver.find_element_by_id('idSIButton9').click()
    #Button below I cant get to be clicked
    with webdriver.Chrome() as driver:
        wait = WebDriverWait(driver, 7)
        wait.until(presence_of_element_located((By.CSS_SELECTOR, "#ember1053")))
        driver.find_element(By.id, "ember1053").click()

this is the source code for the button that I am trying to make clickable:

<div id="ember1037" class="btn-group m-b-lg m-t-lg order-call-to-action ember-view"><!---->        <!--biBehavior 80 means place order Place Order-->

<button aria-live="polite" type="button" tabindex="0" data-m="{&quot;aN&quot;:&quot;shoppingCart&quot;,&quot;cN&quot;:&quot;PlaceOrder&quot;,&quot;bhvr&quot;:80}" id="ember1053" class="btn theme-default btn-primary cli-purchase ember-view"><!---->            Place order

</button></div>

Answer 1

This may help but I've had issues with webdriver not clicking on a button when I use the id to find it. The work around I've found is using the xpath instead of the id. Like this, it's worth a try.

driver.find_element_by_xpath("""//*[@id="submit-button"]""").click()

Answer 2

The desired element is an Ember.js element and the value of the id attribute of the <button> will keep changing dynamically, every time you access the AUT(Application Under Test). Hence to click() on the element you have 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, "button.btn.theme-default.btn-primary.cli-purchase.ember-view[id^='ember'][type='button'][aria-live='polite']"))).click()
  

• Using XPATH:

  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//button[@class='btn theme-default btn-primary cli-purchase ember-view' and starts-with(@id,'ember')][contains(., 'Place order') and @aria-live='polite']"))).click()
  

• 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
  

---

References

You can find a couple of relevant detailed discussions in:

• Selenium - Finding element based on ember
• Ember dropdown selenium xpath