ngx-scanner

ngx-scanner copied to clipboard

Describe the bug We were using scanner on one of our angular routes. After moving to another route camera sometimes remain working on Chrome and always on Safari

To Reproduce Steps to reproduce the behavior:

1. Go to the example to reproduce https://stackblitz.com/edit/angular-tyqjz9?file=src%2Fapp%2Fscanner%2Fscanner.component.ts
2. Just navigate between home and scanner routes via links in the bottom.

Expected behavior Camera should be turned off after scanner component has been destroyed.

Desktop (please complete the following information):

• OS: macOS Mojave 10.14.4
• Browser [Safari 12.1]

Your StackBlitz demo is not working:

The core-js dependency never gets installed.

@odahcam, I see. I'll fix it today.

I could reproduce it with the current demo (v2.0.0), but the StackBlitz demo would be handful anyway. Thanks.

Edit: I did not reproduced this issue before, I was mistaken here.

StackBlitz demo is fixed for now

Looks like the device is not released when the component gets destroyed before finish fetching the device.

Probably the Promise stills alive and the then generated code gets called even after the component is destroyed, keeping the device instead of releasing it.

To fix that we could check for some control variable before proceeding and if we verify the component was destroyed, the code should clean the device reference releasing it.

^bump - Any update on this?

Any resolution to this problem? I have the same problem, the scanner reads a string and a navigation is executed but the camera stays on, even when I call scanner reset .

Hey guys, any progress on this front? i tried a bunch of things to work around this to no avail...

~Okay i found one not so ideal workaround, but is considerably a better user experience than what was happening (seeing the webcam light on and showing recording on the tab). It involves blocking for 2000ms route changes or any other events that causes the component to be destroyed while the scanner is just initializing. This gives it enough time to fetch the device (camera) completely as this issue only occurs (chrome) when you destroy the component in that time frame.~

Soooo instead of what I said above (silly me) I have a different workaround that is more in tune with the problem at hand.

The issue is that the reset method that is run in the ondestroy hook of this libs component has no effect at the moment its destroyed while still activating the camera. In my wrapping component I handle it in my on ondestroy hook by running scanner reset again for good measure in a setTimeout of 2000ms.

I still don't understand if I can listen to some event telling me that the camera is completely active, allowing me to run reset at that moment, which would be better than some chosen hardcoded time delay.

Anyway, if the first reset (inside the ngOnDestroy of the lib component) works, then the camera is turned off immedetiately. Otherwise the backup one in my component will try again 2 seconds later.

Hi, Any resolution to this problem?

The problem is still present (Windows 11 23H2 x64, Chrome 121.0.6167.185 & Firefox 122.0.1).