adamalfredsson
video is blank when granted camera permissions for the first time
I notice that in dev mode (my case Nextjs) newly granting camera permission result in empty <video> (white box),
but in production mode things work fine.
Is there just a delay or does the stream not start at all? Have you got any clues?
@nomadoda streaming not starting at all (square with the green border is the video element)
@nomadoda I noticed if you change something in the DOM, which causes a HMR, after that video feed is visible.
Just giving my 2 cents. I had this same issue and i believe its because of the timing of how things happen. The way I solved it is I made a separate component with the video and useZxing and I only render this component if there are permissions already given. This completely resolved the issue.
Just giving my 2 cents. I had this same issue and i believe its because of the timing of how things happen. The way I solved it is I made a separate component with the video and useZxing and I only render this component if there are permissions already given. This completely resolved the issue.
Could you please share your code? I tried getting the permissions in advance with navigator.mediaDevices.getUserMedia({ video: true }), and then conditionally show the scanner component, but it still gave me the error above, and then a bunch of "No MultiFormat Readers were able to detect the code." errors. If the scanner is rendered on app start, it works correctly.
@lenard-a there it is: https://github.com/Shelf-nu/shelf.nu/blob/main/app/routes/_layout%2B/scanner.tsx#L51-L91 Hope that helps.
Thank you! I realized that disabling StrictMode makes it happen much less frequent, but I will check your code to fully fix the issue.