[2.3] Toggling `withTiming` on/off doesn't animate

Description

This code never animates:

const style = useAnimatedStyle(() => ({
  width: isActive.value ? 100 : withTiming(300)
}))

Instead, it always snaps directly between 100 and 300, without an animation.

Expected behavior

When active, this should snap to 100. When inactive, it should do a timing animation to 300. This worked on 2.2.

Actual behavior & steps to reproduce

The animation snaps to 300 when inactive. It doesn’t animate.

This solves it:

const style = useAnimatedStyle(() => ({
  width: withTiming(isActive.value ? 100 : 300, { duration: isActive.value ? 0 : 250 })
}))

But it shouldn’t be necessary.

Snack or minimal code example

View Code

import React from 'react'
import { Pressable, StyleSheet } from 'react-native'
import Animated, {
  useAnimatedStyle,
  useSharedValue,
  withTiming,
} from 'react-native-reanimated'

export default function HelloWorld() {
  const pressed = useSharedValue(false)
  const style = useAnimatedStyle(() => {
    return {
      // this never animates
      width: pressed.value ? 100 : withTiming(300),
      // this does animate
      // width: withTiming(pressed.value ? 100 : 300, { duration: pressed.value ? 0 : 250 })
    }
  })

  return (
    <Pressable
      onPressIn={() => (pressed.value = true)}
      style={styles.container}
      onPressOut={() => (pressed.value = false)}
    >
      <Animated.View style={[styles.shape, style]} />
    </Pressable>
  )
}

const styles = StyleSheet.create({
  shape: {
    justifyContent: 'center',
    height: 250,
    width: 250,
    borderRadius: 25,
    marginRight: 10,
    backgroundColor: 'black',
  },
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
    flexDirection: 'row',
    backgroundColor: '#9c1aff',
  },
})

Video

https://www.loom.com/share/42aa2a930b0f440692cc6d1e2d86375b

Package versions

• React Native: 0.63.4
• React Native Reanimated: 2.3.2
• NodeJS:
• Xcode:
• Java & Gradle:

Affected platforms

• Android
• iOS
• Web

[piaskowyk]

Thanks for the report 🙌 I resolved the issue in linked PR.

[cam-shaw]

@piaskowyk Do you plan to release a new patch version soon? This was a hard regression for us when we updated from v2.2.

Same here. This has prevented us from upgrading, but we’re also facing an issue where measure doesn’t work in iOS modals in 2.2, but is fixed in 2.3…