Open Silence-dream opened 1 year ago
当 Cypress 在 CI/CD 环境中运行时,经常会出现 Cypress 调用 scrollTo() 滚动后又回到原位的情况。这是因为 CI/CD 环境中通常以无头模式运行 Cypress(即无可视化界面),而滚动操作通常依赖于页面的可视区域。
scrollTo()
无头模式下的浏览器可能会对滚动操作做出一些优化或默认行为,在滚动之后自动恢复到初始状态。这种行为不符合我们在网页上手动滚动的预期效果。
为了解决这个问题,可以尝试使用 Cypress 的 scrollTo() 方法的 timeout 参数,增加滚动操作的持续时间,以确保滚动操作生效。
timeout
例如:
cy.scrollTo('bottom', { duration: 2000 });
这样会将滚动操作的持续时间延长到 2 秒钟,让滚动更充分地发生。你可以根据需要调整持续时间。
此外,还可以尝试在滚动操作后添加一些额外的断言,例如检查滚动位置是否正确或检查滚动后的元素是否可见,以确保滚动操作生效并且不会回到原位。
cy.scrollTo('bottom').should('have.prop', 'scrollTop', 1000);
上述示例中,通过断言滚动的位置是否正确,来验证滚动操作是否成功。
通过增加持续时间和进行适当的断言,你应该能够在 CI/CD 环境中更可靠地控制滚动操作,并避免回到原位的问题。
当 Cypress 在 CI/CD 环境中运行时,经常会出现 Cypress 调用
scrollTo()
滚动后又回到原位的情况。这是因为 CI/CD 环境中通常以无头模式运行 Cypress(即无可视化界面),而滚动操作通常依赖于页面的可视区域。无头模式下的浏览器可能会对滚动操作做出一些优化或默认行为,在滚动之后自动恢复到初始状态。这种行为不符合我们在网页上手动滚动的预期效果。
为了解决这个问题,可以尝试使用 Cypress 的
scrollTo()
方法的timeout
参数,增加滚动操作的持续时间,以确保滚动操作生效。例如:
这样会将滚动操作的持续时间延长到 2 秒钟,让滚动更充分地发生。你可以根据需要调整持续时间。
此外,还可以尝试在滚动操作后添加一些额外的断言,例如检查滚动位置是否正确或检查滚动后的元素是否可见,以确保滚动操作生效并且不会回到原位。
上述示例中,通过断言滚动的位置是否正确,来验证滚动操作是否成功。
通过增加持续时间和进行适当的断言,你应该能够在 CI/CD 环境中更可靠地控制滚动操作,并避免回到原位的问题。