説明
私は react-native-reanimated を使用しており、テスト時に、useSharedValue は、jest と react-native-testing-library を使用すると関数ではないというエラーをスローします。パッケージの一部として提供されているモックを使用して、react-native-reanimated をモックしました。reanimated にはエクスポートされたメンバー useSharedValue、useAnimatedStyle、および withTiming がない VS Code のハイライトにも気付きましたが、コンポーネントはエラーなしで適切に実行されます。
適切にモックするために何をする必要があるか知っている人はいますか?
コード
コンポーネントがレンダリングされるかどうかを確認するテスト
import React from "react";
import { render } from "react-native-testing-library";
import { Switch } from "../src/native/Switch";
describe("Switch Package", () => {
it("renders", () => {
render();
});
});
react-native-reanimated.js という名前のモックに配置されるモック ファイル
jest.mock("react-native-reanimated", () => require("react-native-reanimated/mock") );
Reanimated を使用するコンポーネント - Switch.tsx
import { Button } from 'react-native';
import {
useSharedValue,
useAnimatedStyle,
withTiming,
Easing,
} from 'react-native-reanimated';
function Switch() {
const opacity = useSharedValue(0);
const style = useAnimatedStyle(() => {
return {
opacity: withTiming(opacity.value, {
duration: 200,
easing: sing.out(Easing.cubic),
}),
};
});
return (
<Animated.View style={[{width: 100, height: 100, backgroundColor: 'green'}, style]} />
<Button onPress={() => (opacity.value = 1)} title="Hey" />
);
}
パッケージのバージョン
React: 16.11.0 React Native: .062.2 React Native Reanimated: 2.0.0-alpha.3
スクリーンショット
