How to set types for mounting function in enzyme tests?

Viewed 4131

I'm using Typescript and Enzyme for testing react components. I'm very new to Typescript.

I've got this helper function in tests:

const getComponent = (mountFn = shallow) => (
  mountFn(<Component />)
)

This works when I run it as getComponent() but as soon I do getComponent(mount) it fails because typescript assumes getComponent returns ShallowWrapper.

I have a couple of questions:

  1. How do I tell Typescript that mountFn can be either shallow or mount?
  2. How do I tell it that the return value can be of type ShallowWrapper or ReactWrapper?
  3. Ideally - how do I tell it that the return value should be of type ShallowWrapper when shallow was passed and ReactWrapper when mount was passed?
  4. How do I do this using typings that are already defined in @types/enzyme?
  5. Is this a good practice at all? I used to do it all the time before using typescript but maybe I should just create 2 separate functions?
1 Answers
Related