Could not acquire the stream

Please follow the general troubleshooting steps first:

[x] Is your app running over HTTPS? (please provide the URL if possible) => localhost
[ ] Have you tried running the demo (https://codepen.io/mozmorris/pen/JLZdoP) on your device?
[ ] Checked the latest "Can I use" compatbility table? (https://caniuse.com/stream)

Bug reports:

When I try to run the demo in my project, no video stream appears (without logging any error).
When I run the demo in my browser from codepen, everything works fine.

I realized that the issue was coming from requestUserMedia and that step by step debugging could lead to a working camera stream (?!?). Tested on firefox (94.0 (64-bit) Linux) and chrome (Version 94.0.4606.81 (Build officiel) Fedora Project (64 bits)).

Then, I noticed that unmounted / mounted were called several times in a row when the component is first mounted, but the unmounted property was only set to true and never to false (I don't know react enough to estimate if this should happen).

Here are the dependencies of my project:

  "dependencies": {
    "@testing-library/jest-dom": "^5.16.3",
    "@testing-library/react": "^12.1.4",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.0.0",
    "react-dom": "^18.0.0",
    "react-player": "^2.10.0",
    "react-scripts": "5.0.0",
    "react-webcam": "^7.0.0",
    "web-vitals": "^2.1.4"
  },

I guess this is caused by some new react way of handling stuff.

Features:

Solved doing this : https://github.com/mozmorris/react-webcam/pull/343

mozmorris / react-webcam