0

I have the following code for File input in LWC. The drag-drop works fine for chrome, edge browser. But for Mozilla Firefox browser and Internet Explorer, If we select the button and open the popup for file upload and from there if we drag files it does not work. No event gets triggered.

                        <lightning-input type="file"
                            name="file uploader" 
                            class="WUInputContainer"  
                            onchange={handleFileUpload} 
                            data-fieldname='Title'
                            multiple
                            accept={acceptedFormats}
                            variant="label-hidden">
                        </lightning-input>

enter image description here

Improve this question
2
  • 1
    I'm not surprised IE doesn't work; it's already on life support, and even that support will be gone in three months. Do you see any errors on the developer console for Firefox?
    – sfdcfox ♦
    Commented Aug 4, 2020 at 7:38
  • @sfdcfox Thanks for reply. No Actually, it is not allowing to drag. See the symbol below selected file. So no console log is appearing as no event. Also if you drag without opening popup, it allows to do so.
    – Pankaj Andhale
    Commented Aug 4, 2020 at 7:44

1 Answer 1

Reset to default
1

Upload files dialog is supposed to be used to:

  1. Click upload file button to open a dialog, browse to the directory where you have a file and select the file and click open.
  2. Other option is to open your source folder from file explorer then drag the file to drop file zone.

This is a usability issue and you must not use the dialog as an option to drag and drop files to drop zone.

3 years ago our QA had added logged this as an issue against our custom file uploader aura component, after burning 2 weeks we found we have same issue with standard lightning file base component; and this was a usability simply issue.

Combining both options used to crash our browsers, great that firefox IE even stopped allowing this behavior.

Improve this answer
2
  • Do we have workaround for this or is it sure firefox and IE does not support it. I tried using: 1. ondragover, ondrop on div 2. dragover or drop event listeners, but it doesn't help. I just want to make sure I am not missing something here and its browser's supprt issue.
    – Pankaj Andhale
    Commented Aug 4, 2020 at 10:03
  • It's not a bug, we need to use drag and drop from file explorer and not from upload dialog.
    – Raul
    Commented Aug 4, 2020 at 14:49

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .