Ad
HOC Which Passes All Props
I am thinking about writing some React's util (probably HOC) which allows me to test such kind of code:
const wrapper = enzyme
.mount(
withTestTheme(
<JsonInput
onChange={onChange}
onValueChange={mockOnValueChange}
value={exampleJsonStringValidated}
/>),
);
withTestTheme
is a wrapper which delivers theme's properties but it make me issue during testing because it causes issues to access to the root component which I want to test. Any ideas on some useful util to easier test above code?
Below withTestTheme
which delivers theme - light and dark:
export const withTestTheme = (Component: React.ReactChild) => (
<ThemeProvider theme={TestTheme}>
{Component}
</ThemeProvider>
);
Ad
Answer
The code which solved my issue:
export const withTestThemeWrapper = (props: { children: React.ReactElement }) => (
<ThemeProvider theme={TestTheme}>
{props.children}
</ThemeProvider>
);
Ad
source: stackoverflow.com
Related Questions
- → Import statement and Babel
- → should I choose reactjs+f7 or f7+vue.js?
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → .tsx webpack compile fails: Unexpected token <
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → React Native with visual studio 2015 IDE
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
- → How do I determine if a new ReactJS session and/or Browser session has started?
- → Alt @decorators in React-Native
- → How to dynamically add class to parent div of focused input field?
Ad