Question

我正在考虑编写一些React的util（可能是HOC），它可以让我测试这种代码：

    const wrapper = enzyme
      .mount(
        withTestTheme(
          <JsonInput
            onChange={onChange}
            onValueChange={mockOnValueChange}
            value={exampleJsonStringValidated}
          />),
      );

withTestTheme是一个提供主题属性的包装器，但是它在测试过程中使我麻烦，因为它导致访问我要测试的根组件的问题。关于有用的工具的任何想法，可以使上面的代码更容易测试？

在withTestTheme下面，该主题提供主题-浅色和深色：

export const withTestTheme = (Component: React.ReactChild) => (
  <ThemeProvider theme={TestTheme}>
  {Component}
</ThemeProvider>
);

Answer 1

解决我的问题的代码：

export const withTestThemeWrapper = (props: { children: React.ReactElement }) => (
  <ThemeProvider theme={TestTheme}>
    {props.children}
  </ThemeProvider>
);

通过所有道具的HOC

1 个答案: