如果想從頭學起Cypress,可以看下面的系列文章哦
https://www.cnblogs.com/poloyy/category/1768839.html
作用
滑動瀏覽器自帶的滾動條、元素的滾動條
語法格式
cy.scrollTo(position) cy.scrollTo(x, y) cy.scrollTo(position, options) cy.scrollTo(x, y, options) // ---或--- .scrollTo(position) .scrollTo(x, y) .scrollTo(position, options) .scrollTo(x, y, options)
可以是 cy 直接調用,也可以是 DOM 元素來調用
正確寫法
// 整個頁面往下滑動 500px cy.scrollTo(0, 500) // 滾動 .sidebar 元素到它的底部 cy.get('.sidebar').scrollTo('bottom')
重點
- 必須是 DOM 元素才能調用 .scrollTo()
- 可以是針對瀏覽器窗口
- 也可以是針對有滾動條的元素
錯誤寫法
// 不是 DOM 元素 cy.title().scrollTo('My App')
參數列表
position 位置參數
每個元素都有九個 position,具體可看下圖
坐標 x, y
距離 DOM 元素左上角的坐標,x 是橫軸,y 是豎軸
options
實際栗子
html 代碼
測試文件代碼
總結,有三種x, y的寫法
- 直接寫數字,代表 px,但不用加 px
- 百分比
- 指定px,需要加px
測試結果
結尾
我的博客即將同步至騰訊雲+社區,邀請大家一同入駐:https://cloud.tencent.com/developer/support-plan?invite_code=12vd92hxgwgj1