Adding assetImageDimensions to content model breaks the UI

I used the contentful-migration tool to deploy a content model and after the deployment Author UI does not work anymore.

To reproduce:

  1. Run the script

     module.exports = function (migration) {
       const sideBannerImage = migration.createContentType('sideBannerImage')
       sideBannerImage.name('Side banner image')
       sideBannerImage.description('Side banner image')
       sideBannerImage.displayField('name')
    
       sideBannerImage
         .createField('image')
         .name('Image')
         .type('Link')
         .linkType('Asset')
         .localized(true)
         .required(true)
         .disabled(false)
         .omitted(false)
         .validations([
           {
             'linkMimetypeGroup': [
               'image'
             ]
           }
         ])
     }
    
  2. Run the script that adds image dimension validation

     module.exports = function (migration) {
       const sideBannerImage = migration.editContentType('sideBannerImage')
    
       sideBannerImage
     .editField('image')
     .validations([
       {
         'linkMimetypeGroup': [
           'image'
         ]
       },
       {
         'assetImageDimensions': {
           'width': {
             'min': 300,
             'max': 300
           }
         },
         'message': 'Image asset must satisfy dimension bounds, width: 300'
       }
     ])
     }
    
  3. Go to the Author UI and try to change the sideBannerImage content models image field

Hi @kalver.kilvits,

Could you inspect your browser session and let us know which requests fail and what’s the error status and message associated with them? (omitting any sensitive credentials, of course)

bugsnag sends this stacktrace, maybe it’s of help

stacktrace: TypeError: Cannot read property 'min' of undefined
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:3836265
    at Object.<anonymous> (https://static.contentful.com/app/application-ea72d758ff.min.js:1:3836553)
    at Object.invoke (https://static.contentful.com/app/application-ea72d758ff.min.js:1:435803)
    at C.instance (https://static.contentful.com/app/application-ea72d758ff.min.js:1:466382)
    at ue (https://static.contentful.com/app/application-ea72d758ff.min.js:1:458514)
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:452464
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:452481
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:451732
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:454508
    at r (https://static.contentful.com/app/application-ea72d758ff.min.js:1:452601)
    at E (https://static.contentful.com/app/application-ea72d758ff.min.js:1:457623)
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:566675
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:519941
    at u.$digest (https://static.contentful.com/app/application-ea72d758ff.min.js:1:520597)
    at u.$apply (https://static.contentful.com/app/application-ea72d758ff.min.js:1:522288)
    at d.<anonymous> (https://static.contentful.com/app/application-ea72d758ff.min.js:1:4250093)
    at t (https://static.contentful.com/app/application-ea72d758ff.min.js:1:2669390)
    at https://static.contentful.com/app/application-ea72d758ff.min.js:1:2651194
    at a.bugsnag (https://d2wy8f7a9ursnm.cloudfront.net/bugsnag-3.min.js:1:220)
    at https://d2wy8f7a9ursnm.cloudfront.net/bugsnag-3.min.js:1:13027

I figured out the problem from the stacktrace aswell. Removing the height in migration script will produce the error

Error:

'assetImageDimensions': {
  'width': {
    'min': 300,
    'max': 300
  }
}

No error:

'assetImageDimensions': {
  'width': {
    'min': 300,
    'max': 300
  },
  'height': {
    'min': null,
    'max': null
  }
}