No Log

[msi-matthew]

I have a canvas that gets populated with "image" data for lack of a better term, and am trying to run a barcode scan on it.

<canvas id="pic"></canvas>
<paper-button on-tap="scanBarcode"></paper-button

...

  async scanBarcode() {
    const barcodeDetector = new BarcodeDetector({
      formats: [
        'code_128',
      ]
    });
    try {
        const barcodes = await barcodeDetector.detect(this.$.pic);
        barcodes.forEach(barcode => console.log(barcode));
    } catch (e) {
      console.error('Barcode detection failed:', e);
    }
  }

Using this.$.pic nothing is logged to the console (I would expect null, undefined, or a result.

When I try this.$.pic.toDataURL("image/png") I get the following error:

home.html:168 Barcode detection failed: TypeError: Failed to execute 'detect' on 'BarcodeDetector': The provided value is not of type '(HTMLImageElement or SVGImageElement or HTMLVideoElement or HTMLCanvasElement or Blob or ImageData or ImageBitmap or OffscreenCanvas)'

What data type or DOM attribute must be passed into barcodeDetector.detect() to parse the image?

I'm not sure what form HTMLImageElement or HTMLCanvasElement take.

[tomayac]

Sorry, but this is not a support forum. Please in the future ask such questions on a platform like StackOverflow.

In your case, simply no barcode is being detected I guess, so you're iterating over an empty array. If this.$.pic is an <img>, then it doesn't have a toDataURL() function, which explains the error in your second attempt. The <img> itself should work. Try testing it with a different image, or on a different platform (Chrome on Android works best from my limited experience).

[msi-matthew]

OK. Moved issue to https://stackoverflow.com/questions/54713037/what-object-should-be-passed-into-the-chrome-shape-detection-api-to-parse-barcod

[msi-matthew]

As an aside, the barcode detection module seems to be broken on macOS Chrome (Version 72.0.3626.109 (Official Build) (64-bit)).

The demo at (https://shape-detection-demo.glitch.me/) is returning an empty array for the QR code, and in my project I get the same behavior when trying to scan a Code 128 barcode.

QR Demo is working on Chrome Android and Canary Android.

[tomayac]

There was a regression regarding barcodes on macOS Chrome (71 or 72, don’t remember exactly), it has been fixed since.

[msi-matthew]

OK.

Thank you for all your help this week and the excellent demos you put together!