How to set up react-qr-reader to show scan window in iPhone?

Question

Using react-qr-reader library in my React / Next.js app: https://www.npmjs.com/package/react-qr-reader

Found no relevant options for constraints in docs. Maybe it is a sideeffect with latest iOS it does not show scan window?

Initiating QrReader like this:

<QrReader onResult={scanResult} constraints={{facingMode: 'environment'}} />

But camera scan window does not appear, only that small red icon indicate, I started to open it. Why?

Answer 1

Try adding style={{ width: '100%' }}, as in the example here: https://www.npmjs.com/package/react-qr-reader