Image become totally green after taking selfie

[codebarz]

Please follow the general troubleshooting steps first:

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

Bug reports:

There is an issue where the image shows a green background on certain devices after taking selfies with the library. I have tested this use the codepen demo here https://codepen.io/mozmorris/pen/gOOoqpw and attached below is the screenshot

The browser this was taken from is google chrome mobile and device is Infinix HOT 8

This is my code sample in react

 const webcamRef = useRef<Webcam>(null);

const captureSelfie = useCallback(() => {
    const imgSrc = webcamRef.current!.getScreenshot();
    if (imgSrc) setFormValues((prev) => ({ ...prev, selfie_image: imgSrc }));
  }, [webcamRef]);

<Webcam audio={false} ref={webcamRef} screenshotFormat="image/jpeg" />

<Button
      type="button"
      onClick={() => {
      if (!formValues.selfie_image) {
            captureSelfie();
      } else {
            setFormValues((prev) => ({ ...prev, selfie_image: "" }));
       }
      }}
>
      {formValues.selfie_image ? "Retake Selfie" : "Capture Selfie"} <Camera />
</Button>

[The-Lone-Druid]

Have you found the solution, because I'm facing the same issue as well...