Sunday, May 19, 2024
 Popular · Latest · Hot · Upcoming
56
rated 0 times [  59] [ 3]  / answers: 1 / hits: 15811  / 9 Years ago, fri, october 2, 2015, 12:00:00

We're using ECMAScript 6 promises.



We need to implement progress notifications to the end-user (this is pure UX requirement). I know that other promise frameworks (Q promise library, for ex.) allows that.



How can we adopt some kind of progress indication most elegantly?



Or should we migrate to a different framework?
(I don't know how to estimate the effort of the latter)


More From » promise

 Answers
52

ES2015 promises will never have progression. Promises represent a singular eventual value. If you want multiple values you can look into observables - or put the progress on the promise returning function.



Putting the progress on the promise returning function is pretty easy. Basically you take a callback as a parameter to the function and call it whenever a progress notification should happen.



Here is some text adapted from our guide at bluebird:



Progression has composability and chaining issues with APIs that use promise progression handlers. As other libraries move away from the progression API since it really has little to do with promises, so will Bluebird. Implementing the common use case of progress bars can be accomplished using a pattern similar to IProgress in C#.



Using jQuery before:



Promise.resolve($.get(...))
.progressed(function() {
// ...
})
.then(function() {
// ...
})
.catch(function(e) {
// ...
})


Using jQuery after:



Promise.resolve($.get(...).progress(function() {
// ...
}))
.then(function() {
// ...
})
.catch(function(e) {
// ...
})


Implementing general progress interfaces like in C#:



function returnsPromiseWithProgress(progressHandler) {
return doFirstAction().tap(function() {
progressHandler(0.33);
}).then(doSecondAction).tap(function() {
progressHandler(0.66);
}).then(doThirdAction).tap(function() {
progressHandler(1.00);
});
}

returnsPromiseWithProgress(function(progress) {
ui.progressbar.setWidth((progress * 200) + px); // update with on client side
}).then(function(value) { // action complete
// entire chain is complete.
}).catch(function(e) {
// error
});

[#64857] Thursday, October 1, 2015, 9 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
jadon

Total Points: 488
Total Questions: 105
Total Answers: 105

Location: Trinidad and Tobago
Member since Thu, Dec 1, 2022
1 Year ago
;