React Native 実践本のメモ

May 23, 2020

React Native 〜 JavaScriptによるiOS／Androidアプリ開発の実践（GitHub）を読んで、0.62だと動かなかったので、取り急ぎその対応メモ。

Argument of type ‘string | ReactTestInstance’ is not assignable to parameter of type ‘Pick<ReactTestInstanceExtended, "type" | "props" | "parent" | "children" | "find" | "findAll" | "getProp" | "parentNode">’. Type ‘string’ is not assignable to type ‘Pick<ReactTestInstanceExtended, "type" | "props" | "parent" | "children" | "find" | "findAll" | "getProp" | "parentNode">’.

- fireEvent.press(container.children[0]);
+ fireEvent.press(container.children[0] as any);

Error: expect(jest.fn()).toBeCalled() Expected number of calls: >= 1 Received number of calls: 0

# https://github.com/facebook/react-native/issues/27721
# package.json
jest: {
  "setupFilesAfterEnv": ["./jest.setup.js"],
}

# jest.setup.js
jest.mock('react-native/Libraries/Components/Touchable/TouchableOpacity', () => 'TouchableOpacity');

No overload matches this call. Overload 1 of 2, ‘(props: Pick<Pick<ViewProps & RefAttributes & { children: ReactNode; style?: StyleProp; theme: Theme; }, "style" | … 52 more … | "onTouchEndCapture"> & { …; } & { …; } & { …; }, "onPress" | … 63 more … | "contentStyle"> & { …; }, context?: any): ReactElement<…> | … 1 more … | null’, gave the following error. Property ‘accessibilityStates’ is missing in type ‘{ children: "" | Element | undefined; accessibilityLabel: string; icon: string; mode: "contained"; onPress: () => void; }’ but required in type ‘Pick<Pick<ViewProps & RefAttributes & { children: ReactNode; style?: StyleProp; theme: Theme; }, "style" | …

# https://www.npmjs.com/package/patch-package
# https://github.com/callstack/react-native-paper/issues/1920
yarn add patch-package postinstall-postinstall
vim node_modules/@types/react-native/index.d.ts

# `accessibilityState?: AccessibilityState;` の下に追加
accessibilityStates?: any; 

yarn patch-package @types/react-native

React、React Native、TypeScript初心者なので、色々とはまる 🤣