在 Jest 测试中,react-native-reanimated useSharedValue 不会更新

标签 react-native jestjs react-native-reanimated react-native-testing-library

我目前正在尝试弄清楚如何使用 useSharedValue 测试重新启动的 2 个动画。

对我来说 0 有意义的是来自 reanimated 的例子。

https://github.com/software-mansion/react-native-reanimated/blob/master/tests/SharedValue.test.js

如果按钮应该在每次按下时将其共享值增加 1。你为什么要编写一个测试来表明它不会改变???

我自己尝试过,是的,该值不会自行更新。

我想断言我的测试中的值已更改:

ParallaxScrollView.tsx

const scrollY = useSharedValue(0);

const onScroll = useAnimatedScrollHandler((event) => {
    scrollY.value = event.contentOffset.y;
});
return (
    <Animated.Image
        style={{height: scrollY}}
        testID="header-image"
        source={{ uri: headerImage }}
        resizeMode="cover"
    />
)

ParallaxScrollView.test.tsx

const { getByTestId } = render(<ParallaxScrollView {...defaultProps} />);
const headerImage = getByTestId('header-image');
const content = getByTestId('parallax-content');

const eventData = {
  nativeEvent: {
    contentOffset: {
      y: 100,
    },
  },
};

fireEvent.scroll(content, eventData);

expect(headerImage).toHaveAnimatedStyle({ height: 100 }); //Received is 0

最佳答案

useAnimatedScrollHandler 使用 react-native-gesture-handler 来处理事件,但目前手势处理程序还不支持测试中的事件,这就是我的情况正在努力。看看这个 - https://github.com/software-mansion/react-native-gesture-handler/pull/1762
我想这很快就会推出。如果您想了解最新信息,请在 Reanimated Github 中提出问题。

关于在 Jest 测试中,react-native-reanimated useSharedValue 不会更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70268790/

相关文章:

reactjs - 单元测试 navigator.permissions.query({ name : 'geolocation' }) using Jest (React)

javascript - 有没有办法从 Jest 中排除文件模式?

javascript - 无法从/projectFolder 中找到模块 'react-native-reanimated/plugin'

react-native - 如何使用 react 导航在屏幕之间拥有不同的过渡动画?

react-native - undefined 不是函数(计算 'transform.forEach' )

react-native - React Native 明文多个 TextInput 框

javascript - 未定义不是 this.state 中的对象 - React Native

node.js - 使用 GetStream.io 和 firebase 正确的用户创建流程?

javascript - 在 React Js 中使用 Jest 测试函数

reactjs - React-native-reanimated:无法解析 "./useValue"