как получить доступ к div внутри реквизита, например, аватару, действиям cardheader (потомка элемента карты из materialUI) div, используя шут и энзим - PullRequest
0 голосов
/ 13 мая 2019

Я пытаюсь написать контрольные примеры для класса реагирования js с использованием каркасов Jest и Enzyme. Мой класс реагирования использует класс Card в пользовательском интерфейсе материала.Часть моего кода выглядит следующим образом.

<Card>
     <CardHeader
        avatar = {<div className={classes.imgHolder}><img src='/opt/imgs.png'/></div>} 
        actions = {<div/>}
        title = {<div/>}
      />
</Card>

Часть моего тестового кода выглядит следующим образом.

let  wrapper=shallow(<PlainHeader {...props}/>).dive();
let header_ = wrapper.find('WithStyles(CardHeader)'

Итак, мой вопрос здесь, как мне получить доступ к div внутри аватара prop илипроверить, существует ли в аватаре узел, используя какие-либо ферментные методы, такие как find ?wrapper.find('WithStyles(CardHeader)').props().avatar.prop('img') не сработало.

Я не нахожу в сети ссылок на этот вопрос.

Просматривал много ссылок и пробовал многие функции энзима airbnb, но это дает ошибки.

1 Ответ

0 голосов
/ 16 мая 2019

Если вы тестируете компонент, который отображает CardHeader, я бы только проверял в тех тестах, что компонент передает правильные реквизиты на CardHeader, а не на то, что CardHeader действительно их рендерит (я бы протестировал это втесты для CardHeader).

Итак, тест для проверки того, что CardHeader действительно получает нужные реквизиты, будет выглядеть так:

const  wrapper = shallow(<PlainHeader {...props} />);
expect(wrapper.find(CardHeader).props().avatar).toEqual(<div><img src='/opt/imgs.png'/></div>)
...