Undefined error in prepareCaptureCanvas method, if scanner is closed within scanDelay time after scanning a QR code successfully

Bug, feature request, or proposal:

What am I trying to do: I open an overlay to scan the QR code and when it was scanned successfully, I want to immediately close it. If I do that through the scanSuccess callback, it will throw an error that “this.imageElement.naturalWidth” is undefined

What is the expected behavior?

After a successful scan, I want to be able to immediately stop scanning and/or hide the entire scanner without any errors being thrown.

What is the current behavior?

After a successful scan, if I stop scanning immediately, it will throw an error “Cannot read property ‘naturalWidth’ of undefined” in the prepareCaptureCanvas method on the imageElement. This is because of

What are the steps to reproduce?

Here you can test both scenarios, once with the delay and once without, to see that the same code works as long as I wait after scanning and it does not, once I immediately stop scanning. https://zxing-ngx-scanner-n5hoke.stackblitz.io/

Which versions of Angular, ngx-scanner, OS, TypeScript, browsers are affected?

Tested with Angular 4 and Angular 5, ngx-scanner 1.0.5 OS, TS version and browser are no factor.

Is there anything else we should know?

A suggestion on how to “fix” it, is to let it silently fail in the beginning of the decode method, if neither videoElement nor imageElement are found, e.g.: if (undefined === this.videoElement && undefined === this.imageElement) return;

[xtj7]

Thanks a lot guys! And also: great work on the ngx-scanner 😃

[werthdavid]

Sorry guys, little time atm… I don’t exactly remember what I thought when I initially implemented the timeout but if I remember correctly my intention was to prevent the scanner to pass a result to the output multiple times after an successful scan e.g. the user points the camera to the code for 1s and the result is outputted 3 times (that was the case with my Android App that uses ZXing Java).