Тестирование React-компонентов

263
19 февраля 2018, 04:16

Здравствуйте! Есть компонент , подключенный через connect() к Redux-хранилищу. Он имеет такой вид (упрощённый):

export class App extends Component {
  render() {
    const { isAuthenticated } = this.props;
    return (
      <div>
        { isAuthenticated && <TopNavigation /> }
        <Route path='/' component={HomePage} />
      </div>
    );
  }
}
export default connect(mapStateToProps)(App);

Скажите пожалуйста, как протестировать строку:

{ isAuthenticated && <TopNavigation /> }

Ниже привожу пример теста, но первый describe не проходит, а во втором я не знаю, как протестировать содержимое компонента.

import React from 'react';
import { shallow } from 'enzyme';
import configureStore from 'redux-mock-store';
import ConnactedApp, { App } from './App';
const mockStore = configureStore();
const location = {
  pathname: '/',
};
describe('stupid App component', () => {
  let wrapper;
  beforeEach(() => {
    wrapper = shallow(<App location={location} isAuthenticated={true} />);
  })
  // Вот здесь возникает ошибка!!!!!
  it('should render TopNavigation', () => {
    expect(wrapper.find('TopNavigation').length).toBe(1);
  })
});
describe('App component with redux store', () => {
  const initialState = {
    user: {
      email: 'email@email.com',
    }
  };
  let wrapper, store;
  beforeEach(() => {
    store = mockStore(initialState);
    wrapper = shallow(
      <ConnactedApp store={store} location={location} />
    );
  });
  it('is rendered normally', () => {
    expect(wrapper.find(App).length).toBe(1);
  });
  it('should get location prop', () => {
    expect(wrapper.prop('location')).toEqual(location);
  });
  it('should get isAuthenticated prop', () => {
    expect(wrapper.prop('isAuthenticated')).toEqual(true);
  });
});

Или, может, знаете статью, где про похожий случай можно прочитать? Заранее спасибо!

READ ALSO
Обработка объектов на Яндекс картах

Обработка объектов на Яндекс картах

Карта уже находится у меня на htmlНужно выделить и в дальнейшем обработать объекты на карте(дом,улица,река,дорога) с помощью api

187
Практика по основам JavaScript

Практика по основам JavaScript

Подскажите пожалуйста сайт для практики по основам JavaScript

182
Строка в массив js

Строка в массив js

ЗдравствуйтеПомогите пожалуйста преобразовать строку вида "[a][b][c]" в массив js

240
Странная (не)работа cURL вместе с socks5

Странная (не)работа cURL вместе с socks5

Перед тем как опишу проблему,скажу: я не силен в некоторых аспектах,поэтому проявите терпение)

212