Вопросы и ответы - jestjs
async-await asynchronous axios babel-jest babeljs bootstrap-vue events frontend google-analytics html javascript jestjs jsdom mocking nuxt.js quasar quasar-framework reactjs tdd testing typescript unit-testing vue-component vue-composition-api vue-router vue-test-utils vue.js vuejs2 vuejs3 vuetify.js vuex
Есть ответ!
Я пытаюсь проверить свой вызов API.
Я использую:
VueJS
Шутка
Аксиос
Я получил ошибку: "_axios. default.post.mockImplementationOnce не является функцией" , когда я запускаю этот тест:
import axios from 'axios'
let url = ''
let body = {}
jest.mock("axios", () => ({
//__esModule: true,
post: (_url, _body) => {
return new Promise((resolve) => {
url = _url
bo...
Есть ответ!
Я тестирую Vue.js 2 компонент с использованием vue-test-utils и jest. Этот компонент автоматически устанавливает фокус на определенный элемент. JSDom должен указывать на этот элемент в переменной document.activeElement, но даже если я установлю фокус вручную внутри теста с помощью wrapper.find(...).element.focus(), он всегда будет указывать только на элемент body.
it('focuses the default option au...
Есть ответ!
У меня есть компонент, который выглядит вот так. Как бы я написал тест Vue jest, чтобы удовлетворить этим условиям?
<template>
<div align="center">
<button @click="Tests()">Tests</button>
<button @click="Benchmark()">Benchmark</button>
</div>
</template>
<script>
export default {
name: "HelloWor...
Есть ответ!
Я пытаюсь модульно протестировать геттер и получаю ошибку Expected 4 arguments, but got 1. при попытке использовать указанный геттер. Я использовал quasar для создания приложения, и я использую typescript.
HttpMocks.mockToken - это просто общая строка JWT
const getters: GetterTree<AuthenticationStateInterface, StateInterface> = {
token(state: AuthenticationStateInterface) {
return stat...
Есть ответ!
Мой пример компонента показывает счетчик (изначально "0") и кнопку "увеличить". Выглядит это примерно так:
<div ref="label">{{ counter }}</div>
<div
ref="button"
@click="counter++"
>
Click me
</div>
Если я проверить нажать поведения с шуткой, следующий тест будет провален
it('increases the counter when t...
Есть ответ!
Я тестирую метод компонента Vue, который выполняет базовый fetch и обновляет значение данных в блоке .finally() этого fetch. Я могу подтвердить, что мой тест достигает этого блока .finally(), но значение данных никогда не обновляется.
Мой метод таков:
updateProfile () {
fetch(updateProfileEndPoint, {
method: 'POST',
body: {email: test@test.com, id: 1234, name: 'bob},
})
.ca...
Есть ответ!
Я пытаюсь вызвать метод close() в моем компоненте Test, но он срабатывает только при щелчке за пределами div, на котором включена директива. Что я должен сделать в своем тесте, чтобы убедиться, что этот метод будет уволен? Я использую пакет npm v-click-outside в своем компоненте.
Компонент
<script>
import vClickOutside from 'v-click-outside';
export default {
name: 'Test',
dire...
Есть ответ!
Я использую модуль узла под названием headroom для одного из моих компонентов vue. Я пытаюсь издеваться над библиотекой и написать тест, но получаю this.$refs.headroom._setHeightOffset is not a function, похоже, функция в $ref не определена.
Компонент Vue
<script>
import { headroom } from 'vue-headroom';
name: 'Test',
components: {
headroom
},
mounted() {
this.$refs...
Есть ответ!
Я новичок в Jest и пытаюсь написать тест для своего приложения Vue, который подтвердил бы, что дочерний компонент испускает событие, и в результате его значение prop обновляется.
В качестве примера я сделал простое приложение со счетчиком для демонстрации:
/* Parent Home.vue */
<template>
<Counter :count="count" @increment="count++"/>
</template>
<script...
Есть ответ!
я использую кодовую базу, созданную с помощью Vue3 Vite, но не могу найти способ запустить простой тест Jest, импортирующий компонент.
Это прекрасно работает в приложении create с Vue-cli, но я не могу найти способ заставить Jest работать в приложении Vue-Vite с Vue3.
Вот с какой ошибкой я сталкиваюсь
FAIL docs/homepage.spec.js
● Test suite failed to run
Vue packages version mismatch:
...
Есть ответ!
Я пытаюсь протестировать компонент с помощью @vue-jest в Nuxt. Он запускает suit и сообщает мне, пройден ли тест или нет, но в конце отчета с помощью "npm run test" у меня появляется ошибка:
Есть ответ!
Шаблон моего компонента содержит следующий элемент:
<v-text-field v-model="user.first_name" />
В моем магазине vuex я объявляю состояние
state: {
user: { first_name: '' }
}
и добытчик
getUserInfo(state) {
return state.user;
}
Мой компонент на created() делает следующее:
this.user = { ...this.$store.getters.getUserInfo };
this. user объявляется следующим образом:
private use...
Есть ответ!
Я пробую vue3 composition api, и у меня возникли некоторые проблемы с написанием тестов для него.
Я написал новый компонент (MyComponent) в своем приложении, используя composition api. MyComponent использует другой компонент, написанный с помощью Options api (Myother Component).
Все работает нормально, если я запускаю приложение, но когда я пишу модульный тест (используя Jest), у меня начинаются п...
Вью шутку проверить текущую цель родителя есть класс, когда кнопку (которая добавляется через V-для)
Есть ответ!
Я пытаюсь протестировать выбранный элемент в списке элементов, который обрабатывается в событии щелчка, находя выбранный класс, добавленный к нему.
Мой шаблон:
<div class="mycomp" v-for="(list, i) in listItem" :key="list.id" :class="{ selected: i === selectedlist}">
<button class="md-primary md-raised selectOption" v-if="i !== selec...
Есть ответ!
Поэтому после того, как setMethods устарел в Vue-test-utils, я меняю свои тесты на использование jest.spyOn. Я просто хочу выдать событие из дочернего компонента и проверить, что соответствующий метод был вызван на родительском, но почему-то мой метод никогда не вызывается.
it('calls promptPasswordReset method when forgotten-password event is emitted from LoginForm', () => {
const wrapper =...
Есть ответ!
Я пытаюсь проверить следующую опору в vue.js с шуткой:
export default {
name: 'my-component',
props: {
onConfirm: {
type: Function,
default: () => {}
},
}
}
Джест продолжает говорить мне, что мне нужно покрыть значение по умолчанию опоры onConfirm, но я понятия не имею, как это сделать.
Я попробовал следующее:
expect(wrapper.vm.onConfirm).toBe(() => {})
expect(wrap...
Есть ответ!
Во-первых, я хотел бы объяснить, что у меня есть репозиторий компонентов Vue, который отвечает за отображение данных, полученных из службы http. Вместо того чтобы сам компонент управлял одним и тем же извлечением данных для каждого экземпляра и рассылал клиенту спам с сетевыми запросами, мне удалось найти решение, которое позволяет другому компоненту монтироваться непосредственно в корневой катало...
Есть ответ!
<ul>
<router-link to="/" tag="li" active-class="active" exact><a >Home</a></router-link>
<router-link to="/contact" tag="li" exact><a>contact</a></router-link>
<router-link to="/other" tag="li" exact><a>other</a></router-link>
<ul/>
Test.s...
Есть ответ!
Я хочу издеваться над сервисом Amplify Auth в своем тесте. Ошибки нет, но тест не работает из-за моего макета.
Вот код, который я собираюсь протестировать:
signIn(): void {
if (!this.valid) return;
this.loading = 1;
this.$Auth
.signIn(this.email, this.password)
.then(() => this.$router.push({ name: "homeManagement" }))
.catch((err: any) => (this.erro...
Есть ответ!
У меня возникли проблемы с использованием jest manual mocks (тот, что находится в параллельном каталоге __mocks__) в моем проекте.
Я думаю, что понимаю, как его использовать, и он действительно отлично работает, если я удаляю одну строку в файле, указанном в массиве Jest setupFiles.
В этом файле устанавливается глобальный помощник (в global.createComp), который использует хранилище vuex.
Это проек...