'How to get name of the button element in Cypress

I need to create a condition that if on a page is a button with the text value "Unblock", it's going to get clicked via Cypress in advance. The clicking part and "if" condition I can manage, I need to know how to get javascript to detect which button has that text value "Unblock", thanks!

cy.get(".scroller").eq(1).find("button").then(($scroller) => {
          let test = $scroller //how to get the text value of the button?
          console.log(test)
        })

    
        
        cy.wait(20000)
        cy.contains("Unblock").click()
        cy.wait(3000)
        cy.contains("Close").click()
        cy.contains("Back to main page").click()
        


Solution 1:[1]

You can use cy.contains(), since it only returns the one button with the required text.

cy.contains("button", "Unblock")
  .then(($scrollerButton) => {
    console.log($scrollerButton.text())
  })

Solution 2:[2]

1.You can use invoke('text') to get the button name:

cy.get('.scroller')
  .eq(1)
  .find('button')
  .invoke('text')
  .then((text) => {
    cy.log(text) //Logs button text
  })
  1. Or You can also use the Jquery text() as well to get the button name:
cy.get('.scroller')
  .eq(1)
  .find('button')
  .then(($scroller) => {
    cy.log($scroller.text()) //Logs button text
  })

So in your case you can apply the if-else like this:

cy.get('.scroller')
  .eq(1)
  .find('button')
  .then(($scroller) => {
    if ($scroller.text().trim() == 'Unblock') {
      //Do Something
    } else {
      //Do Something
    }
  })

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 TesterDick
Solution 2 Alapan Das