I've got a component that uses featuretoggle-react
to render some stuff. For example:
import { On, FeatureToggle } from "featuretoggle-react";
const MyComponent = () => {
return (
<FeatureToggle feature="my_feature">
<On>
// render whatever
</On>
</FeatureToggle>
)
}
I'm now creating tests using Jest
for MyComponent
. An example is as follows:
import React from "react";
import { Provider } from "react-redux";
import { On, FeatureToggle } from "featuretoggle-react";
import { store } from "stores";
test("load my component", async () => {
const mockComponent = () => <div></div>;
jest.mock("featuretoggle-react", () => mockComponent);
render(
<Provider store={store}>
<FeatureToggle feature="my_feature"> // error is signaled here
<On>
<MyComponent />
</On>
</FeatureToggle>
</Provider>
);
// assert some stuff but there is an error returning above
});
When I run the above test, I get the resultant error as:
TypeError: Cannot read property 'state' of undefined
If I comment out the <FeatureToggle feature="my_feature">
from within MyComponent
(as well as in the test), my tests run successfully, which is why I'm inclined to believe that it is an error thrown because of <FeatureToggle />
I have tried to mock it using
const mockComponent = () => <div></div>;
jest.mock("featuretoggle-react", () => mockComponent);
but I still get the same error.
EDIT: even if I don't mock featuretoggle-react
, I still get the same error.