kimmobrunfeldt / kimmobrunfeldt/progressbar.js

Progress Bar, not animating on inactive tab.

Open
#298 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
7.9k
Forks
1.4k
PR merge metrics
No merged PRs in 30d

Description

I have progress bar and I am using signalR to trigger animation, It workes perfectly when I am on the tab but when the tab is inavtive it pauses the animation.

var bar = new ProgressBar.Line("#su_progress-spinner", {
strokeWidth: 4,
easing: 'easeInOut',
duration: 1400,
color: '#1dc9b7',
trailColor: '#eee',
trailWidth: 1,
svgStyle: {width: '100%', height: '100%'},
text: {
style: {
// Text color.
// Default: same as stroke color (options.color)
color: '#999',
position: 'absolute',
right: '0',
top: '30px',
padding: 0,
margin: 0,
transform: null
},
autoStyleContainer: false
},
from: {color: '#1dc9b7'},
to: {color: '#1dc9b7'},
step: (state, bar) => {
bar.setText(Math.round(bar.value() * 100) + ' %');
}
});

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the provided ProgressBar.Line configuration while its browser tab is inactive, using the SignalR-triggered animation described in the issue. Determine whether the progress bar can continue animating in that state and document a reproducible result or test showing the expected behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 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.