shallowMount один уровень глубоко - PullRequest
Новая
       8

shallowMount один уровень глубоко

0 голосов
/ 24 августа 2018

В настоящее время я работаю над проектом Vue.Js, где у нас есть много модальных компонентов, написанных так: 

<template>
    <div class="root">
        <MyModal width="650px" height="300px" :hasShadow="false">
          ... some logic that needs to be tested.
        </MyModal>
    </div>
</template>
<script> ... </script>
<style scoped> ... </style>

По сути, HTML-логика, которую я хочу проверить , имеет глубину в один уровень, что означает, что я не могу использовать vue-test-util shallowMount. Было бы просто заглушить компонент MyModal.

Есть ли способ, с помощью которого я могу просто получить простой HTML самого файла vue? Я подумываю разобрать только раздел <MyModal>...</MyModal> и протестировать его следующим образом: 

let myModalHtmlString = getHtmlString(myComponent);            
component = shallowMount(myComponent, {
    propsData: myPropsData,
    store: myStore,
    template: myModalHtmlString
});

По сути, я ищу, как getHtmlString() выше будет работать.

1 Ответ

0 голосов
/ 31 августа 2018

Если вы проверяете документацию vue-test-utils, вы можете прочитать, что shallowMount заглушает дочерние компоненты, а mount - нет, поэтому вы можете использовать его.В любом случае, я должен задать вам вопрос: - почему вы создаете компонент только для корневого элемента div и другого компонента, действительно ли этот элемент div необходим?- если поведение, которое вы хотите проверить, относится не к родительскому компоненту, а скорее к компоненту MyModal, вам следует проверить его разметку в тесте, а не в родительском компоненте.

...