Как выполнить модульное тестирование компонента VUE, в котором есть ввод / ввод?

Question

Я пишу какой-то модульный тест, но у меня возникли проблемы с компонентом, который имеет inject имущество.

я использую shallowMount, Я провел некоторое исследование по этому поводу. И есть способ создать поддельные данные для provide https://vue-test-utils.vuejs.org/api/options.html. Но я не видел никакой информации или намеков на inject,

Итак, мне нужно несколько советов о том, как сделать модульное тестирование с inject в Вуэйс?

Answer 1

То, что вы устанавливаете в свойстве обеспечить, это то, что используется для внедрения в смонтированный компонент.

В моем модульном тесте у меня есть

metadataModule = sandbox.createStubInstance(MetadataModule);
metadataService = sandbox.createStubInstance(MetadataService);

wrapper = shallowMount(MoveFileElement, {
        provide: {
            [SYMBOLS.METADATAMODULE]: metadataModule,
            [SYMBOLS.METADATASERVICE]: metadataService,
        },
        ....

Тогда в моем компоненте у меня есть

export default class MoveFileElement extends Mixins(Utilities) {       
    @Inject(SYMBOLS.METADATAMODULE) public metadataModule!: IMetadataModule;
    @Inject(SYMBOLS.METADATASERVICE) public metadataService!: MetadataService;

Теперь компонент имеет доступ к поддельным версиям модуля метаданных, который я подготовил в модульном тесте.