Unable to scan barcodes on iPhone SE 2016

[olefjaerestad]

Hi,

I searched through the issues, but couldn't find this exact one. Do let me know if there's already an identical issue, and if so, this one can be closed.

Using Quagga.decodeSingle, no barcode is detected on my iPhone SE 2016 edition, neither in Safari 15.2 nor Chrome 99. This is the code:

await Quagga.decodeSingle({
  src: imageSrc,
  decoder: {
    multiple: true,
  },
  readers: ["ean_reader"],
  locator: {
    halfSample: true,
    patchSize: 'small',
  },
  inputStream: {
    size: 1280,
  }
});

Where imageSrc is a PNG data URI. You can get the URI from this codepen and the PNG itself from here. The image was taken with the rear camera on said iPhone SE. It's an ean_13 code. The returned result is null. I get the same result using Quagga.init directly. Using the exact same code and image works well in Chrome 99 on macOS.

What's even more interesting is that using the following code with the original library seems to work fine (in the sense that it at least returns an array of 1 box):

Quagga.decodeSingle({
  src: imageSrc,
  decoder: {
    multiple: true,
  },
  readers: ["ean_reader"],
  locator: {
    halfSample: true,
    patchSize: 'small',
  },
  inputStream: {
    size: 1280,
  }
}, (barcode) => alert(JSON.stringify(barcode)));

Indicating that some change in Quagga2 has affected the behaviour. I'm able to use the original library for now, but in the long run I'd prefer to upgrade to v2, as I really enjoy the typescript typings and the fact that it seems to be well maintained.

Image recognition is by no means something I'm good at, but I've done some high-level debugging and found a couple of potentially relevant things:

• context.inputImageWrapper: All values are 255 on macOS (where it works) and 0 on iPhone (where it doesn't work).
• If imageSrc is a URL.createObjectURL(myBlob) instead of a data URI, context.boxSize seems to be flipped on iPhone. Value on macOS (where it works): [{"0":0,"1":0},{"0":0,"1":1280},{"0":960,"1":1280},{"0":960,"1":0}]. Value on iPhone (where it doesn't work): [{"0":0,"1":0},{"0":0,"1":960},{"0":1280,"1":960},{"0":1280,"1":0}]. Not sure if this is relevant, but thought I'd mention it. This also matches the behaviour I'm seeing in the example at https://serratus.github.io/quaggaJS/examples/file_input.html on my iPhone; the uploaded image is flipped. EDIT: Using the code snippet provided in this stackoverflow answer, I was able to extract the image rotation value from the image file EXIF metadata. It's -1 on macOS and 6 on iPhone, which might explain why the image is rotated on iPhone. No idea why it's different across devices though.

Let me know if I can provide any more info to support debugging. Keep up the good work!

[github-actions[bot]]

Thank you for filing an issue! Please be patient. :-)

[ericblade]

OK, this is some great information. This is going to take me a little bit of time to unpack.

My first question -- do you have a data URI that decodes properly? If so, could you also supply that, so that I can add a working data URI test to the test suite, and perhaps the non-working one as well, which might also shed some light on where a difference lies?

I'm going to take a deeper dive into the information you've provided, and will probably have more questions.

Thank you!

[ericblade]

er.. are you saying this affects every barcode on this particular model device, or is it specific ones like this example that are failing?

[olefjaerestad]

Sorry for the late reply here. I've been unsuccessful in recreating the issue. Not sure why it would start working all of a sudden. You can consider this issue solved. I'll create a new issue (with more specific steps to reproduce) if the issue reoccurs. Once again, thanks for the work you're doing!