fengyuanchen / cropperjs

JavaScript image cropper.
https://fengyuanchen.github.io/cropperjs/
MIT License
13.07k stars 2.41k forks source link

Setting CropperSelection area into Resizable=false, the behavior is not what you expected. #1200

Open gtechballesca opened 1 month ago

gtechballesca commented 1 month ago

Describe the bug Sample Code:

    const cropperSelection = this.cropper.getCropperSelection();
    if (cropperSelection) {
      cropperSelection.resizable = false;
    }

This is the code for setting the cropperselection not to be resized. But when you clip the edge of the selection area, you will be able to shrink the size, and then potentially the selection will be resized. So it defies the value you set for "resizable" property.

To Reproduce Steps to reproduce the behavior: (1) Follow the steps mentioned on this document on how to consume the CropperJS2 (2) Once you followed, try to get the "CropperSelection" object programmatically, as mentioned above in the description. (3) Set the "resizable" into false value (4) Setting this you can only scale or move the image in the selection area and this is expected. (5) But trying to clip one of the edge in the selection area, and hold it, you will be able to resize the "selection" area, it means it defies the expected behavior for the value you set for this property (resizable).

Expected behavior It should not resize the "selection" area in my own sense if the resizable is set to false.

fengyuanchen commented 3 weeks ago

Try cropperSelection.setAttribute('resizable', 'false') or cropperSelection.removeAttribute('resizable').