Задать вопрос
sni10
@sni10
FS Dev

Почему может не отрабатывать один из двух и более идентичных тестов одного компонента VUE?

Прошу у уважаемой аудитории помощь в освоении тестирования VUE. А точнее в первом знакомстве с тестированием компонента.

В сьюте реализована простая фабрика для клепания инстансов приложения через mount(). Если я правильно понял, в каждом it() мы должны получать независимые обьекты (инстансы)?

Пытаюсь проверить отработку дома после работы vuelidate. Который в доме вызывается через онклик в компоненте.
В тестах достаточно логично отрабатывает, как и запланировано ( триггер.клик, присвоение значений, отработка валидации ). Но не могу обновить ДОМ во втором ( и всех последующих тестах в наборе и за его границами ) после триггера. Первый тест терпеливо дожидается await NextTick() и валидатор классы накидывает на инпут. И все красиво и как надо.

Подскажите пожалуйста. Почему я не могу повторить эту же операцию во втором таком же тесте? ЧЯДНТ?
Использую связку VUE + JEST.

describe("Validate login form", () => {

  const errors = ['error--text'];

  const factory = (values = {}) => {
    return mount(Login, {
      types, r,  i18n,  store,
      data () {
        return {
          ...values
        }
      }
    })
  };
  
  it("11111111111", async () => {

    const wrapper = factory({ email: "" });

    wrapper.find(".v-btn--block").trigger("click");

    await wrapper.vm.$nextTick();
    
    // expect( wrapper.vm.$v.email.$error ).toBe(true); // валидатор отрабатывает отлично
    
    // DOM обновляется, длинна контента ~4500 знаков, классы ошибок error--text есть 
    expect ( wrapper.find("label[for='email']").classes() ).toEqual(expect.arrayContaining(errors)); // true

  });

  it("222222222222", async () => {

    const wrapper = factory({ email: "" });

    wrapper.find(".v-btn--block").trigger("click");

    await wrapper.vm.$nextTick();

    // expect( wrapper.vm.$v.email.$error ).toBe(true); // валидатор отрабатывает отлично

    // DOM НЕ обновляется, длинна контента  ~3000 знаков, классов ошибок error--text нет
    expect ( wrapper.find("label[for='email']").classes() ).toEqual(expect.arrayContaining(errors)); // false

  });

});

PS Любителей мануалов я с радостью приглашаю в офф. Документацию Jest. Давайте вместе оценим описание вероятной проблемы:
Если у вас есть тест, который часто падает при выполнении внутри набора тестов, но не падает будучи запущенным водиночку, значит, что-то из другого теста мешает текущему.
Спасибо, Кэп.
  • Вопрос задан
  • 89 просмотров
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы