'How to check the radio button is clickable or not in cypress

I need to check whether the radio button is clickable or not. In some scenarios this radio button is clickable but in some scenarios, the user is not able to click the radio button.

The cursor is not allowed in the not clickable scenario.

Can someone help me for this?

I have attached screenshots below.

I have tried many this but not worked.

checkSkipBtnClickable(){

    const checkSkipButton = cy.get(':nth-child(3) > .ant-radio-wrapper')
  

 }

Cursor is not allowed to click

Cursor is allowed to click

code

cypress

Solution 1:^[1]

This gives you a true/false value in an alias called checkSkipButton

cy.contains('h3', 'Skip')
  .parent()
  .then($el => $el.css('cursor') === 'not-allowed')
  .as('checkSkipButton')

cy.get('@checkSkipButton').then(checkSkipButton => {
  if (checkSkipButton) {
    ...
  }
})

Solution 2:^[2]

This is the answer I got:

cy.contains('h3', 'Skip')
      .parent()
      .then($el => $el.css('cursor') === 'not-allowed')
      .as('checkSkipButton')

      cy.get('@checkSkipButton').then(checkSkipButton => {
          if (checkSkipButton) {
            cy.log("Skip is not available")
          }
          else{
              cy.log("Skip is available")
          }
      })

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	Fody
Solution 2	Jeremy Caney

'How to check the radio button is clickable or not in cypress

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]