

I want to click on Next button to test pagination, until its class is "disabled". I used the code below. But it continues to click even "Next" button has "disabled" class. And Cypress throws the error at the attachment.
static pagination(){
var index = 0
cy.get('li [data-test="page-link"]:not(.active):not([aria-label="Next"]) :not([aria-label="Previous"]').as("pages")
cy.get('@pages').its('length').then( len =>{
if(index <= len){
cy.get('[data-test="page-link"][aria-label="Next"]').then( next=>{
cy.wrap(next).invoke('hasClass', 'disabled').then( classDisable =>{
if(classDisable==false){
cy.wait(500)
cy.wrap(next).should('not.have.class', 'disabled')
cy.wrap(next).click()
}
this.pagination()
index++
})
})
}
})
}
It may be possible to avoid the conditional check altogether.
If you can get the number in the box to the left of "Next" - I'm taking a guess that .prev() will get it, but you may have to adjust that step.
Then you can click() pageCount-1 times.
cy.get('[data-test="page-link"][aria-label="Next"]')
.prev() // last page box
.invoke('text')
.then(lastPageText => {
const pageCount = +lastPageText;
Cypress._.times(pageCount -1, () => {
cy.get('[data-test="page-link"][aria-label="Next"]').click()
})
})
Try setting the force option to true on the next click.
cy.wrap(next).click({ force: true} )
If you want to click on the disabled button you have to use {force: true}
cy.wrap(next).click({force: true})
And, if you want to first check whether the button is enabled or not and then perform click, you can do something like:
cy.get('[data-test="page-link"][aria-label="Next"]').then(($next) => {
if ($next.is(':enabled')) {
//next button is enabled
cy.wrap(next).click()
} else {
// Do something when next button is disabled
}
})