@capacitor/camera - PWA in iOS: Camera rotate in landscape mode and bad quality of photo

[SOAPeople-anisabdelkabir]

Capacitor Version

npx cap doctor
Capacitor Doctor

Latest Dependencies:

@capacitor/cli: 8.0.0
@capacitor/core: 8.0.0
@capacitor/android: 8.0.0
@capacitor/ios: 8.0.0

Installed Dependencies:

@capacitor/android: not installed
@capacitor/ios: not installed
@capacitor/cli: 4.7.3
@capacitor/core: 4.7.3

FYI: we are working with web version only

Other API Details

node -v
v22.20.0
 
npm -v 
10.9.3

Platforms Affected

• iOS
• Android
• Web

Current Behavior

I noticed that since IOS 18 (didn't test for versions before), picture rotation and quality degradation

happens after the picture is taken when the IPad is in landscape mode : In fact, when you turn the IPad in landscape mode the camera turn also but the width is smaller than expected and after you click on the take picture button, then you see the image rotated 90 degree before even you confirm it.

In addition, when you take a picture with the camera, before clicking on the "take picture" button, the image is of standard quality. Once you confirm, it's getting darker and cropped.

Here is screenshots for portrait mode which is OK and landscape mode which is KO:

Portrait before confirm:

portrait after confirm:

Landscape before confirm:

Landscape after confirm:

Expected Behavior

The camera should behave like the native app of IOS do, when you turn to landscape and also when you go back to portrait mode

Project Reproduction

The issue could be reproduced by any PWA application that uses the camera: for example try https://85m2c-5173.csb.app/tab1/ in IOS device and you will be able to reproduce the issue

Additional Information

The issue is the same in web browser or installed mode.
It is also present for PWA app with react, angular or any other language

[ionitron-bot]

This issue has been labeled as type: bug. This label is added to issues that that have been reproduced and are being tracked in our internal issue tracker.