Cypress 做 e2e 测试,如何在获得某个 checkbox 后先判断它是否被 check 然后再更改它的状态?

比如如果这个 checkbox 已经被 check 了,就不做操作,否则将它 check。

我们假设这个 checkbox 的 data-testid 属性是 VendorCodeCheckbox-0-test-id。Cypress 的代码如下:

javascript 复制代码
cy.getByTestId('VendorCodeCheckbox-0-test-id')
  .shadow()
  .find('[role=checkbox]')
  .then(checkbox => {
    if (checkbox.get().at(0).ariaChecked !== 'true') {
      checkbox.click()
    }
  })

注意,对于不同的前端框架,寻找组件的逻辑可能不同。

相关推荐
沛沛老爹20 小时前
从Web到AI:金融/医疗/教育行业专属Skills生态系统设计实战
java·前端·人工智能·git·金融·架构
C_心欲无痕20 小时前
Next.js 的哲学思想
开发语言·前端·javascript·ecmascript·nextjs
hxjhnct20 小时前
Vue-Router 哈希路由 vs 历史路由详解
javascript·vue.js·哈希算法
海鸥两三20 小时前
登录页面form表单
前端·javascript·css
[H*]20 小时前
Flutter框架跨平台鸿蒙开发——Pattern Matching模式匹配
android·javascript·flutter
光影少年20 小时前
前端如何开发ai生成图片及流式回答
前端·人工智能·langchain
玫城1 天前
[ VUE ] 封装通用数组校验组件,el-input内使用
前端·javascript·vue.js
弓.长.1 天前
React Native 鸿蒙跨平台开发:实现一个多功能单位转换器
javascript·react native·react.js
南半球与北海道#1 天前
前端打印(三联纸票据打印)
前端·vue.js·打印
摘星编程1 天前
React Native for OpenHarmony 实战:ToggleSwitch 切换开关详解
javascript·react native·react.js