Conditional testing in Cypress - check if cy.xpath-element has class value

Question

What I want to do: I want to click a button. Then some element expands, and the button class name is changing. I only want to expand the element if not done yet.

I have to use cy.xpath, which makes it more complicate.

if (cy.xpath('//div[1]/button').should('have.class', 'it-is-focused'))
{
   // do something
}

This code is not working, because the class is not available. An error is thrown.

With .then() implemented

cy.xpath('//div[1]/button').then(($btn) => { 
    if($btn.hasClass('abc-focused')) {   
         // do something
    }
    else {
         // do something else
    }
})

Problem, if-bracket is never executed. $btn.hasClass('abc-focused') seem not to work. But the class is available in the DOM of this button.