在赛普拉斯中单击按钮

Question

我是赛普拉斯测试的新手，单击并检查按钮是否被禁用时遇到问题：

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>
  );
};

我想通过以下方式进行测试：

  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();
  })

我不知道为什么写：

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

测试有效，但是当我有：

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

测试无效。在wait和click之间添加should后，我得到了：

这是网络视图：