How to write click function for edit icon in cypress

I am new to cypress, how to write click fun for edit icon, below I shared the html code

html code

[![for delete][3]][3]


Solution 1:

Finding the card with name 'cypress' and clicking the edit button

cy.contains('.MuiCardContent-root', 'cypress').within(() => {
  cy.get('svg.MuiSvgIcon-root').eq(0)  // 1st button is edit
    .click()
})

Solution 2:

you can use get() like querySelector:

let selector = 'svg.MuiIconButton-root'
cy.get(selector).click()

Solution 3:

You can right click on the element in your dev tools and copy the selector then do:

cy.get('selector').click()