Cypress 滑动、定位坐标、添加请求头、iframe

一、定位页面坐标

document.getElementById('bia-dialog-content').getBoundingClientRect()

二、滑动/拖动

describe("mouse action demo",()=> {
    it("should control mouse successfully",()=> {
        cy.visit('https://devexpress.github.io/testcafe/example/');
        cy.get('#developer-name').dblclick();
        //模拟双击鼠标左键操作
 
        cy.get('#developer-name').rightclick();
        //模拟点击鼠标右键，注意cypress封装的鼠标右键操作，不会显示右键菜单项
 
        cy.get('#developer-name').trigger('mousedown');
        cy.wait(1000);
        cy.get('#developer-name').trigger('mouseleave');
        //模拟长时间点击鼠标
 
        cy.get('#developer-name').trigger('mouseover');
        //模拟鼠标划过某个页面元素
 
        cy.get('#developer-name')
            .trigger('mousedown', { which: 1})
            .trigger('mousemove', { which: 1, pageX: 600, pageY: 600 })
            .trigger('mouseup')
    })
    //模拟鼠标拖动，通过调用trigger('mousedown').trigger('mousemove').trigger('mouseup')实现拖动操作
    //另外需要注意，因为cypress底层是调用jquery提供的实现鼠标拖动方法，如果要模拟拖动操作，那么mousedown()和mousemove()中要带参数{which:1}
});

参考：https://blog.csdn.net/qiaotl/article/details/125008453

三、iframe

使用cypress-iframe插件

安装：

npm install -D cypress-iframe

在cypress/support/commands.js文件中，添加以下内容：

import 'cypress-iframe'
// or
require('cypress-iframe')

使用

cy.frameLoaded()

cy.wrap($outeriframe.contents().find('iframe#nc_1_n1z').then($inneriframe => {
   cy.wrap($inneriframe)
      .trigger('mousedown', { which: 1})
      .trigger('mousemove', { which: 1, pageX: 398, pageY: 3 })
      .trigger('mouseup')   
}))

参考：
https://blog.csdn.net/qq_33676825/article/details/106665700
https://blog.csdn.net/qiaotl/article/details/125007970

四、添加请求头

cy.visit(`${this.route.targetUrl}`,{headers:{'myHeaderKey':'bestfei'}})

参考：https://blog.csdn.net/f20052604/article/details/106531026/