如何通過酶單元測試找到元素？

Question

我有一個單元測試，它使用包含有效的函數。 是否可以從集合中選擇一個節點然后獲取 text 屬性？ 我試過這個：

it('should be equaling name property', () => {
        const props = {
            myprops: [{
                email: "blaat@mail.com",
                name: "Coco Chanel"
            }]
        };
        const wrapper = shallow(<ServiceDetails {...props} />);
        expect(wrapper.find('div')[0].text).equals('Cici Chanel');
 });

這是我的 reactjs 組件的一部分：

  return (
          <section>
                <div>{email}</div>
                <div>{name}</div>
          </section>
  )

但是我收到此錯誤：

 TypeError: Cannot read property 'text' of undefined

如何選擇第二個 div 並獲取該 div 中的值？

Answer 1

我相信您需要唯一標識 div：

expect(wrapper.find('section div:nth-of-type(1)').text()).equals('Cici Chanel');

或者更好：

return (
      <section>
            <div className="div1">{email}</div>
            <div>{name}</div>
      </section>
)

expect(wrapper.find('.div1').text()).equals('Cici Chanel');

同樣text是 function ，而不是 property 。

Answer 2

對我來說，以下代碼有效

const component = wrappper.find('section.div')
expect(component.at(0).text()).toEqual('Cici chanel')