reactjs - 传递所有 props 的 HOC

Question

我正在考虑编写一些 React 的实用程序(可能是 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>
);