Подтвердить что ты не робот

Как передать контекст с помощью метода монтирования фермента для тестирования компонента, который включает компонент материального интерфейса?

Я пытаюсь использовать mount из Enzyme для тестирования моего компонента, в котором вложен компонент Component Material. Я получаю эту ошибку при запуске теста:

TypeError: Cannot read property 'prepareStyles' of undefined

После некоторого копания я обнаружил, что тема должна быть передана в контексте. Я делаю это в тесте, но все равно получаю эту ошибку.

Мой тест:

import expect from  'expect';
import React, {PropTypes} from 'react';
import {mount} from 'enzyme';
import SearchBar from './SearchBar';
import getMuiTheme from 'material-ui/styles/getMuiTheme';

function setup() {
  const muiTheme = getMuiTheme();

  const props = {
    closeSearchBar: () => {},
    fetchSearchData: () => {},
    data: [],
    searching: false
  };

  return mount(<SearchBar {...props} />, {context: {muiTheme}});
}

describe('SearchBar Component', ()=> {

  it('Renders search toolbar properly', () => {
    const wrapper = setup();
    expect(wrapper.find('.toolbar').length).toBe(1);
    expect(wrapper.find('button').length).toBe(1);
  });
});

Мой компонент поисковой системы - это компонент без гражданства, поэтому я не занимаюсь никаким контекстом. Но даже когда я, я все равно получаю ту же ошибку.

Что я делаю неправильно?

4b9b3361

Ответ 1

Попробуйте добавить childContextTypes в опции mount:

return mount(
  <SearchBar {...props} />, {
    context: {muiTheme},
    childContextTypes: {muiTheme: React.PropTypes.object}
  }
);

Сделав это, вы установите оболочку Enzyme, чтобы сделать muiTheme доступными для нее дочерние элементы через контекст.