CODEWITHSUNDEEP
reactjstypescript
Explosion Pills
Explosion Pills

Reputation: 191749

Overriding types to prevent unsafe any calls

I have some tests in React Native using the react-test-renderer such as:

it('should keep login button disabled', async () => {                       
  const emailInput = root.findByProps({ testID: 'EmailInput' }); 
  const passwordInput = root.findByProps({ testID: 'PasswordInput' });  
  await act(async () => {                                                   
    await emailInput.props.onChangeText('abc'); 
    await passwordInput.props.onChangeText('abc');                          
  }); 
  const loginButton = root.findByProps({ testID: 'LoginButton' });          
    expect(loginButton.props.type).toBe('disabled');                          
  });

This works fine, but @typescript-eslint is complaining about no-unsafe-call because of the type declarations returned by ReactTestInstance: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react-test-renderer/index.d.ts -- specifically, ReactTestInstance has { [propName: string]: any}.

I generally want to keep this rule, so I want to avoid disabling it for every line.

I can create a type definition for ReactTestInstance, but when I do that, I also get "types of property props are incompatible." Same if I use casting.

Is there any way to override library types? Beyond that, are there any other suggestions to handle the unsafe type in this way?

Upvotes: 0

Views: 145

Answers (1)

Tim Perry
Tim Perry

Reputation: 13216

The best solution here is probably going to be to cast props to correct type, rather than casting ReactTestInstance to a custom type. Like so:

await (emailInput.props as EmailInputProps).onChangeText('abc');

While casting ReactTestInstance is possible (you just need cast to unknown first, e.g. ... as unknown as MyCustomType), casting each of the props to their correct types instead will give you more accurate types overall. You probably have a type for those props easily available already anyway.

Upvotes: 1

Related Questions