mnahkies / ng-qrcode

Easy to use AOT compatible QR code generator for Angular projects.
https://mnahkies.github.io/ng-qrcode/
MIT License
53 stars 10 forks source link

QRCode does not show when printed with NgxPrint #57

Open fadugyamfi opened 2 years ago

fadugyamfi commented 2 years ago

Similar to the issue reported here https://stackoverflow.com/questions/62400691/using-ngx-print-to-print-ngx-qrcode, the QRCode generated by this library is not visible when attempting to print a page.

The recommended solution per the stackoverflow article was to use toDataURL() and render and image instead of the canvas.

If there is a way to make it work with canvas it would be ideal, but if not, is it possible to update this library to provide the option to render out as an image instead?

mnahkies commented 2 years ago

Sorry for such a delayed response.

If I print the demo page via the normal browser print function it appears to work fine, and I can see there is an open issue with ngx-print indicating that it does not support canvas https://github.com/selemxmn/ngx-print/issues/105

I think the best solution would be to add support for canvas to the ngx-print library, as this feels like a generally useful enhancement to it that extends beyond the QR Code use case.

I'm open to the idea of supporting rendering to an image here as well, though I'm not 100% sure on the best way to achieve this, as the current implementation is a directive selecting a canvas element, eg:

@Directive({
  // eslint-disable-next-line @angular-eslint/directive-selector
  selector: `canvas[qrCode]`,
})
export class QrCodeDirective implements OnChanges {
...

Would need to have a think about how to do this cleanly, and I'm pretty stretched for time recently.