Need help. I get error : ElementNotInteractableException: Message: element not interactable

I am using the following selenium code and I believe find_element() is finding the button. But when I click on it I get error... help?

# Select Usage button 
eButton = self.browser.find_element(By.XPATH, "//button[@aria-label='Usage menu']")
eButton.click()

The header has 4 buttons. Below is the html for the 1st 2 buttons:

<tmo-unav-dropdown _nghost-serverapp-c121=""  id="nav-link-contaniner-0">
  <div _ngcontent-serverapp-c121=""  data-flk-success="atNodeInserted51" style="visibility: visible;">
    <div _ngcontent-serverapp-c121="" >
      <a _ngcontent-serverapp-c121="" tmodigitalanalytics=""  id="digital-header-nav-link-head-0" href="https://my.t-mobile.com/billandpay" target="_self"> Bill &amp; pay <!----><!----></a>
      <button _ngcontent-serverapp-c121="" aria-haspopup="true"  aria-label="Bill &amp; pay menu" id="digital-header-nav-link-caret-0" aria-expanded="false" aria-hidden="true" tabindex="-1"><!----></button>
      <!----><!----><!----><!---->
    </div><!---->
  </div>
</tmo-unav-dropdown>

<tmo-unav-dropdown _nghost-serverapp-c121=""  id="nav-link-contaniner-1">
  <div _ngcontent-serverapp-c121=""  data-flk-success="atNodeInserted51" style="visibility: visible;">
    <div _ngcontent-serverapp-c121="" >
      <a _ngcontent-serverapp-c121="" tmodigitalanalytics=""  id="digital-header-nav-link-head-1" href="https://www.t-mobile.com/usage" target="_self"> Usage <!----><!----></a>
      <button _ngcontent-serverapp-c121="" aria-haspopup="true"  aria-label="Usage menu" id="digital-header-nav-link-caret-1" aria-expanded="false" aria-hidden="true" tabindex="-1"><!----></button>
      <!----><!----><!----><!---->
    </div><!---->
  </div>
</tmo-unav-dropdown>

PS. I am trying to scrape my data usage info from t-mobile web site. I am able to login, pw and get to main page. I am able to get to usage by browser.get('https://t-mobile/usage') after logging in. But want to understand how html click could work???

CodePudding user response：

There are several possible issues that can cause the error you mentioned.
Since we can't debug your actual code, only guess the most possible options are:

1. You need to add a delay.
   Possibly waiting for the element to become clickable will help here.
   If so, please try this:

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

wait = WebDriverWait(driver, 10)
wait.until(EC.element_to_be_clickable((By.XPATH, "//button[@aria-label='Usage menu']"))).click()

2. The element can be out of visible view port.
   If so scrolling to the element and then clicking on it should help.
   Something like this will do the job:

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

wait = WebDriverWait(driver, 20)
actions = ActionChains(driver)

element = wait.until(EC.presence_of_element_located((By.XPATH, "//button[@aria-label='Usage menu']")))
actions.move_to_element(element).perform()
time.sleep(0.5)
element.click()

CodePudding user response：

The target element in the above HTML snippet is a hidden element. In the element HTML tag, you can see the attribute aria-hidden="true" which means this is a hidden element.

My suggestions are :

1. Check if the XPATH //button[@aria-label='Usage menu'] is pointing to the expected element. There might be another element matching the same XPATH which is not hidden.
2. If the element XPATH is correct even after checking #1 above, fire the action through the JavaScript executor.

Using JavaScript executor to click on the element.

eButton = self.browser.find_element(By.XPATH, "//button[@aria-label='Usage menu']")
driver.execute_script("arguments[0].click();", eButton)