Публикации по теме 'vue-test-utils'


Связь компонентов Vue
Недавно я изучал Jest с помощью @ vue / test-utils и наткнулся на интересный тестовый пример. Мне нужно было утверждать, что мой компонент вызывает метод в ответ на порожденное событие дочернего компонента. Это привело меня к открытию нескольких новых (новых для меня) способов доступа к параметрам родительского и дочернего компонентов. Передать все реквизиты / данные сразу Иногда нам может потребоваться просто передать все свойства родительского компонента дочернему компоненту...

Создание быстрых и понятных наборов тестов на Vue.js
Если название этой статьи привлекло ваше внимание, я уверен, что вы, как разработчик внешнего интерфейса или полного стека, хорошо знакомы с чувством того, что вас ошеломляют все мельчайшие детали построения внешнего интерфейса. модульные тесты с помощью vue-test-utils . Либо это ощущение заставляет вас избегать написания тестов целиком, либо каждый раз, когда вы пишете новый набор тестов, вам нужно повторно запускать простейший тестовый пример 50 раз, чтобы правильно настроить..

Тестирование компонента в Vue.js
Применение TDD для разработки компонента отображения списка Контекст Мне нужно создать компонент Vue.js, который отображает серию Post объектов с определенной информацией. Это легкий и простой компонент для создания и применения TDD. Я буду использовать проект Vue 2 по умолчанию Vue-CLI и @ vue / test-utils с jest для тестирования води его. Структура пост-ресурса, согласованная с коллегой по бэкэнду: const post = { id: 1, title: "Test driving a list component..

Вопросы по теме 'vue-test-utils'

Модификация DOM в смонтированном методе, а не в моментальном снимке JEST
У меня есть компонент Vue, и внутри метода mounted у меня есть это: this.el = d3.select(this.$el); this.svg = this.el.select('svg') .attr('width', mainSvgPos.svgWidth) .attr('height', mainSvgPos.svgHeight)...
650 просмотров
schedule 18.07.2023

как издеваться над модулем i18next в шутку
Я настраиваю тестовую среду для существующего проекта Vue и решил пошутить с помощью vue-test-utils. Все установлено и на месте, однако, когда я импортирую компонент, я хочу протестировать его в файле .test.js и добавить компонент в тестовые...
3708 просмотров

Как вы устанавливаете значения данных в компоненте с помощью Vue-Test-Utils перед вызовом монтирования?
Я использую Jest с Vue-Test-Utils. Код, который я использовал, выглядит так: beforeEach(() => { wrapper = shallow(GridContainer, { data: { pageSize: count }, propsData: { userId, managerId } }) }) В...
15486 просмотров
schedule 01.06.2022

Тестирование средства навигации beforeRouteLeave в компоненте vue
В настоящее время я застрял на модульном тестировании поведения маршрутизации компонента vue с помощью jest. При выходе из компонента навигационная защита beforeRouteLeave Vue-router запускает некоторую логику. Этот охранник вызывается в моем...
1617 просмотров

Как имитировать хуки жизненного цикла с помощью vue-test-utils
Метод первый: const mixin = { beforeCreate() { // do something } } mount(TestComponent, { mixins: [mixin] }) и метод второй: const mixin = { beforeCreate() { // do something } } localVue = createLocalVue()...
5345 просмотров
schedule 02.05.2024

vue.js vuetify test-utils warning: Vue warn]: Invalid prop: type check failed for prop src. Ожидаемая строка, получен объект
Использование v-parallax vuetify с опорой для отображения URL-адреса ресурса (это рекомендуемый прием ..) <v-parallax :src="parallaxUrl()"> methods: { parallaxUrl() { return require("@/assets/images/hero.jpeg"); }, Я...
1611 просмотров

Тестирование компонентов Vue - состояние и методы имитации
Я пытался разобраться в модульном тестировании компонентов Vue, но, похоже, не совсем понимаю, как имитировать / заглушать объекты и методы хранилища, которые вызывают асинхронный API. Это пример компонента Vue, который у нас есть: import {...
2741 просмотров
schedule 31.03.2022

vue.js test-utils Почему мой макет функции onSubmit не вызывается?
Я пытаюсь протестировать событие формы отправки, используя следующий файл спецификации: ContactForm.spec.js import Vue from "vue"; import Vuex from "vuex"; import { storeMock } from "./mocks.js"; import VeeValidate from "vee-validate";...
1041 просмотров
schedule 04.12.2022

В чем разница между mount Vue-Test-Utils и shallowMount?
Отказ от ответственности: я новичок в Vue, JavaScript и веб-фреймворках в целом. Я пытаюсь ознакомиться с некоторыми базовыми модульными и компонентными тестами с использованием Jest и vue-test-utils. Я прочитал документы по vue-test-utils '...
7265 просмотров
schedule 21.06.2023

Как проверить значение компонента vue.js v-select
У меня есть настройка формы с использованием vue.js и v-select для раскрывающегося списка валют. Я пытаюсь создать модульный тест, чтобы убедиться, что текущее значение v-select установлено на вычисленное значение price_currency Вот код vue...
1458 просмотров

Модульное тестирование Vue.js ErrorBoundary
Я создал простой компонент ErrorBoundary для своего проекта на Vue.js, и я изо всех сил пытаюсь написать для него модульный тест. Код компонента ниже: <template> <div class="overvue-error-boundary"> <slot v-if="!error" />...
318 просмотров

Подавить предупреждения Vue в модульных тестах
Я пытаюсь подавить свои предупреждения в своих тестах, следуя конфигурации, указанной здесь: https://vue-test-utils.vuejs.org/api/config.html#silent , который выглядит следующим образом: import { config } from '@vue/test-utils'; // this should...
3612 просмотров
schedule 22.06.2023

Как протестировать мутации Vuex с помощью Vue-test-utils и Jest
Я проверил по крайней мере пару из учебные пособия по имитации и тестированию действий Vuex, но я не смог успешно реализовать их самостоятельно. Это всегда приводило к переходу от toHaveBeenCalled к false , хотя я выполнил большинство шагов,...
1036 просмотров

Как вызвать измененное событие с помощью тестовых утилит vue?
Я новичок в vue, и я создал router-link с VueRouter для перехода на определенную страницу. <router-link @click.native="onRouteClicked(index)" /> Теперь мне нужно поиздеваться над этой click.native функцией. Я знаю, что есть...
419 просмотров
schedule 26.07.2022

Почему VueX сохраняет состояние в нескольких модульных тестах?
Я пишу модульные тесты для модуля разбивки на страницы, и у него есть простой модуль хранилища VueX. Для тестов я использую Vue.js 2.5 и Mocha / Chai / Sinon. Настройка выполняется с помощью Vue CLI 3. Проблема в том, что когда currentPage...
267 просмотров

Не удается найти v-btn при неглубокой установке компонента
Я создал проект в vuetify и теперь пытаюсь протестировать его с помощью jest. У меня есть кнопка, которую я создал с помощью v-btn, которая переключает значение логической переменной. Чтобы проверить, была ли нажата кнопка, я попытался удержать...
1404 просмотров

Как добавить Vue Test Utils с Jest к уже существующему проекту Vue-CLI 3?
Я хочу протестировать уже существующий проект Vue-CLI 3. Я не инициализировал предустановку тестирования при создании проекта. Я искал, но не нашел подходящих результатов. Я тоже читал документацию, но там сказано добавить тестирование при создании...
6885 просмотров

Получение [Vue warn]: неизвестный пользовательский элемент: ‹b-modal›, хотя bootstrap-vue зарегистрирован
B-модальный компонент BootstrapVue в настраиваемом компоненте Vue правильно загружается в браузере. Однако при тестировании с использованием mocha + mochapack он генерирует предупреждение Vue о том, что b-модальный элемент не зарегистрирован. В...
1897 просмотров

Jest-тестирование однофайловых компонентов Vue с импортом плагина Ionic Capacitor
GitHub repo с описанием проблемы. Я создаю приложение Ionic, используя Vue и Capacitor. Я настраиваю модульные тесты с помощью vue-test-utils + Jest. Модульные тесты Jest не могут импортировать плагины Capacitor в однофайловые компоненты Vue....
446 просмотров

тестовый компонент vuejs со свойствами внутри родительского элемента
Я тестирую пользовательский компонент с помощью vue test utils и Jest. Мой компонент использует компонент Vuetify, поэтому мне нужно объявить div с атрибутом data-app , чтобы отобразить меню (если я этого не сделаю, я получаю следующую ошибку:...
650 просмотров
schedule 22.05.2022