kozakdenys / qr-code-styling

Automaticly generate your styled QR code in your web app.
https://qr-code-styling.com
MIT License
1.56k stars 497 forks source link

Center image does not render on first render in Safari #257

Open Scooter1337 opened 1 week ago

Scooter1337 commented 1 week ago

Center image does not render on first render in Safari

I've tried with base64 to rule out any CORS issues etc, but it still does not work sadly.

Scooter1337 commented 1 week ago

I seem to have kind of circumvented the issue very dirtily as follows:

const qrCode = ...;
await getRawData();

if (navigator.userAgent.indexOf("Safari") !== -1) {
      // weird bug where safari fails to render the image in the first call
      await new Promise((resolve) => setTimeout(resolve, 500));

      const qrCode = new QRCodeStyling({
        // ... reinstantiating class seems to be necessary
      });

      return (await qrCode.getRawData("png")) as Buffer | Blob;
    }

If I remove the setTimeout, it starts occurring again, same goes for the reinstantiated class

NOTE: lower values for the promise probably work too