исправление ошибки тестирования ответной листовки: не удалось прочитать свойство '_layerAdd' из null - PullRequest
Новая
       15

исправление ошибки тестирования ответной листовки: не удалось прочитать свойство '_layerAdd' из null

0 голосов
/ 26 января 2019

У меня возникли некоторые проблемы с базовыми тестами рендеринга из create-Reaction-app и компонентом Polyline из Reaction-leaflet. Всякий раз, когда я пытаюсь добавить Polyline как ребенка к своему Map, я получаю сообщение об ошибке теста: TypeError: Cannot read property '_layerAdd' of null. И карта, и полилиния все еще хорошо отображаются в браузере, но эта ошибка теста становится немного раздражающей.

Кто-нибудь сталкивался с такой же проблемой? Если так, как вы решили это?

Я видел несколько похожих вопросов, но пока не получил реального ответа при использовании ответной листовки. Я пытался привязать рендеринг карты к componentDidMount, но без удачи.

Вот мой рендер для моей карты: 

render() {
    return (
      <Map
        animate={this.state.animate}
        center={this.state.latlng}
        length={4}
        onClick={this.handleClick}
        zoom={13}
      >
        <TileLayer
          attribution='&amp;copy <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
          url="https://{s}.tile.openstreetmap.se/hydda/full/{z}/{x}/{y}.png"
        />
        <Marker position={pathPoints[0]} />
        <Marker position={pathPoints[pathPoints.length - 1]} />
        <Polyline color="red" positions={pathPoints} />
      </Map>
    );
  }
}

Спасибо!

1 Ответ

0 голосов
/ 27 января 2019

На самом деле, это не имеет ничего общего с библиотекой react-leaflet.Брошюра Polyline использует SVG визуализатор (по умолчанию), но JSDOM , который поставляется с Jest для запуска приложения Create React,не поддерживает SVG в полной мере (в частности createSVGRect не поддерживается ).Это в основном причина, по которой возникает указанная ошибка.

Как настроить Create React App для прохождения тестов?

Это скорее нужно рассматривать как обходной путь, но идеядолжен расширить JSDOM SVGSVGElement, введя createSVGRect как пустую функцию.Этот метод позволит эмулировать поддержку SVG в JSDOM, чтобы пройти тесты Jest для векторных оверлеев , таких как Polygon

В каталоге src, создать файл с именем setupTests.js и предоставить следующеекод: 

var createElementNSOrig = global.document.createElementNS
global.document.createElementNS = function(namespaceURI, qualifiedName) {
  if (namespaceURI==='http://www.w3.org/2000/svg' && qualifiedName==='svg'){
    var element = createElementNSOrig.apply(this,arguments)
    element.createSVGRect = function(){}; 
    return element;
  }
  return createElementNSOrig.apply(this,arguments)
}
...