Materyal UI bileşenini içeren bileşeni test etmek için içeriği Enzim mount yöntemine nasıl geçirirsiniz?

Question

Birkaç Malzeme UI bileşeninin yuvalandığı bileşenimi test etmek için Enzim'den mount'u kullanmaya çalışıyorum. testi çalıştırırken bu hatayı alıyorum:

TypeError: Cannot read property 'prepareStyles' of undefined

bazı kazma sonra I did found that a theme needs to be passed down in a context. Bunu testte yapıyorum ama yine de bu hatayı aldım.

Benim testi:

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); 
    }); 
}); 

Benim arayıcı bileşeni vatansız bileşenidir, bu yüzden herhangi bir bağlamda çekerek değilim. Ama ben bile, aynı hatayı alıyorum.

Neyi yanlış yapıyorum? mount seçeneklerinde childContextTypes ekleyerek

Answer 1

Dene:

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

bunu yaparak buna müsait muiTheme bağlamda yoluyla çocuklara bulunuyor yapmak Enzim sarmalayıcı ayarlayın.