如何遍历嵌套在 ThemeProvider HOC 中的浅层组件？

跟进该问题Github https://github.com/cssinjs/react-jss/issues/184,我有一个组件Comp导出时，包裹着injectSheet from reactjss. 请参阅上的设置代码沙箱 https://codesandbox.io/s/674jknj4z.

在单元测试中，我想断言该组件包含<a>，它确实做到了（请参阅codesandbox），但无论如何测试都会失败：

describe("<Comp /> component", () => {
  const wrapper = shallow(<Comp />);

  it("should render a <a>", () => {
    expect(wrapper.find('a')).to.have.length(1);
  });
});

I get Error: [undefined] Please use ThemeProvider to be able to use WithTheme。所以我的自然反应（也许不正确？）是将组件包裹起来ThemeProvider:

const wrapper = shallow(
  <ThemeProvider theme={{}}>
    <Comp />
  </ThemeProvider>
)

然后我得到AssertionError: expected { length: 0 } to have a length of 1 but got 0.

我尝试了很多方法，包括打电话dive, find or first额外shallow打电话，但我会always以结束Please use ThemeProvider to be able to use WithTheme:

// 1. dive(), as suggested in
// https://github.com/cssinjs/react-jss/issues/30#issuecomment-268373765
expect(wrapper.dive('Comp')).to.have.length(1);
expect(wrapper.dive('Comp').find('a')).to.have.length(1);
expect(wrapper.dive().find('a')).to.have.length(1);

// 2. find() / first(), as suggested in https://github.com/airbnb/enzyme/issues/539
expect(wrapper.find(Comp).shallow().find('a')).to.have.length(1);
expect(wrapper.first().shallow().find('a')).to.have.length(1);

这里有什么想法吗？我对 React 单元测试有点陌生，所以如果有人能在这方面启发我，我将不胜感激;)

对于任何仍在为此苦苦挣扎的人，one提出了可行的方法GitHub https://github.com/cssinjs/react-jss/issues/184#issuecomment-350227444。而不是测试包裹着的样式组件injectSheetHOC，导出独立组件并单独测试它

// Component.js
import React from 'react'
import injectSheet from 'react-jss'

const styles = {
  color: 'burlywood'
}

// named export for unit tests
export const Component = props => <h1>Component</h1>

// default export to be used in other components
export default injectSheet(styles)(Component)

这适用于大多数用例，因为通常情况下，您需要对普通组件及其逻辑进行单元测试，而不是对其任何关联的样式进行单元测试。所以在你的单元测试中只需做

import { Component } from './Component'

而不是（您将在代码库的其余部分中执行此操作）

import Component from './Component'