Selenium Compound class names not permitted

I have the below code that clicks on an element to pop up a screen and copy the text in it

el1 = driver.find_element_by_id("keyDev-A")
el1.click()
el2 = driver.find_element_by_class_name("content")
print(el2.text)

However, when I tried to get selenium to click on the button within that popup with

el3 = driver.find_element(By.CLASS_NAME, "action-btn cancel alert-display")
el3.click()

It produces an error message:

invalid selector: Compound class names not permitted

This is the HTML that I am trying to get selenium to click on. The Close button.

<div class="nav">
    <span class="action-btn confirm prompt-display">Confirm</span>
    <span class="action-btn cancel prompt-display">Cancel</span>
    <span class="action-btn cancel alert-display">Close</span>
</div>

How should I be writing el3 in order to click on the Close button?

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Leon’s comment leads to the correct information that compound class names are no longer supported. What you could do instead is try using css selectors. In your case, the following line of code should help you get the element you want :

el3 = driver.find_element_by_css_selector(".action-btn.cancel.alert-display")

It finds the element with all three classes (action-btn, cancel and alert-display) in the class attribute. Do note that the order of the classes does not matter here and any of the classes may appear anywhere in the class attribute. As long as the element has all three classes, it will be selected.
If you want the order of the classes to be fixed, you can use the following xpath :

el3 = driver.find_element_by_xpath("//*[@class='action-btn cancel alert-display']")

Method 2

I am late to this question. But I also found a work around by treating the compound classes as a String, using tag_name, and get_attribute(‘class’), when you are not familiar with Xpath. It needs some more lines of code but it’s straight forward and fit for beginners like me.

   elements = driver.find_elements_by_tag_name('Tag Name Here')
        for element in elments:
            className = watchingTable.get_attribute('class')
            print(className)
                if className == 'Your Needed Classname':
                    #Do your things

Method 3

The answer here are incorrect :

If you check the exception from the by_class_name:

you can see it is using css under the hood

by_class_name just adds ‘.’ infront of the locator provided so ‘a’ will be passed as ‘.a’ and a.b will be passed as ‘.a.b’

So You can use class_name for multiple classes , just need to replace space with ‘.’

so “a b c” should be passed as “a.b.c”

Eg:

Working example:

from selenium import webdriver

import time

from selenium.webdriver.support import expected_conditions as EC

driver = webdriver.Chrome()
driver.get("https://stackoverflow.com/questions/65579491/find-element-by-class-name-in-selenium-giving-error/65579606?noredirect=1#comment115946541_65579606")
time.sleep(5)
elem = driver.find_element_by_class_name('overflow-x-auto.ml-auto.-secondary.grid.ai-center.list-reset.h100')

print(elem.get_attribute("outerHTML"))

Method 4

This error message…

invalid selector: Compound class names not permitted

…implies that locator strategies using Compound class names are not valid while using Selenium.

Traces of this change can be confirmed from the Selenium v2.40.0 changelist where the change log mentions about adding proper error code for compound class name usage:

• Implemented proper error code for the case of invalid css selector empty class name, and compound class name in atoms.

Solution

As an alternative you can use either of the following Locator Strategies:

• Using CSS_SELECTOR:

  driver.find_element(By.CSS_SELECTOR, "span.action-btn.cancel.alert-display").click()

• Using XPATH:

  driver.find_element(By.XPATH, "//span[@class='action-btn cancel alert-display']").click()

References

You can find a couple of relevant detailed discussion in:

• How to locate an element with multiple classnames using Selenium and Python

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0