Minimum height/width not respected on mobile if user "taps" the image

[mikemarian]

trafficstars

Hi, I'm seeing an issue where although we've defined a minimum height/width (and a fixed aspect ratio if that matters), on mobile - specifically iPhone Safari - if the user "taps" the screen, the user is able to select a very small area of a few pixels by a few pixels.

If the user tries to drag/select an area, there are no issues, but any ideas how we can prevent the "tap" from bypassing these requirements?

If you drag, it enforces the minimums:

If you "tap", it does not:

Thanks!

Mike

[DominicTobias-b1]

@mikemarian what version are you using, latest?

I can't repro it on Safari with the latest version. Crop params:

<ReactCrop
  src={this.state.src}
  crop={this.state.crop}
  onImageLoaded={this.onImageLoaded}
  onComplete={this.onCropComplete}
  onChange={this.onCropChange}
  onDragStart={this.onDragStart}
  onDragEnd={this.onDragEnd}
  minWidth={300}
  minHeight={300}
/>

[mikemarian]

Hi @DominicTobias-b1 thanks for taking a look!

We just upgraded to 8.6.9 ( we were on 8.6.6) and the issue still persists.

We're using the same params as above, with a couple changes for the sake of the flow its being used for:

<ReactCrop
                minWidth={300}
                minHeight={205}
                src={this.state.src}
                crop={!this.state.defaultImage ? this.state.crop : {}}
                disabled={this.state.defaultImage}
                ruleOfThirds
                onImageLoaded={this.onImageLoaded}
                onComplete={this.onCropComplete}
                onChange={this.onCropChange}
                onDragStart={this.onDragStart}
                onDragEnd={this.onDragEnd}
              />

Just to clarify, the issue of being able to select a single pixel is only if you tap outside of where the crop selector already exists. If you tap the area that is already selected, it is not an issue.

Thanks,

Mike

[DominicTobias-b1]

Just to clarify, the issue of being able to select a single pixel is only if you tap outside of where the crop selector already exists. If you tap the area that is already selected, it is not an issue.

Aha thanks

[dominictobias]

Hi please try 8.6.10

While checking this I noticed that when using minWidth/minHeight aspect crops can only be drawn left->right in a downwards motion - raised https://github.com/DominicTobias/react-image-crop/issues/428