fengyuanchen / cropperjs

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

Click and resize not working on Chrome installed on Ubuntu Virtual Box VM #898

Open bemineni opened 2 years ago

bemineni commented 2 years ago

Describe the bug I have been working on react project for the some time and I started using React cropper. The functionality was working fine a month back. My development enironment is on Linux Mint installed on Virtual Box(6.1.30) and the Chrome version I am using is 96.0.4664.45 (Official Build) (64-bit). Yesterday I noticed that I cannot move the image or resize the crop area on chrome. I tested the same on Firefox on the same Linux mint virtual machine and its works fine. I am not sure which update caused this issue, Virtual Box or Chrome

The same issue shows up on https://fengyuanchen.github.io/cropperjs/ demo link

I dont see the issue on chrome on my host Windows desktop. Installed a new Ubuntu VM and I see the same issue on chrome.

Other options I tried

  1. Installed new version of the chrome on Liniux Mint 96.0.4664.110 (Official Build) (64-bit)
  2. Updated Virtual box Guest addional tools

I am not sure where the is the problem, is it with Chrome, Virtual box or the Debian based OS

To Reproduce Steps to reproduce the behavior:

  1. Install Virtual box
  2. Install Ubuntu 20.04 or Linux Mint
  3. Install Chrome
  4. Open https://fengyuanchen.github.io/cropperjs/
  5. Try to resize the crop area.

Expected behavior Should be able to move the image or resize the crop area.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context Add any other context about the problem here.

bemineni commented 2 years ago

@fengyuanchen Can you please provide your comments on this issue ?

fengyuanchen commented 2 years ago

It is difficult for me to reproduce your working environment, you may need to debug it yourself.

bemineni commented 2 years ago

This doesn't need my environment

  1. Download publicly available VirtualBox and install on Windows OS
  2. Install publicly available Ubuntu 20.4 on the Virtual Box VM
  3. Install latest Chrome version on Ubuntu
  4. Open your demo website https://fengyuanchen.github.io/cropperjs/
  5. Try to resize the crop area

This seems to be a problem with VirtualBox

I have moved on to VMware workstation.

hamedpro commented 2 years ago

I have the same issue on ubuntu 22.04.1 installed inside a virtual box inside windows 10. this website mentioned is working good in chrome on host machine (windows 10) and also in firefox inside the virtual ubuntu but not in the latest chrome inside the virtual box (Version 104.0.5112.79 (Official Build) (64-bit))

colinstantos commented 4 months ago

This still happens on virtual box, the issue seems to always happen when the mouse is not fully captured by virtualbox. Tried some chrome extensions that take area screenshots just to see if it's a more general issue or not, and it seems that for those extensions it works.

Also if the mouse is captured by VB it works correctly(as in you need to press the host-key to realase the mouse from the box). I am using this library for a software that will be mostly used inside VB sadly and would appreciate a fix/workaround/suggestion anything really :)

Tried also the demo for v2 and the issue is the same