Closed
Description
I'm using React Native Elements and testing my components using react-native-testing-library. However, when I try to use the getByType/getAllByType/queryByType/queryAllByType
APIs, TypeScript complains about props that are marked by the component as required. One example of a component with a required attribute is the Icon component from React Native Elements.
Consider this example:
// Icon has a required prop `name`
import { Icon, Input } from 'react-native-elements';
// Current signature used by getByType/getAllByType/queryByType/queryAllByType
// getByType: (type: React.ComponentType) => ReactTestInstance;
// getAllByType: (type: React.ComponentType) => Array<ReactTestInstance>
// queryByType: (type: React.ComponentType) => ReactTestInstance | null;
// queryAllByType: (type: React.ComponentType) => Array<ReactTestInstance> | [];
const inst = render(<Input leftIcon={{ name: 'visibility-off' }} />);
// TypeScript fails!
const icon = inst.getByType(Icon);
Error shown
[ts]
Argument of type 'typeof Icon' is not assignable to parameter of type 'ComponentType<{}>'.
Type 'typeof Icon' is not assignable to type 'ComponentClass<{}, any>'.
Types of parameters 'props' and 'props' are incompatible.
Type '{}' is not assignable to type 'Readonly<IconProps>'.
Property 'name' is missing in type '{}'. [2345]
Metadata
Metadata
Assignees
Labels
No labels