Cypress点击按钮后无法跳转：click动作已触发但无页面导航

Cypress点击按钮不跳转问题解决方案 #

1. 优化元素选择器 #

你当前使用cy.get('a').eq(0)定位的是页面首个a标签，很可能匹配到了隐藏元素、不可交互元素，而非目标「Exhibitor Access」按钮。请使用更精准的定位方式，优先匹配元素文本或专属属性：

// 按文本匹配a标签
cy.contains('a', 'Exhibitor Access').realClick()
// 如果有自定义测试属性，优先使用该方式
cy.get('[data-testid="exhibitor-access-btn"]').realClick()

2. 前置校验元素可交互状态 #

点击未生效有可能是点击动作触发时，元素还未完成渲染、事件绑定未完成，或者被其他元素遮挡。可以先添加断言确认元素处于可交互状态再执行点击：

cy.contains('a', 'Exhibitor Access')
  .should('be.visible')
  .and('not.be.disabled')
  .realClick()

3. 强制触发点击或直接跳转 #

如果点击事件存在拦截逻辑，或者realClick默认触发方式不兼容，可以尝试强制点击，或者直接读取按钮的跳转地址手动访问：

// 强制忽略元素遮挡、禁用等限制触发点击
cy.contains('a', 'Exhibitor Access').realClick({force: true})

// 直接读取href属性跳转，绕过点击事件触发限制
cy.contains('a', 'Exhibitor Access').then($btn => {
  const targetUrl = $btn.prop('href')
  cy.visit(targetUrl)
})

4. 替换点击触发方式 #

你也可以尝试调用元素原生点击方法，替代realClick插件的触发逻辑：

cy.contains('a', 'Exhibitor Access').invoke('click')

内容的提问来源于stack exchange，提问作者Taimoor Pasha