如何使用 vue test utils 库选择 b-form-input 组件?

Posted

技术标签:

【中文标题】如何使用 vue test utils 库选择 b-form-input 组件?【英文标题】:How to select b-form-input component using vue test utils library? 【发布时间】:2020-04-19 12:06:17 【问题描述】:

如何根据电子邮件、密码等类型选择 b-form-input 组件..

使用 vue-utils-library 的 find 方法?

在我的 login.html

<b-form-input
  id="email"
  type="email"
  v-model="credentials.email"
  :class=" 'is-invalid': submitted && $v.credentials.email.$error " />

我的包装

wrapper = mount(Login,
      
        localVue,
        store,
        mocks: 
          $route: ,
          $router: 
            push: jest.fn()
          
        
      )

在我的 test.spec 文件中

it ('select', () => 
    const d = wrapper.find('BFormInput[type="email"]')
    console.log(d)
  )

但它会返回

ErrorWrapper  selector: 'BFormInput[type="email"]' 

【问题讨论】:

【参考方案1】:

我建议你应该像这样找到你的输入:

const d = wrapper.find('input.form-control[type="email"]')

【讨论】:

以上是关于如何使用 vue test utils 库选择 b-form-input 组件?的主要内容,如果未能解决你的问题,请参考以下文章

使用 element-ui 和 vue-test-utils 模拟选择

使用 jest-test-utils (vue-bootstrap) 在 b-modal 上未触发 @ok 侦听器

如何使用 vue-test-utils 打开 bootstrap-vue 模态?

VueJs 如何删除全局错误处理程序以使用 vue-test-utils 进行测试

如何使用 vue-test-utils 在单元测试期间触发窗口事件

如何使用“@vue/test-utils”测试 VueRouter 的 beforeRouteEnter?