Избегайте добавления множества шаблонов для тестов реагирующих снимков - PullRequest
0 голосов
/ 05 мая 2020

У меня есть много тестов снимков, которые выглядят следующим образом:

it('Mapping renders correctly with AssetIcon', () => {
  const div = document.createElement('div')
  document.body.appendChild(div)

  // Using enzyme's 'mount' to solve issues with Leaflet requiring access to the DOM and other features not
  // provided by react.render.
  const tree = mount(<Mapping
    tileDiameterMins = {5}
    bounds = {bounds}
    tileLayer = {LocalTileLayer}
    forces = {[{}]}
    platforms = {[{}]}
    playerForce = 'blue'
    phase = {Phase.Planning}
  ><AssetIcon id='id1' name="Jeffrey" position={L.latLng(13.298034302, 43.0488191271)}
      selected={false} type='agi' force='blue'
      tooltip='Tooltip for marker'/></Mapping>, { attachTo: div })

  expect(tree).toMatchSnapshot()
})

Однако единственная часть, которая меня волнует в каждом тесте, - это дочерний компонент (в данном случае AssetIcon), к сожалению, хотя мы используем Leaflet для рендеринга компонента Mapping, а AssetIcon должен быть отрисован внутри компонента Mapping, чтобы он работал. Но есть ли способ поиздеваться над этим компонентом? Так что я мог бы просто сделать что-то вроде:

it('Mapping renders correctly with AssetIcon', () => {
  const div = document.createElement('div')
  document.body.appendChild(div)

  // Using enzyme's 'mount' to solve issues with Leaflet requiring access to the DOM and other features not
  // provided by react.render.
  const tree = mount(<MockedMap><AssetIcon id='id1' name="Jeffrey" position={L.latLng(13.298034302, 43.0488191271)}
      selected={false} type='agi' force='blue'
      tooltip='Tooltip for marker'/></MockedMap>, { attachTo: div })

  expect(tree).toMatchSnapshot()
})

Таким образом, по крайней мере, мне не нужно заботиться обо всех пропсах, которые я передаю каждый раз, когда я хочу протестировать подкомпонент Mapping.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...