Upload with ProgressBar

Flow
1

Is there an example anywhere for an Upload component with a ProgressBar?

Basically I have something like this:

MemoryBuffer fileBuffer = new MemoryBuffer();
Upload fileUpload = new Upload(fileBuffer);
fileUpload.setMaxFileSize(500000000);

fileUpload.addStartedListener(event -> {
	// show ProgressBar
});
fileUpload.addAllFinishedListener(event -> {
	// hide ProgressBar
});
fileUpload.addProgressListener(event -> {
	// update ProgressBar
});

However, the “StartedListener” is invoked after the upload is already finished and so I am not getting any progress indicator during the long waiting period (file size 500 MB). Also, the “ProgressListener” is invoked only twice: one after 4096 Bytes and the second when the upload is complete. So even if the StartedListener were invoked in time, I would not get any chance to update the progress bar. I suspect I am doing something very basic wrong.

2

I have found an issue which may have something to do with it:
https://github.com/vaadin/vaadin-upload/issues/328

3

I didn’t realize that the Vaadin Upload component already includes a progress bar, because my CSS was hiding it. So I suppose trying to make my own was doomed from the start. Although I’d still like to know why the listeners all fire only after the upload is almost done.

4

I do not think the idea is doomed! When the built-in bar does not match user interface design requirements and the changes cannot be made by CSS tweaking, like in my case, we need a way how to design our specific progress bar. And another point - if the feature is defined in the API, it should work. If it does not work and nobody is willing to update the bug, the listener should be removed from the public API definition.