vaadin / flow-components

Java counterpart of Vaadin Web Components
102 stars 65 forks source link

File name not present in the serialized 'upload-success|error|abort' events #1357

Open pleku opened 6 years ago

pleku commented 6 years ago

@TomiZet commented on Wed Jun 13 2018

Events 'upload-success', 'upload-error' and 'upload-abort' handled by vaadin-upload component are serialized and send to the back-end (BE). But the event.detail.file does not contain name property. Thus the BE has no information about which file upload was aborted. For more details see also vaadin/components gitter, message from 07th June 2018, Question#1


@limonte commented on Wed Jun 13 2018

File objects aren't serializable by default: http://jsbin.com/nuwivexeto/edit?html,js,console,output

I'm not sure which BE you're using and how your FE communicating with the BE, but maybe this workaround will work for your case: https://stackoverflow.com/a/29281243/1331425


@TomiZet commented on Wed Jun 13 2018

Thanks for the reply! By BE I mean vaadin-flow server part of this UI component.. so the problem is not in the component itself, but in the event listeners, which are I guess registered by vaadin-client js library, correct? When debugging this problem I ended up in the obfuscated js code in the VAADIN/static/client and there the file object was serialized and send to the BE. If so, then this issue might be closed and I need to address it for the client library - same would apply also for issue vaadin/vaadin-upload#270.


@limonte commented on Wed Jun 13 2018

Alright, I'll close this issue and vaadin/vaadin-upload#270 for now. Feel free to add comments in future on both issues so we can reopen them and fix issues if there are some.

TomiZet commented 6 years ago

Took me some time, but based on the @pleku suggestion I was able to get the filename at the backend. Here is a code snippet in case someone would need it:

public class MyUpload extends Upload {

  public MyUpload(Receiver reciever) {
    super(reciever);
    Element element = getElement();
    element.addEventListener("upload-abort", this::myUploadAbortHandler).
    addEventData("event.detail.file.name");
  }

  private void myUploadAbortHandler(DomEvent event) {
    JsonObject jsonObj = event.getEventData();
    if (jsonObj == null) return;

    JsonValue jsonVal = jsonObj.get("event.detail.file.name");
    String fileName = jsonVal.asString();
    // etc..
  }
}
iatomic commented 6 years ago

well having to extend a component to be resued out of the box is major pain. we should not have to extend EVERY component we want to use but just configure it...

pleku commented 5 years ago

The file name should be present in all the other events, but the AbortEvent is not exposed in the Java side so probably that one should be added. https://cdn.vaadin.com/vaadin-upload/4.2.1/#/elements/vaadin-upload#event-upload-abort doesn't give any info whether the filename is present in the event or not.

There is no ErrorEvent either, but not sure why that would be needed instead of FailedEvent which already exists.