Snapshot testing the custom components is an important activity in our project.
I tried to do it in reason, and for that I added bs-jest and bs-react-test-renderer but the generated snapshots are totally useless.
snapshot testing a lower case component is ok as you can see here but when testing a custom component, an opaque array is returned as seen here.
How do you test your custom components ? will snapshot testing be possible in the future ?
yeah wow that’s a mess. This would be a good issue to raise on the bs-react-test-renderer project – they could expose a renderer that cleans up the props a bit to make the snapshots more useful.
Wow. That’s a total mess. But that is how ReasonReact works under the hood. We need a custom render for ReasonReact
@jaredly could you elaborate a little ?
Do you mean implement a js serialiser or something can be made at the reason level ?
it’s not easy, at js level, to know what each array index is.
Probably at the reason level, where it takes a component & unpacks the attributes into a javascript object.
It looks like it is related to this: https://github.com/reasonml/reason-react/issues/27
The issue in question is about React DevTools, but it displays the same reasonProps. Looks like reasonProps is a reference to the element. Played around with it a little tonight, and I made a small little serializer that would remove reasonProps from the snapshot output.
Unfortunately, I’m not sure of a way to see the actual props passed to a component.
I’ll dig in further when I have some more time to see if there is anything the renderer can do.