(三)Cypress之常用方法详述

1.1 常见基本方法

beforeEach：执行测试用例之前操作，一个 describe() 或 context() 内有多少个测试用例 it() ，就会执行几次 beforeEach()

visit：在前置钩子函数beforeEach里面访问对应的链接

1.2 实例说明：

1  beforeEach(() => {
2       cy.visit('cashticket?isdebug=true&userid=pd86068&isskipoauth=true');
3       cy.wait(waitPageTime);
4     })

2.1 常见基本方法

get：定位元素，用css selector定位选择器
type：输入文本
focus：元素聚焦
should：断言，hava.value 是元素的value属性值，判断是否为‘某个值’
wait：等待数毫秒或等待别名资源解析后，再继续执行下一个命令

2.2 实例说明：

it('Package Type', () => {

      cy.get('#securityControl',{timeout:timeOut}).

          focus().type('10y').wait(waitTime).

          type('{enter}').//输入回车键

          should('have.value','T 0 5/8 08/15/30 91282CAE1 US91282CAE12');

          cy.wait(waitTime1);

          cy.get('#packageType>div>div>input').

          should('be.visible');

})

3.1获取当前页面URL

cy.url()

cy.url().should('contain','link')

3.2刷新页面

//等同于F5

cy.reaload()

//等同于ctrl+F5强制刷新

cy.radload(true)

3.3设置窗口

cy.viewpoint(1024,768)

3.4利用jQuery判断元素是否存在

const btn = '#btn'
Cypress.$(btn).length>0{
 cy.get(btn).click()
}

3.5获取元素的属性值

cy.get('#btn').then(function(){
   const btnTxt = $btn.text()
   cy.log(btnTxt)
})

3.6清除文本

cy.get('div>a').clear()
cycy.get('div>a').clear().type()

4.1操作单选多选按钮

//选中
cy.get('radio').first().check('us)
//取消选中
cy.get('radio').uncheck('us)
//选中所有复选框
cy.get('[type="checkbox"]').check()
//勾选值为’ subscribe ‘和’ accept '的复选框
cy.get('form input').check(['subscribe', 'accept'])

4.2操作下拉菜单

cy.get('select').select('下拉选项的值')
cy.get('li').eq(0).click()

4.3操作弹出框

cy.get('iframe')
    .then(function($iframe){
     //定义要查找的元素
     const $body = $iframe.contents().find('body')
     //在查找到的元素中查找btn并单击
     cy.wrap($body).find('#bin').click()
})

4.4操作被覆盖的元素

cy.get('#btn').click({force:true})

4.5模拟键盘操作

cy.get('input').type('111')
cy.get('input').type('{enter}')

参考文章：https://zhuanlan.zhihu.com/p/148286130