Switching between fixed and animated prop values does not work correctly

Problem Description

When you transition between a fixed value for a prop and an animated value for a prop, the behavior is not correct (does not match the JS animation driver).

Steps To Reproduce

1. Clone the repro from https://github.com/rozele/react-native-windows/tree/animatedRepro
2. Run playground.sln -> RNTester -> Native Animated examples -> Loop Example
3. Click the square in the loop example
4. Notice that the loop animation does not start

Expected Results

The expected behavior is for the square to start a loop animation on opacity from 0 to 1. Instead it stays fixed at 1.

CLI version

npx react-native --version

Environment

npx react-native info

Target Platform Version

No response

Target Device(s)

No response

Visual Studio Version

No response

Build Configuration

No response

Snack, code example, screenshot, or link to a repository

Here is a video of the example working with the JS animation driver:

https://user-images.githubusercontent.com/1106239/149191372-0cfd9e86-174a-4f4b-a79c-38641311948d.mp4

Here is a video of the example not working with the composition native animated driver:

https://user-images.githubusercontent.com/1106239/149191386-9739c095-e050-459a-9952-aef15918091f.mp4

https://github.com/rozele/react-native-windows/tree/animatedRepro

Start with the animatedRepro branch and run playground.sln to inspect the RNTester Native Animated Loop Example. Reproduce the transition from fixed opacity 1 to the looping opacity animation and compare the composition native animated driver with the JS driver shown in the videos. Done means the square starts looping from opacity 0 to 1 after it is clicked.