Как получить элемент компонента зависимостей от Enzyme?

Question

Я создаю компонент React (UserAutocomplete), основываясь на моем компоненте AutoComplete.

Где мой AutoComplete компонент:

render(
    <input type='text' class='autocomplete'/> 
); 

И мой UserAutoComplete является:

import Autocomplete from './autocomplete'; 

render(
    <Autocomplete {...this.props} /> 
); 

И создать тест с Enzyme + Jest, но когда я получаю input с find функцией, возвращается null.

it('test defaultValue prop',() => { 
    const wrapper = shallow(
     <UserAutocomplete/> 
    ); 

    console.log(wrapper.find('input')); // returning null 
}); 

Как я могу получить этот вход, если он находится в дочернем компоненте?

Answer 1

shallow рендеринг не оказывает более одного уровня вниз (следовательно, неглубокий). Таким образом, вместо input, вы можете выполнить поиск AutoComplete компонента:

it('test defaultValue prop',() => { 
    const wrapper = shallow(
     <UserAutocomplete/> 
    ); 

    console.log(wrapper.find('AutoComplete')); // returning null 
}); 

Если вы хотите сделать, чтобы более глубоко, вы должны использовать вместо mount.