Uppy: onBeforeFileAdded callback issue

[jerko-culina]

Hi,
I work on image upload, and I have a restrictions on allowedFileTypes and maxFileSide.
My onBeforeFileAdded looks like:

  onBeforeFileAdded: (currentFile, files) => {
    debugger
    if (currentFile.data.size > uppy.opts.restrictions.maxFileSize) {
      ...
    }

When I choose file temp.img that violates restrictions, the callback onBeforeFileAdded is called and it stops on debugger.
Then I let debugger to go, and everything is fine

Then I chose the same file temp.img that violates restrictions, the callback onBeforeFileAdded it do not stop on debugger, in other words it is not called at all.

Then i chose some other file like temp_222.img file that violates restrictions, the callback onBeforeFileAdded is called and it stops on debugger.

Thanks! :) and

Here is my config:

$().ready(function() {
  var uppy = Uppy.Core({
  debug: true,
  autoProceed: true,
  restrictions: {
    maxFileSize: 1000,
    maxNumberOfFiles: false,
    minNumberOfFiles: false,
    allowedFileTypes: ['image/*']
  },
  onBeforeFileAdded: (currentFile, files) => {
    debugger

    if (currentFile.data.size > uppy.opts.restrictions.maxFileSize) {
      const message = `Error: ${currentFile.name} file exceeds maximum allowed size of 20 MB.`;
      const timeStamp = Date.now();

      $('.Informer').append( "<p class='" + timeStamp + " link'> " + message + "</p>").find("." + 
          timeStamp).delay(10000).slideUp();
      // return false
    }
  },
  })
  .use(Uppy.FileInput, {
    target: '.DashboardContainer',
    allowMultipleFiles: true,
    pretty: true,
    inputName: 'files[]',
    locale: {
      strings: {
        chooseFiles: 'Select to upload'
      }
    }
  })
  .use(Uppy.ThumbnailGenerator)
  .use(Uppy.ProgressBar, {
    target: '.DashboardContainerStatusBar',
  })
  .use(Uppy.AwsS3, {...})
  .run()

[goto-bus-stop]

This happens because the file is not re-added the second time. Files are added when the <input type="file"> emits a change event, which doesn't happen if you select the same file twice.

It's a little unclear here because the file input is hidden. If the file input is shown (pretty: false) you'll see the previous file name there.

I'm not sure if we _should_ do something about it, but the way to fix it would be to clear the input's .files property after we called addFile().

[jerko-culina]

Thanks on replay, I'm also not sure if this is issue, but I tried next:

First I choose file temp.img that violates restrictions, the callback onBeforeFileAdded is called and it stops on debugger.

Second I choose file temp.img that violates restrictions, the callback onBeforeFileAdded is not called and it do not stops on debugger.

Third I choose file temp_222.img that violates restrictions, the callback onBeforeFileAdded is called and it stops on debugger.

Fourth I choose file temp.img that violates restrictions, the callback onBeforeFileAdded is called and it stops on debugger.

---

I really don't know if it is issue or not but for me this behaviour is a little unusual. In Fourth example if it didn't call the onBeforeFileAdded callback it would be ok, but on this way it is unusual.

If You're going to plan something about this, please notify me about your decision.
Thank You! :)

[kvz]

Sorry for the long delay but we'll see if we can reproduce this!

[goto-bus-stop]

re: my earlier comment, the issue here was that the input value in the FileInput plugin was not cleared after selecting a new file. If you selected the same file again the browser would not emit a 'change' event and uppy.addFile() would not be called again, so onBeforeFileAdded would also not be run again. I think this was fixed, but if @lakesare can try that out to double check it would be :100: :pray:

[lakesare]

@goto-bus-stop, we still have this issue, in that if we try to select the same file twice, - onBeforeFileAdded() is not called the second time (and is called again for this file if we try to select some completely different file in between the attempts).
I will look into it!