Using Jest with expect.js and enzyme I'm testing a HOC enriches the component with special props. One of the features of this HOC is that it calls a getter api promise and passes on the results of this promise through the props. I'm currently testing the loaded and loading flags.
Its a work in progress but see the HOC here:
The test that I'm currently working on can be found here:
Here's a snippet:
it("Provides proper loading flags when done", async () => {
MountedDummyFormWithAuth = CreateDummyFormWithAuth();
setTimeout(()=>{}, 3050);
await waitForExpect(()=>{
let testForm = MountedDummyFormWithAuth.find('TestFormEdit');
console.log(testForm.props());
expect(testForm.prop('loaded')).toEqual(true);
expect(testForm.prop('loading')).toEqual(false);
});
});
The mock API is just a simple promise with a timeout function that returns an object.
Once this object is returned, the HOC updates the TestFormComponent through props. So loading = false and loaded = true. For some reason, the testForm instance's props are still set to loading. I use this exact same component with the exact same setup in a real world environment and it works properly. My guess is that either:
a) The testForm instance is not being updated because of some behavior that I don't understand in the mount method. b) this set timeout is not being awaited on and the waitForExpect.
Is there a proper way to test this scenario? The component is waiting on a promise to be fulfilled so its props should be set to loading in the interim, then once the promise is fulfilled, the HOC then updates the loading prop. All this should happen within 1500ms.
I'm guessing that I would test this like I would an animation where component style would have to match bar at 0ms then match foo at 1500ms. But I don't know how to test that... Any help would be much appreciated.
Aucun commentaire:
Enregistrer un commentaire