Clicking on button in Cypress

I am new in Cypress testing and have issue with click and checking whether the button is disabled or not:

export const GoogleLoginButtonPure = ({ isInProgress, login }: AllProps) => {
  const handleClick = useCallback(() => login(), [login]);
  const { t } = useTranslation();
  return (
    <GoogleButton
      data-cy="GoogleButton"
      disabled={isInProgress}
      onClick={handleClick}
      fullWidth
      variant="contained"
      startIcon={GOOGLE_ICON}
    >
      {t('login.button')}
    </GoogleButton>
  );
};

which I want to test in the following way:

  it('login button should be disabled with wrong credentails', () => {
    cy.server();
    cy.route({
      method: 'POST',
      url: '**/api/*/login',
      status: 401,
      response: 'Unauthorized',
      delay: 500,
    }).as('getWrongUser');

    // check disabled button here:
    cy.get('[data-cy=GoogleButton]')
      .click()
      .should('be.disabled');

    cy.checkReduxState('login', 'loginInProgress');

    cy.wait('@getWrongUser').then(() => {
      cy.checkReduxState('login', 'loginError');
    });
    cy.pause();
  })

I have no idea why when I write:

cy.get('[data-cy=GoogleButton]')
  .click()

test works, but when I have:

cy.get('[data-cy=GoogleButton]')
  .click()
  .should('be.disabled');

Test did not work. When I have added wait between click and should I got: