ionic-team / pwa-elements

Quality UI experiences for Web APIs that require custom UI (such as media/camera).
https://medium.com/@maxlynch/building-the-progressive-web-app-os-57daebcb69c1
MIT License
168 stars 50 forks source link

Switching camera (e.g. Front to Rear) is not working in Safari #74

Closed jankal13 closed 2 years ago

jankal13 commented 3 years ago

I'm submitting a ... (check one with "x") [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://stencil-worldwide.slack.com

Current behavior: When clicking the camera rotate (div.rotate) button in Safari 14.0.1, the screen becomes black and the camera stops working. Switching back (to the front camera) is not possible.

Expected behavior: I would expect that similarly to e.g. Chrome, the camera cannot be switched if only one camera is detected.

Steps to reproduce:

  1. Use pwa-elements in Safari
  2. Start camera
  3. Click Screenshot 2020-12-20 at 14 19 08
  4. Black screen comes up Screenshot 2020-12-20 at 14 19 59

Related code: Not needed. It's reproducible when using 'npm run start' on pwa-elements' main branch.

Other information: The console will give out the following error: [Error] TypeError: undefined is not an object (evaluating 'c.facingMode[0]') rotate (pwa-camera.entry.js:404) (anonymous function) (pwa-camera.entry.js:185)

Suggested solution: Add && facingMode !== undefined solves the problem:

Screenshot 2020-12-20 at 14 27 25