Получение значения текста от React Element child в энзиме

Question

У меня есть следующий компонент как часть моего большого компонента.

<UI.Field
   horizontal
     value={
       <FormattedNumber
         style="currency"
         currency="EUR"
         data-service-fee
         value={booking.service_fee_cents || 8000 / 100}
       />
       }
      label={`${base}service_fee`}
      />

Я пишу тесты для компонента.

it('renders default value if service fee is null', () => {
      wrapper.setProps({
        booking: {
          ...make(booking),
          service_fee_cents: null,
        },
      })
      expect(wrapper.find('[data-service-fee]').text()).toBe('€80.00')
    })

То, что я пытаюсь сделать, эточтобы получить значение внутри поля с именем data-service-fee.Но wrapper.find('[data-service-fee]') всегда возвращает ноль.

Когда я пытался wrapper.find('[label*="service_fee"]').text() вернуть сам компонент вместо текста?

Что я делаю не так?

Answer 1

Вы можете получить реквизит компонента, используя метод prop на ShallowWrapper.

Любой атрибут элемента DOM также можно получить с помощью prop.

* 1008.* wrapper.prop ('data-service-fee') должен дать вам значение.

Ссылка - ShallowWrapper.prop ()