Canvas Events Not Functioning Correctly on iOS Devices, Working as Expected on Android

[Arkit-Sutariya]

I’m working with Angular 18.2.0 and Fabric.js 6.3.0 to implement an image cropping functionality in my editor page using a third-party JS library. The cropping feature is triggered when the user double-clicks on the canvas. This functionality works perfectly on web browsers and Android devices in Chrome, but I’m facing issues on iOS devices (Safari and Chrome).

Here's a summary of the logic implemented:

`ngOnInit() {
this.canvas = new Canvas('canvas', {
fireRightClick: true,
enablePointerEvents: true,
});
this.canvas.on({
'mouse:dblclick': (e) => {
this.listener = new FabricCropListener(this.canvas);
this.listener.crop();
},
'touchstart': (e) => {
this.cropImage();
},
'pointerdown': (e) => {
this.cropImage();
}
});
}

cropImage() {
this.listener = new FabricCropListener(this.canvas);
this.listener.crop();
}
`

The code works seamlessly on web and Android devices using Chrome, but when testing on iOS devices (Safari and Chrome), the double-click logic fails to trigger the cropping functionality.

If anyone has encountered a similar issue or has any suggestions on how to resolve this, I’d greatly appreciate your input.