Как проверить текст внутри стилизованного компонента в реакции native с использованием Jest + энзим

Question

У меня есть пользовательский текстовый компонент, стилизованный с использованием стилизованных компонентов.

<P compact name="addNewTitle" small helper>
                      {addNew
                        ? 'Fill in the address details'
                        : 'Tap here to add a new address'}
                    </P>

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

test('for the title if add new prop is false', () => {
     wrapper = shallow(<Address {...props} />)
     const value = wrapper.find('[name="addNewTitle"]')
     expect(value.length).toBe(1)
     expect(value.text())).toEqual('Tap here to add a new address')
    })

Ноtest выдает ошибку вроде этой

 expect(received).toEqual(expected)

    Expected value to equal:
      "Tap here to add a new address"
    Received:
      "<Styled(_default) />"

Как мне преодолеть эту проблему и что не так в моем коде.Спасибо

Answer 1

Согласно официальной документации

text (): Возвращает строку отображаемого текста текущего дерева рендеринга.Эту функцию следует рассматривать со скептицизмом, если она используется для проверки того, каким будет фактический HTML-вывод компонента.Если это то, что вы хотели бы протестировать, используйте вместо этого функцию рендера энзима.

В вашем случае вам следует попробовать обходной путь , предложенный разработчиком Enzyme expect(wrapper.find('[name="addNewTitle"]').render().text()).toEqual('Tap here to add a new address')