interpolateColor ERROR: Cannot read property 'exec' of undefined

Description

Trying to animate background color, but got error Cannot read property ‘exec’ of undefined. Also tried to wrap return value of backgroundColor into processColor function but got the same result

Code example:

import React, {memo, useMemo, useCallback} from 'react';
import {StyleSheet} from 'react-native';
import Animated, {
	useSharedValue,
	useDerivedValue,
	useAnimatedStyle,
	withTiming,
	interpolateColor,
} from 'react-native-reanimated';
import {TouchableWithoutFeedback} from 'react-native-gesture-handler';

const ENABLED_POSITION = 20;

export const Thumbler = memo(() => {
	const x = useSharedValue(ENABLED_POSITION);
	const enabled = useSharedValue(0);
	const translateX = useDerivedValue(() => x.value * enabled.value);

	const onPress = useCallback(() => {
		enabled.value = withTiming(1, {duration: 100});
	}, []);
	const backgroundColor = useDerivedValue(() => {
		return interpolateColor(enabled.value, [0, 1], ['#333333', '#666999']);
	});
	const useIndicatorStyle = useAnimatedStyle(() => ({
		transform: [{translateX: translateX.value}],
	}));
	const useThumblerStyle = useAnimatedStyle(() => ({
		backgroundColor: backgroundColor.value,
	}));

	const indicatorStyle = useMemo(
		() => [styles.indicator, useIndicatorStyle],
		[useIndicatorStyle],
	);
	const thumblerStyle = useMemo(() => [styles.thumbler, useThumblerStyle], [
		useThumblerStyle,
	]);

	return (
		<TouchableWithoutFeedback onPress={onPress} style={styles.touchable}>
			<Animated.View style={thumblerStyle}>
				<Animated.View style={indicatorStyle} />
			</Animated.View>
		</TouchableWithoutFeedback>
	);
});

const styles = StyleSheet.create({
	touchable: {
		height: 20,
		width: 38,
		justifyContent: 'center',
		alignItems: 'center',
	},
	thumbler: {
		width: 36,
		height: 18,
		borderRadius: 9,
	},
	indicator: {
		width: 18,
		height: 18,
		borderRadius: 20,
		backgroundColor: '#ddd',
	},
});

Package versions:

• React Native: 0.63.3
• React Native Reanimated: 2.0.0-alpha.9.1

[piaskowyk]

Yes, It’s possible, because we haven’t been releasing a new version with this patch. We try to release a new version every two week - it should happen on Thursday or Friday.

[AlexeyVlasenko]

@caiphaav I can confirm that this bug exists in my project too.