如何使用 cypress 访问 vuejs 组件属性？答案

【问题标题】：How to access vuejs component properties from using cypress?如何使用 cypress 访问 vuejs 组件属性？
【发布时间】：2020-08-14 10:13:47
【问题描述】：

您好，我想通过使用 cypress 访问 vuejs 组件属性，因为我无法从 html/css 中唯一地定位元素。我们的应用程序 UI 是用 Vuejs 开发的，所以我尝试使用 cypress 访问 vue 组件表单 dom 对象对于前控制台， 1.var a=document.querySelector('#action_items_list > div.fill-height.col > div > div > div.fill-height > div:nth-child(1)')

2.a.vue.props.kitItemId

现在我如何在 cypress 中实现这个东西来访问组件的数据，get() 不会把它作为参数，因为它需要一个 DOM 元素来执行操作。

【问题讨论】：

我们可以通过cypress的document对象访问这些vue组件值吗？

标签： vue.js cypress

【解决方案1】：

试试这个：

cy.get('#action_items_list > div.fill-height.col > div > div > div.fill-height > div:nth-child(1)')
    .then($item => {
        console.log($item[0].__vue__.kitItemId)
    })

【讨论】：

嗨，不返回任何东西有没有办法通过cypress的任何其他方法或get（）方法找到vue组件的这些值？？