reactjs – 如何使用酶测试React-Responsive组件？

我正在努力弄清楚如何测试嵌套在React-Responsive Media Query Components中的组件：

export default class AppContainer extends React.Component {
  render(){
    return(
      <MediaQuery minDeviceWidth={750}>
         <Header />
      </MediaQuery>
    );
  }
}

–

describe("AppContainer",() => {
  let App;
  let wrapper;
  beforeEach(() => {
    wrapper = mount(<Provider store={store}><AppContainer location={location} /></Provider>);
    App = wrapper.find(AppContainer);

  });
  it('to have a <Header /> component',() => { 
    console.log(App.debug());
    expect(App.find(Header)).to.have.length(1);
  });
}

测试结果：

1) AppContainer to have a <Header /> component:
AssertionError: expected { Object (component,root,...) } to have a length of 1 but got 0

console.log输出的相关部分是：

<MediaQuery minDeviceWidth={750} values={{...}} />

指示标题确实没有出现在渲染树中.但是,如果我删除MediaQuery并使Header成为AppContainer的直接子项,则测试通过.

我想这不是一个错误,因为我对Enzyme和一般的测试组件都很新.任何帮助或示例将不胜感激.

请注意：我对此组件的其他测试正在通过.我相信进口和设置都是正确的.