Поверхностный рендерер

Импорт

import ShallowRenderer from 'react-test-renderer/shallow'; // ES6
var ShallowRenderer = require('react-test-renderer/shallow'); // ES5 с npm

Обзор

Поверхностный рендеринг может быть полезным при модульном тестировании компонентов React. Он позволяет отрендерить компонент «на один уровень глубины», а затем проверить утверждения о том, что возвращает метод рендеринга. В этом случае вам не нужно волноваться о поведении дочерних компонентов, потому что они не инстанциируются и не рендерятся. Этот процесс не требует DOM.

Возьмём к примеру, следующий компонент:

function MyComponent() {
  return (
    <div>
      <span className="heading">Заглавие</span>
      <Subcomponent foo="bar" />
    </div>
  );
}

Тогда вы можете утверждать:

import ShallowRenderer from 'react-test-renderer/shallow';

// в вашем тесте:
const renderer = new ShallowRenderer();
renderer.render(<MyComponent />);
const result = renderer.getRenderOutput();

expect(result.type).toBe('div');
expect(result.props.children).toEqual([
  <span className="heading">Заглавие</span>,
  <Subcomponent foo="bar" />
]);

Поверхностное тестирование в настоящее время имеет некоторые ограничения — оно не поддерживает рефы.

Замечание:

Мы также советуем посмотреть API поверхностного рендеринга Enzyme Shallow Rendering API. Он предоставляет более удобный API высокого уровня для достижения той же функциональности.

Справка

shallowRenderer.render()

Вы можете думать о shallowRenderer как о «месте» в которое рендерится тестируемый компонент, и из которого вы можете извлечь результат вывода этого компонента.

shallowRenderer.render() схож с root.render(), но не требует DOM и рендерит всего один уровень глубины. Это означает что вы можете тестировать компоненты независимо от того, как реализованы их дочерние компоненты.

shallowRenderer.getRenderOutput()

После того как был вызван shallowRenderer.render(), вы можете извлечь поверхностно отрисованный результат с помощью shallowRenderer.getRenderOutput().

После этого можно начинать проверку утверждений о выводе.