Jetz
Jetz

Reputation: 255

How to find svg element using cypress

i'm trying to click on svg element with classname, but getting error

Here is html code: Timed out retrying after 4000ms: Expected to find element: .btn btn--icon btn--icon--search js-search-toggle header__action, but never found it.

<button class="btn btn--icon btn--icon--search js-search-toggle header__action">
    <div class="btn__icon btn__icon--search">
        <svg width="24" height="24" viewBox="0 0 24 24" fill="none" 
            xmlns="http://www.w3.org/2000/svg">
            <path d="M16 10.5C16 13.5376 13.5376 16 10.5 16C7.46243 16 5 13.5376 5 10.5C5 
                   7.46243 7.46243 5 10.5 5C13.5376 5 16 7.46243 16 10.5Z" stroke="black"> 
            </path>
            <path d="M19 19L14 14" stroke="black"></path>
       </svg>                           
  </div>
<div class="btn__icon btn__icon--close">
    <span class="btn btn--close"></span>
</div>
</button> 

the code i tryied:

cy.get('.btn btn--icon btn--icon--search js-search-toggle header__action').click()

how can i find this svg element?

Upvotes: 0

Views: 2088

Answers (1)

Alapan Das
Alapan Das

Reputation: 18634

If you just want to select using the class, you have to replace spaces with dots.

cy.get('.btn.btn--icon.btn--icon--search.js-search-toggle.header__action').click()

Upvotes: 1

Related Questions