如何判断Impressum链接是否可点击？Cypress实现问询

需求 #

• 检测页面内3个「Impressum」链接的可点击状态
• 解决Cookie合规横幅遮挡导致的检测失效问题
• 验证模态框中第二个「Impressum」链接的可点击性

完整代码 #

export const ttValidateImprintClickable = () => {
  cy.log("validateImprintClickable - NCA TESTIFY");

  // 先处理Cookie横幅，避免遮挡链接
  cy.get('body').then($body => {
    const cookieBtn = $body.find('[data-testid="cookie-accept"]');
    if (cookieBtn.length) {
      cy.wrap(cookieBtn).click({ force: true });
    }
  });

  // 遍历所有匹配的Impressum链接
  cy.get('a:contains("Impressum")').each(($link, index) => {
    // 验证链接可见、未被遮挡且可交互
    cy.wrap($link)
      .should('be.visible')
      .and('not.be.hidden')
      .and('be.enabled');

    // 执行点击操作，验证真实可点击
    cy.wrap($link).click();

    // 处理模态框内的第二个链接：验证模态框加载后返回原页面
    if (index === 1) {
      cy.get('.modal-imprint').should('be.visible');
      cy.go('back');
    }
  });
};

代码解析 #

• Cookie横幅处理：先检查页面是否存在Cookie同意按钮，存在则强制点击关闭，消除遮挡因素
• 链接定位与遍历：用:contains()精准定位所有Impressum链接，通过.each()逐个校验
• 可点击性验证：通过be.visible、not.be.hidden、be.enabled三个断言确保元素处于可交互状态，避免误判
• 模态框特殊处理：针对第二个在模态框内的链接，点击后校验模态框是否正常加载，再返回原页面继续检测剩余链接

内容的提问来源于stack exchange，提问作者Al Kativo