html5-qrcode icon indicating copy to clipboard operation
html5-qrcode copied to clipboard

Varying Results for new Html5Qrcode( ) based code

Open dbareis opened this issue 1 year ago • 3 comments

On Windows 11, I have a page that doesn't have a problem (except it has extreme issues scanning barcodes with HQ W11 webcam and on Android Smartphone) at "bungalookbursery.com.au". To help diagnose the issue I moved the relevant code to another page, where it doesn't work at all in chrome, the console log shows:

09:30:02.740 common.js Html5Qrcode.getCameras() - DEVICE LIST: Array(3) Looking for: Logitech Webcam C930e (046d:0843)
09:30:06.531 common.js Starting scanner: db1400dda3d1dd82c05fdd1832120473531fd96103520448046f26730de99eae

09:30:09.967 VM2214:96 Uncaught (in promise) NotAllowedError: The play method is not allowed by the user agent.
aElement.wrappedJSObject.play @ VM2214:96
handleHtmlMedia @ VM2214:108
apply @ VM2214:31
onbind @ VM2214:360
09:30:09.967 test:1 Uncaught (in promise) AbortError: The play() request was interrupted by a call to pause(). https://goo.gl/LdLk22

09:30:11.918 common.js ERROR: QR code parse error, error = D: No MultiFormat Readers were able to detect the code.
09:30:13.395 common.js Stopping scanner: db1400dda3d1dd82c05fdd1832120473531fd96103520448046f26730de99eae
09:30:13.396 common.js Stopped scanning

I am interacting with the page by clicking "a" and "button" tags with "onclick" handler. It has camera permissions (and the original page on same site & protocol works). Note that I don't use pause() anywhere.

In chrome the error happens every time I try to start it, if I use MS Edge, then it fails every second start attempt and works every other time.

A similar error (logs same 2 messages) occurs at "https://blog.minhazav.dev/research/html5-qrcode" when I load the page and it auto starts. But it doesn't detect the error so doesn't automatically stop.

  1. Chrome Version 128.0.6613.138 (Official Build) (64-bit)
  2. MS Edge: Version 128.0.2739.79 (Official build) (64-bit)

Screenshot @ 16_09_2024 , 9_48_18 AM, Chrome Legacy Window_HTML5 QR Code Scanner Demo _ Minhaz’s Blog - Google Chrome +

dbareis avatar Sep 15 '24 23:09 dbareis

I copied the code from "https://media-play-promise.glitch.me/" and have no trouble playing the video. My button still fails after video plays.

dbareis avatar Sep 16 '24 02:09 dbareis

I noticed another difference: When I have a breakpoint at where I display the message "QR code parse error, error = D: No MultiFormat Readers were able to detect the code." (promise - error):

  1. in Edge it is now failing every time but the camera shows as working on screen
  2. in Chrome it is still failing every time but the camera shows as working on screen and no longer longer shows grey (as per above picture).

Setting "data.debug" to true adds TRACE() messages to the log (notive no "NotAllowedError" etc):

09:39:05.252 VM1276:357 ### onElementBinding - tag: video id:  loc: https://bungalooknursery.com.au/test ###
09:39:05.252 VM1276:75 ### handleElement html5 media - tag: video id: dummyid54 autoplay: false preload: "none" poster: false paused: false ###
09:39:23.563 VM1276:93 ### dummyid54.play(0) - force: false state: 0 user: true ###

09:39:23.564 [Violation] 'flashstop:bind' handler took 18309ms

09:39:23.565 VM1276:106 ### dummyid54 released... ###
09:39:37.585 common.js QR code parse error, error = D: No MultiFormat Readers were able to detect the code.

In Chrome back to grey, I assume the edge changed something but I can't reproduce it... Edge still "workish" apart from "D: No MultiFormat Readers were able to detect the code".

dbareis avatar Sep 16 '24 23:09 dbareis

If I ignore the error "QR code parse error, error = D: No MultiFormat Readers were able to detect the code" then:

  • scanning works well and fast in Android
  • works in MS Edge (except it is hard to scan a code - my original issue on Chrome)
  • Words well and fast in the DuckDuckGo browser
  • Still fails in Chrome.

So these are the bugs?:

  • The library doesn't detect failures such as "Uncaught (in promise) NotAllowedError: The play method is not allowed by the user agent" and continues as if the scanning is working.
  • The library generates a promise error when it shouldn't (it is not an error but info?).
  • It not working at all on Chrome (perhaps a Chrome bug?)
  • My original scanning issue on desktops (almost impossible to get it to recognise QR bar codes) It seems it might only be an issue with small QR codes such as my 87x87 ones, my 164x174 seem to scan OK

dbareis avatar Sep 17 '24 04:09 dbareis