microsoft / microsoft/react-native-windows

NativeAnimated module behavior difference for medium complexity animation

Open
#10,363 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Area: Animation bug Needs: Dev Design Partner: Facebook Workstream: Component Parity
Dominant language
C++
Stars
17.3k
Forks
1.2k
Avg merge
1d 13h
Merged PRs (30d)
33

Description

Problem Description

We noticed a bug during the upgrade to 0.68 where composition animations stopped working correctly for a specific component.

I didn't spend any time isolating where the bug is coming from in NativeAnimated, but instead just ported the component over so anyone can reproduce the bug.

Steps To Reproduce
  1. Pull in changes from https://github.com/rozele/react-native-windows/commit/8115d05f6904d412d3fdb242de31c68f9effdc9a
  2. Run Playground app
  3. Load Samples\simple example in Playground
  4. Play around with the "star rating" component, notice the difference when running the JS driven animation and after clicking the Use Native Driver button to enable native animations.
Expected Results

NativeAnimated behavior should be identical to JS driven animation behavior.

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

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Apply commit 8115d05f6904d412d3fdb242de31c68f9effdc9a, run the Playground app, and load the Samples\simple example. Compare the star rating component with JS-driven animation and with Use Native Driver enabled, then trace the NativeAnimated behavior. Done means the native animation matches the JS-driven result.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native
Domain
desktop, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.