Как проверить функциональные компоненты в шутке мелкой не работает

Question

Я пытаюсь протестировать компонент cartSummary моего собственного собственного реагирующего приложения

Мой компонент является функцией:

export function CartSummary ({ value }) {
  const { data, rewards } = value
  const { locale } = rewards

  const isUk = /en-uk/gi.test(locale)

  const filteredList = Object.keys(cartLineItems).filter((item) => {
    return (
      (data[item] || rewards[item]) &&
      !(isUk && /cashback/gi.test(item)) &&
      !(!isUk && /points/gi.test(item))
    )
  })

  const lastItemIndex = filteredList.length - 1

  return filteredList.map((item, index) => {
    return (
      <LineItem
        key={item}
        title={cartLineItems[item]}
        value={data[item] || rewards[item]}
        isBold={index === lastItemIndex}
      />
    )
  })
}

CartSummary.propTypes = {
  // @todo set propsTypes for value
  value: PropTypes.shape({
    data: PropTypes.shape({
      localeSubTotal: PropTypes.string,
      localeTotal: PropTypes.string,
      localeTotalShipping: PropTypes.string,
      localeTotalTax: PropTypes.string,
      shipPromoDiscTotal: PropTypes.string,
    }),
    rewards: PropTypes.shape({
      cashbackEarned: PropTypes.string,
      cashbackAvailable: PropTypes.string,
      cashbackApplied: PropTypes.string,
      cashbackServiceUp: PropTypes.bool,
      pointsEarned: PropTypes.string,
      pointsAvailable: PropTypes.string,
      pointsServiceUp: PropTypes.bool,
      bvEarned: PropTypes.string,
      ibvEarned: PropTypes.string,
    }),
  }),
}

CartSummary.defaultProps = {
  value: {
    data: {
      localeSubTotal: '',
      localeTotal: '',
      localeTotalShipping: '',
      localeTotalTax: '',
      shipPromoDiscTotal: '',
    },
    rewards: {
      cashbackEarned: '0',
      cashbackAvailable: '0',
      cashbackApplied: '0',
      cashbackServiceUp: false,
      pointsEarned: '0',
      pointsAvailable: '0',
      pointsServiceUp: false,
      bvEarned: '0',
      ibvEarned: '0',
    },
  },
}

Я пытаюсь протестировать его с помощью мелкого рендеринга и не удается: test suite:

import React from 'react'

import CartSummary from '../../../../app/screens/Cart/components'


describe('CartSummary', () => {
  const value = {
    data: {
      locale: 'en-US',
      localeSubTotal: '10.00',
      localeTotal: '12.50',
      localeTotalShipping: '2.00',
      localeTotalTax: '0.50',
      shipPromoDiscTotal: '0.00',
    },
    rewards: {
      cashbackEarned: 10.0,
      cashbackAvailable: 100.0,
      cashbackApplied: 5.0,
      cashbackServiceUp: true,
      pointsEarned: 90.0,
      pointsAvailable: 1000.0,
      pointsServiceUp: true,
      bvEarned: 200.0,
      ibvEarned: 300.0,
    },
    stores: [],
  }


  test('Cart Summary exists', () => {
    const cartSummary = (
      <CartSummary
        value={value}
      />
    )
    expect(shallow(cartSummary).jsx()).toBeFalsy()
  })
})

Это дает мне сообщение об ошибке TypeError: Невозможно прочитать свойство 'prototype' с неопределенным чем-то вроде:

35 |       />
      36 |     )
    > 37 |     expect(shallow(cartSummary).jsx()).toBeFalsy()
         |            ^
      38 |   })

Я понимаю, что это происходит, потому что компоненты функциинет метода рендерингаНо как заставить это работать без изменения исходного кода?