5 минут на исправление шутливых тестов для приложения с: Неизвестным настраиваемым элементом: - Вы правильно зарегистрировали компонент?
Вы получаете следующую ошибку?
Решения
1. Вам не хватает пакетов?
- Проверьте свой пакет node_modules и установите отсутствующие пакеты / компоненты модулей. Или переустановите ваши node_modules через `npm install`.
Ссылка:
2. Правильно ли вы закрываете свои шутливые тесты?
Если вы пишете модульные тесты и хотите проверить функциональность компонента по отдельности, настройте функцию shallowMount и протестируйте ее. Заглушка внутри юнит-тестов jest.
Разница между shallowMount и mount
mount
:
Метод монтирования принимает компонент Vue в качестве первого аргумента и возвращает его экземпляр vue вместе с некоторым помощником, который используется для взаимодействия с экземпляром компонента, такого как установка реквизитов, триггерные клики и т. Д.
shallowMount
:
Метод shallowMount также работает аналогично методу монтирования, основное отличие состоит в том, что shallowMount не отображает дочерние компоненты, поэтому он позволяет нам тестировать компонент изолированно, чтобы убедиться, что дочерние компоненты не включены в тест.
Если вы хотите протестировать вложенный компонент, используйте функцию монтирования.
Я бы рекомендовал использовать функцию shallowMount, поскольку она предназначена для модульного тестирования компонента.
В моем случае мне пришлось заглушить свои прекрасные шрифты значки из @nuxtjs/fontawesome-module
import { shallowMount } from '@vue/test-utils' import Index from '@/pages/index.vue' import { fas } from '@fortawesome/free-solid-svg-icons' describe('index.vue', () => {
test('is a Vue instance', () => { const wrapper = shallowMount(Index, { stubs: ['fa'], // <<<<<STUB HERE>>>>> components: {}, computed: { faPhone() { return fas.faPhone } } }) expect(wrapper).toBeTruthy() }) })
3. Правильно ли вы игнорируете node_modules?
В большинстве случаев вам потребуется следующая строка внутри вашего jest.config.js, вам просто нужно игнорировать компонентный модуль, когда вы запускаете свои тесты. В противном случае он также запускал бы тесты внутри ваших node_modules.
//jest.config.js
transformIgnorePatterns: [
'/node_modules/'
'/node_modules/(?!<SOME PACKAGE HERE>)',
],
- Https://stackoverflow.com/questions/51127176/unexpected-token-import-error- while-running-jest-tests
Подводить итоги
- Установите отсутствующие пакеты или переустановите node_modules
- mount / shallow - монтируйте и вставляйте компоненты при необходимости или при использовании внешних модулей.
- Игнорируйте node_modules из вашего jest.config.js
Ваше здоровье! Надеюсь, вы нашли эту статью полезной! 🍻
Теги: # решение #nuxtjs #vuejs #javascript #typescript # разработка