el-checkbox не может быть установлен галочкой или по крайней мере без изменений на v-модели - PullRequest
0 голосов
/ 03 апреля 2019

Я настраиваю некоторые тесты для моего сайта vuejs. Я использую element-ui . Я пытаюсь шутить на моей странице подключения. У меня есть флажок, связанный с «запомнить меня». Я бы проверил это и проверил, изменилось ли значение v-модели.

К сожалению, это не так.

В моем файле подключения есть флажок:

...
  <el-checkbox v-model="connectionForm.rememberme"></el-checkbox>
...

И переменная Rememberme:

...
  data() {
    return {
      connectionForm: {
        ...
        rememberme: false
      },
...

Мой тестовый файл:


describe('Connection', () => {
  const wrapper = mount(Connection)

  it('checkbox click', () => {
    expect(wrapper.vm.connectionForm.rememberme).toBe(false)

    expect(wrapper.contains('el-checkbox')).toBe(true)
    const elCheckbox = wrapper.find('el-checkbox')

    elCheckbox.setChecked(true)
    expect(wrapper.vm.connectionForm.rememberme).toBe(true)
  })
})

 FAIL  frontend/components/user/sessions/New.test.js
  Connexion
    ✓ has a el-button (4ms)
    ✕ checkbox click (10ms)

  ● Connexion › checkbox click

    [vue-test-utils]: wrapper.setChecked() cannot be called on this element

      26 | 
    > 27 |     elCheckbox.setChecked(true)
         |                ^
      28 |     expect(wrapper.vm.connexionForm.rememberme).toBe(true)
      29 |   })
      30 | })

галочка doc

Итак, я изменил setChecked (true) с помощью .trigger ('click'), все еще ничего. Итак, я изменил «нажмите» на «изменить», но все еще не работает ...

 FAIL  frontend/components/user/sessions/New.test.js
  Connexion
    ✓ has a el-button (4ms)
    ✕ checkbox click (10ms)
  ● Connexion › checkbox click

    expect(received).toBe(expected) // Object.is equality

    Expected: true
    Received: false

      27 |     elCheckbox.trigger('change')
    > 28 |     expect(wrapper.vm.connectionForm.rememberme).toBe(true)
         |                                                  ^
      29 |   })
      30 | })
      31 | 

Если где-то нашел это:

    elCheckbox.element.selected = true

Но ничего не меняется.

1 Ответ

0 голосов
/ 04 апреля 2019

Хорошо, я просто должен был добавить

import ElementUI from 'element-ui'
Vue.use(ElementUI)

Затем я изменил в своем тесте все «el-button» на «button», «el-checkbox» на «input» и т. Д. (Лучше сделать это с ID)

...