Develop Reference

Is there a way to select an item on a webpage with Selenium with no unique ID?

My objective is to open a webpage, and click the app button for a specific app, like Anaplan. In the past, I've used get element by CSS selector with the combination of class, and ID, as shown in this past post.
first_item = driver.find_element_by_id("anaplan")
I've come across a webpage where the buttons seem to have literally no ID whatsoever, or unique values:
HTML output of the Anaplan App button:
<a
aria-label="launch app Anaplan"
class="chiclet a--no-decoration"
data-se="app-card"
href="https://gartner.okta.com/home/anaplan/0oaforg08lyATdLuw4x6/2487"
draggable="true"
><article class="chiclet--article">
<button
class="chiclet--action"
tabindex="0"
aria-label="Settings for Anaplan"
data-se="app-card-settings-button"
>
<svg
class="chiclet--action-kebab"
width="20"
height="4"
viewBox="0 0 20 4"
fill="#B7BCC0"
xmlns="http://www.w3.org/2000/svg"
>
<circle cx="2" cy="2" r="2"></circle>
<circle cx="10" cy="2" r="2"></circle>
<circle cx="18" cy="2" r="2"></circle>
</svg>
</button>
<section class="chiclet--main" data-se="app-card-main">
<img
class="chiclet--main-logo"
src="https://ok11static.oktacdn.com/fs/bcg/4/gfs1ev15ab63zqgZ91d8"
alt="Anaplan logo"
/>
</section>
<footer class="chiclet--footer" data-se="app-card-footer">
<o-tooltip content="Anaplan" position="bottom" class="hydrated"
><div slot="content"></div>
<div aria-describedby="o-tooltip-0">
<h1 class="chiclet--app-title" data-se="app-card-title">Anaplan</h1>
</div>
</o-tooltip>
</footer>
</article>
</a>
I grabbed the Xpath of the Anaplan button, which shows the following:
/html[#class='hydrated wf-proximanova-n4-inactive wf-
inactive']/body[#class='default']/div[#id='root']
/div[#class='enduser-app ']/section[#class='content-frame']
/main[#class='main-container has-top-bar']/div[#class='dashboard--main']/section[#id='main-
content']/section[#class='chiclet-area']
/section[#class='chiclet-grid--container']
/section/section[#class='chiclet-grid section-appear-done section-enter-done']
/a[#class='chiclet a--no-decoration'][1]/article[#class='chiclet--article']
The only differences between apps is the number in the bracket:
/a[#class='chiclet a--no-decoration'][1], where 1 seems to be Anaplan, 3 is G Drive, and so on. Is there a way to select elements such as this where there appears to be no unique identifier at all?

To locate the first button you can use one of the following xpaths //a[#aria-label='launch app Anaplan'] or //a[contains(#href,'anaplan')] and there are many other unique combinations. The same can be done with css selectors
Similarly to the above there are several combinations for all the other navigation buttons you provided here.
In case the element located inside <iframe> you have to switch to that <iframe> first and get out of it after that.
Locate the <iframe> with
iframe = driver.find_element_by_xpath("//iframe[#name='iframeName']") or whatever locator that it matches
Then switch_to the <iframe>:
driver.switch_to.frame(iframe)
If after that you need to continue anywhere out of the <iframe> switch out of it with
driver.switch_to.default_content()

It is possible both with xpath and css.
Example of xpath:
Anaplan:
//a[contains(#aria-label, 'Anaplan')]/article/button
Or:
//button[contains(#aria-label, 'Settings for Anaplan')]
Spam Quarantine:
//a[contains(#aria-label, 'Spam Quarantine')]
G-suite
//a[contains(#aria-label, 'G Suite Drive')]
The main idea is that you can find an element by writing a partial name of an attribute.
Update:
If an element is located inside an iframe, you should wait for it to load and switch to it. Selenium has very convenient method for it: frame_to_be_available_and_switch_to_it
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.support.wait import WebDriverWait
driver = webdriver.Chrome()
driver.get(url)
wait = WebDriverWait(driver, 15)
wait.until(EC.frame_to_be_available_and_switch_to_it((By.CSS_SELECTOR, "iframe[data-testid=shell-content]")))
After switching to iframe you work with elements inside it.

ElementClickInterceptedException in Selenium when the element is only partially obscured

I'm using Selenium for testing. I want to click on an element. The element is very much clickable and visible, but it happens that the middle point of the element is obscured, causing the error.
Here is a MCVE:
HTML code (link to demo):
<style>
button {
width: 90vw;
height: 90vh;
position: fixed;
top: 5vh;
left: 5vw;
}
.cover {
background: grey;
opacity: 0.3;
width: 80vw;
height: 80vh;
position: fixed;
top: 10vh;
left: 10vw;
}
</style>
<button onclick="alert('hi');">
Click me!
</button>
<div class="cover">
I'm in the way!
</div>
Python selenium code:
from selenium import webdriver
driver = webdriver.Chrome()
driver.implicitly_wait(10)
driver.get("https://blissfulpreciouslanservers--five-nine.repl.co/")
button = driver.find_element_by_tag_name("button")
button.click()
Result:
selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <button onclick="alert('hi');">...</button> is not clickable at point (451, 450). Other element would receive the click: <div class="cover">...</div>
This seems like a rather sad limitation of Selenium. The button is clickable, just not at all points. I don't want to have to fiddle with scrolling and coordinates.
There are many similar questions about the exception in general, e.g:
Can not click on a Element: ElementClickInterceptedException in Splinter / Selenium
Selenium can't click element because other element obscures it
Element not clickable since another element obscures it in python
However the questions are never specifically about an element that is only partially obscured, so I haven't managed to find a proper answer to my own question. The answers to other questions generally fall into these categories:
Wait until the element is clickable. Doesn't apply here.
Use action chains, e.g. ActionChains(driver).move_to_element(button).click().perform(). This doesn't help because .move_to_element() moves to the middle of the element.
Use JavaScript to perform the click. It seems like I might have to resort to this, but it's very unsatisfactory. I still want to validate that the element is clickable at least somewhere and not bypass all checks.

Have you tried to add a class to your button and then search for the class? For example:
<button class="btn" onclick="alert('hi');">
Click me!
</button>
Then use the following to find and click on that button:
driver.findElement(By.className("btn")).click();
similar to this stack overflow response by alecxe

Cannot click on button with selenium

I have the following website where I want to click on the button "SKIP THIS AD" that popup after waiting x seconds.
My code is as follows:
import selenium
from selenium import webdriver
driver = webdriver.Chrome()
driver.get('http://festyy.com/wpixmC')
sleep(10)
driver.find_element_by_xpath('/html/body/div[3]/div[1]/span[5]').click()
However, when I inspect the element I don't see a connected link to be clicked. In addition, I get
ElementClickInterceptedException: Message: element click intercepted: Element <span class="skip-btn
show" id="skip_button" style="cursor: pointer">...</span> is not clickable at point (765, 31). Other
element would receive the click: <div style="position: absolute; top: 0px; left: 0px; width: 869px;
height: 556px; z-index: 2147483647; pointer-events: auto;"></div>
Somehow it seems that everything is redirected to the larger class? How can I overcome this? When I try to copy the xpath I get also only the following: /div
Thanks in advance

It seems that the error that you receive ('element click intercepted') is due to the fact that there is a div that is placed on page load, that takes up the whole page, preventing Selenium from clicking on the skip button.
Therefore you have to remove that div first and then run this:
driver.find_element_by_xpath('/html/body/div[3]/div[1]/span[5]').click()
You can remove the div by running some JavaScript code as follows:
driver.execute_script("""
var badDivSelector = document.evaluate('/html/body/div[7]',
document.documentElement, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
null);
if (badDivSelector) {
var badDiv = badDivSelector.singleNodeValue;
badDiv.parentNode.removeChild(badDiv);
}
""")
The code above finds the full page div (identified by xpath) and removes it from the page.
Your final code should look something like this:
import selenium
from selenium import webdriver
from time import sleep
driver = webdriver.Chrome()
driver.get('http://festyy.com/wpixmC')
sleep(10)
driver.execute_script("""
var badDivSelector = document.evaluate('/html/body/div[7]',
document.documentElement, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
null)
if (badDivSelector) {
var badDiv = badDivSelector.singleNodeValue;
badDiv.parentNode.removeChild(badDiv);
}
""")
driver.find_element_by_xpath('/html/body/div[3]/div[1]/span[5]').click()
....

"Element click intercepted" Error while trying to click on CheckBox

I want to click on a check box after I load up a page, but I get the error message below:
selenium.common.exceptions.ElementClickInterceptedException: Message: element click intercepted: Element <img class="checkboximage" src="/images/nav/ns_x.gif" alt=""> is not clickable at point (843, 7). Other element would receive the click: <a class="ns-help" onclick="nlPopupHelp('EDIT_TRAN_CUSTINVC');" tabindex="0" onkeypress="(event.keyCode == 13 || event.charCode == 32) && nlPopupHelp('EDIT_TRAN_CUSTINVC');">...</a>
This is what I have right now: I've tried several other methods before this
collectionsbox = driver.find_element(By.CSS_SELECTOR,"#custbody_in_collections_fs_inp")
driver.execute_script("arguments[0].scrollIntoView(true)", collectionsbox)
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//span[#id='custbody_in_collections_fs']//img[#class='checkboximage']"))).click()
collectionsbox.click() #USUALLY FAILS RIGHT HERE
savebutton = driver.find_element(By.XPATH,"//input[#id='btn_multibutton_submitter']")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//input[#id='btn_multibutton_submitter']"))).click()
driver.execute_script("arguments[0].scrollIntoView(true)", savebutton)
savebutton.click()
time.sleep(2)
driver.switch_to.alert.accept()
I've tried the EC method, waited several seconds, scroll down to view the element. I've even used Xpath, ID, and CSS.
<input onclick="setEventCancelBubble(event); this.isvalid=(nlapiValidateField(null,'custbody_in_collections')); if (this.isvalid) {setWindowChanged(window, true);nlapiFieldChanged(null,'custbody_in_collections');;} else if ( window.loadcomplete && !document.page_is_resetting ) {setFormValue(this, !this.checked);}" aria-labelledby="custbody_in_collections_fs_lbl" onchange="NLCheckboxOnChange(this); " onkeypress="NLCheckboxOnKeyPress(event); return true;" name="custbody_in_collections" id="custbody_in_collections_fs_inp" type="checkbox" value="T" class="checkbox" style="">
<input type="hidden" name="custbody_in_collections_send" style="">
<img class="checkboximage" src="/images/nav/ns_x.gif" alt="" style="">
All I need is click the checkbox and click save up top.

Seems like another element on the DOM is unintentionally hiding the element you are trying to click. You can try executing Javascript for the click instead. This usually resolves the issue for me.
Instead of collectionsbox.click() #USUALLY FAILS RIGHT HERE, you can replace with:
driver.execute_script("arguments[0].click();", collectionsbox)

To address element is not clickable at point (x, y) error. We can follow below approaches to resolve this issue
Solution
1. Action Class
WebElement element = driver.findElement(By.id("yourelement ID"));
Actions actions = new Actions(driver);
actions.moveToElement(element).click().build().perform();
2. Element not getting clicked as it is not within Viewport
use JavascriptExecutor to get element within the Viewport:
checkBox=WebDriverWait(driver,10).until(EC.element_to_be_clickable((By.XPATH,"yourelement Xpath")))
ActionChains(driver).move_to_element(checkBox).click(checkBox).perform()

Python - Unable to click button in Selenium under tooltip, webpage throws request error

This is the element I am trying to click (the info button). It's located on pokemongomap.info, and you can see it in chrome devtools under any pokestop or gym.
<a href="#" target="_self" class="tooltip tooltipstered" id="infoboxmoreinfobtnbind" style="display: inline;">
<div id="infoboxmoreinfohit"></div>
<div id="infoboxmoreinfobtn" class="infoboxbtn">
<i class="fa fa-info-circle" aria-hidden="true" style="color: rgb(57, 135, 140);">
</i>
</div>
</a>
I am unable to click it using ActionChains, element.click(), or anything else. If I try to click it using either of those methods, I get a request error from the website. Can anyone help me? Here is some of the code I have tried.
wait = WebDriverWait(driver, 10)
actions = Actions(driver)
element = wait.until(EC.element_to_be_clickable((By.ID, 'infoboxmoreinfobtnbind')))
#element = wait.until(EC.element_to_be_clickable((By.XPATH, '//i[#class="fa fa-info-circle"]'))) also throws error when clicked
#actions.move_to_element(element).click(element).perform() doesn't work either.
action = actions.move_to_element(element)
action.click()
action.perform()
I've also tried clicking on other infobox elements using ActionChains or element.click(), all of them either do nothing or give a request error or aren't clickable at the point.

As a last resort, you can use JS with execute_script:
wait = WebDriverWait(driver, 10)
actions = Actions(driver)
element = wait.until(EC.element_to_be_clickable((By.ID, 'infoboxmoreinfobtnbind')))
driver.execute_script("$(arguments[0]).click();", element)
This is not a humanlike automation but it should do the job...
Hope this helps you!