Errors not showing | They used to show but not anymore

Hello Uploadcare community!

I have a validation working, I have tested out and everything works. My validation has three parts, height and width restrictions and DPI restrictions. When I upload something that breaks the validation it used to appear the Errores messages that I descripted but not anymore.

That is my JS code:

<script>

function maxDimensions(width, height) {
  return function(fileInfo) {
    var imageInfo = fileInfo.originalImageInfo

    if (imageInfo === null) {
      return
    }
    var heightExceeded = height && imageInfo.height < (height-10)

    if (width && imageInfo.width < (width-10)) {
      if (heightExceeded) {
        throw new Error('maxDimensions')
      }
      else {
        throw new Error('maxWidth')
      }
    }
    if (heightExceeded) {
      throw new Error('maxHeight')
    }
    var heightExceeded2 = height && imageInfo.height > (height+10)

    if (width && imageInfo.width > (width+10)) {
      if (heightExceeded2) {
        throw new Error('maxDimensions')
      }
      else {
        throw new Error('maxWidth')
      }
    }
    if (heightExceeded2) {
      throw new Error('maxHeight')
    }
  }
}


function minDpi(dpi) {
  return function(fileInfo) {
    var imageInfo = fileInfo.originalImageInfo;
   if (imageInfo === null) {
     return;
   }
   console.log(imageInfo.dpi[0] || null);
   if (imageInfo.dpi[0] < (dpi-10)) {
      throw new Error("dpiError");
   }
   if (imageInfo.dpi[0] > (dpi+10)) {
      throw new Error("dpiError");
   }
  }
}

$(function() {
  $('[role=uploadcare-uploader]').each(function() {
    var input = $(this)

    if (!input.data('maxWidth') && !input.data('maxHeight')) {
      return
    }
    var widget = uploadcare.Widget(input)

    widget.validators.push(maxDimensions(input.data('maxWidth'), input.data('maxHeight')))
    widget.validators.push(minDpi(input.data('dpi')));
  })
})

UPLOADCARE_LOCALE_TRANSLATIONS = {
  // messages for widget
  errors: {
    maxDimensions: 'This image does not match the required dimensions',
    maxWidth: 'This image does not match the width required.',
    maxHeight: 'This image does not match the height required.',
    dpiError: 'This image does not match the DPI required.',
  },
  // messages for dialog’s error page
  dialog: {
    tabs: {
      preview: {
        error: {
          'maxDimensions': {
            title: 'ERROR',
            text: 'This image does not match the required dimensions',
            back: 'Please try again',
          },
          'maxWidth': {
            title: 'ERROR',
            text: 'This image does not match the width required.',
            back: 'Please try again',
          },
          'maxHeight': {
            title: 'ERROR',
            text: 'This image does not match the height required.',
            back: 'Please try again',
          },
          'dpiError': {
            title: 'ERROR',
            text: 'This image does not match the DPI required.',
            back: 'Please try again',
          },
        },
      },
    },
  },
}
</script>

<script>
UPLOADCARE_LOCALE_TRANSLATIONS = {
  buttons: {
    choose: {
      files: {
        one: 'Upload',
        other: 'Upload'
      },
      images: {
        one: 'Upload',
        other: 'Upload'
      }
    }
  }
};
</script>

This is the HTML code:

<input
      type="hidden"
      role="uploadcare-uploader"
      data-images-only="true"
      data-max-width="590"
      data-max-height="786"
      data-dpi="72"
      name="Stock 1"
    />

I don’t know what’s wrong, is there someone that can sort this out? The validation works fine though :slight_smile: