primefaces / primefaces/primereact
ProgressBar: Bar doesn't move with percentage
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
When the progress bar state is updated with a new value before it has finished animating, the bar length will not update with the value. So if I have data that loads 10% in 0.2s, by the end the progress bar will only be about 1/5 of the length of the full bar
Reproducer
https://codesandbox.io/s/primereact-demo-forked-smhnqr?file=/src/App.jsx
PrimeReact version
10.3.0
React version
18.x
Language
TypeScript
Build / Runtime
Vite
Browser(s)
No response
Steps to reproduce the behavior
No response
Expected behavior
The animation of the bar length animation should not be restarted when new value is provided before it is done animating
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked CodeSandbox reproducer and inspect the ProgressBar behavior when its value changes during an active animation. Verify the result against PrimeReact 10.3.0 with React 18 and Vite. Done means the bar reaches the latest percentage without restarting its length animation when updates arrive before the prior animation finishes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100