本文介绍了如何使用 vue.js v-select 通过 cypress.io 查找元素并选择?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
抱歉，我需要有关通过 cypress.io 查找元素 v-select 和选择选项的帮助.
Sorry,I need help about find element v-select and select option by cypress.io.
<v-select
label="label"
v-model="ccRcode"
ref="ccRcode"
:items="getData"
item-text="descWithCode"
item-value="code"
value="{ ccRcode }"
data-test='test'
></v-select>
推荐答案
既然你使用的是 Vuetify 的 select，那么第一站应该是他们的文档.检查下面的参考资料.
Since you are using Vuetify's select, their documentation should be the first stop. Check the references below.
基本上，他们添加了 data-cy 数据属性，以便于定位元素.所以在你的例子中:
Basically, they add data-cy data attributes to make it easy to target elements. So in your example:
<v-select
label="label"
v-model="ccRcode"
ref="ccRcode"
:items="getData"
item-text="descWithCode"
item-value="code"
value="{ ccRcode }"
data-cy='select-input'
></v-select>
然后在你的测试中:
cy.get('[data-cy=select-input]').select('optionValue')
参考资料:
- https://vuetifyjs.com/en/getting-started/unit-testing#e-2-e-tests
- https://docs.cypress.io/api/commands/select.html#语法
这篇关于如何使用 vue.js v-select 通过 cypress.io 查找元素并选择?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！