前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Cypress 可操作事件

Cypress 可操作事件

原创
作者头像
wencheng
修改2021-01-06 10:44:33
9030
修改2021-01-06 10:44:33
举报
文章被收录于专栏:python 自动化测试
  • click()

单击DOM元素语法如下:

代码语言:javascript
复制
cy.get('.action-btn').click()
// clicking in the center of the element is the default
cy.get('#action-canvas').click()

cy.get('#action-canvas').click('topLeft')
cy.get('#action-canvas').click('top')
cy.get('#action-canvas').click('topRight')
cy.get('#action-canvas').click('left')
cy.get('#action-canvas').click('right')
cy.get('#action-canvas').click('bottomLeft')
cy.get('#action-canvas').click('bottom')
cy.get('#action-canvas').click('bottomRight')

// .click() accepts a an x and y coordinate
// that controls where the click occurs :)
cy.get('#action-canvas')
  .click(80, 75)
  .click(170, 75)
  .click(80, 165)
  .click(100, 185)
  .click(125, 190)
  .click(150, 185)
  .click(170, 165)

// click multiple elements by passing multiple: true
cy.get('.action-labels>.label').click({ multiple: true })

// Ignore error checking prior to clicking
cy.get('.action-opacity>.btn').click({ force: true }
  • dblclick()

双击DoM元素语法如下:

代码语言:javascript
复制
//双击DoM元素
dblclick()
//带参数的双击
dblclick(options)

带参数跟上面click完全一致

  • rightclick()

右击DoM元素语法如下:

代码语言:javascript
复制
//右击DoM元素
rightclick()
//带参数的双击
rightclick(options)

带参数跟上面click完全一致

  • type()

往DOM元素中输入

type()语法如下:

代码语言:javascript
复制
//输入文本
type(text)
//输入文本带参数的
rightclick(text,options)

text参数支持的其他如下字符如下:

  1. {backspace} :删除光标左侧的字符
  2. {det} : 删除光标右侧的字符
  3. {downarrow} : 向下移动光标
  4. {end} : 将光标移到行尾
  5. {enter} :按enter建
  6. {esc} : 按esc建
  7. {home} : 将光标移到行首
  8. {insert} :在光标右侧插入字符
  9. {leftarrow} :向左移动光标
  10. {pagedowm} :向下滚动
  11. {pageup} :向下滚动
  12. {rigtharrow} :向右移动光标
  13. {selectall} :通过选择范围来选择所有文本
  14. {uparrow} :向上移动光标
  • clear()

clear()清除输入或文本区域的值,语法如下:

代码语言:javascript
复制
//清除
cy.get().clear()
  • check()

针对<input>类型的输入框(radio button) 或者复选框(check box)Cypree提供了check和uncheck方法直接操作。语法如下:

代码语言:javascript
复制
//选中
.check()
//选中一个选项,值value
.check(value)
//选中多个选项
.check(values)
  • uncheck()

uncheck()和check用法相反用于取消单选框或者复选框语法参考check()

  • .selelct()

select()用来在<select>中选中一个<option>。语法如下

代码语言:javascript
复制
.select(value)
  • .trigger()

用来在DOM元素上触发事件。用法如下:

.trigger(evenName)

代码语言:javascript
复制
//按下光标
cy.button().trigger('mousedown')
//移动光标到元素之上
cy.button().trigger('mouseover')
//抬起光标
cy.button().trigger('mouseleave')

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家的支持。

更多文章关注小编公众号:自动化测试 To share

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档