효소 (Enzymes)를 사용하여 스타일이 지정된 구성 요소를 테스트하는 방법 얕은 및 스타일 구성 요소의 ThemeProvider?

Question

효소 얕은 방법과 스타일이 지정된 구성 요소의 ThemeProvider 래퍼를 사용하여 스타일이 지정된 구성 요소의 텍스트 내용을 테스트하는 방법이 있습니까? 얕은 귀하의 텍스트() 출력을 사용

는

class MyComponent extends React.component { 
    ... 
    render(){ 
     return (
      <StyledComponent_A> 
       <StyledComponent_B> 
        some text 
       </StyledComponent_B> 
      </StyledComponent_A> 
     ); 
    } 
} 

test('text is \'some text\'',() => { 
    const wrapper = shallow(
    <ThemeProvider theme={theme}>   
     <MyComponent /> 
    </ThemeProvider 
    ); 
    const text = wrapper.dive().find(StyledComponent_B).text(); 
    expect(text).toBe('some text'); 
}); 

Answer 1

그 <styled.section />

같은 그래서 당신은 스타일 요소의 내용을 얻을 수 어린이()을 사용할 필요가있다. 이 같은 뭔가 :

const text = wrapper.find(StyledComponent_B).children().text(); expect(text).toBe('some text');