Uncaught SyntaxError: await is only valid in async function

[msi-matthew]

Using a code block from Shape Detection API notes (https://developers.google.com/web/updates/2019/01/shape-detection) inside a Polymer 2.x application shell, I get the following error:

Uncaught SyntaxError: await is only valid in async function

ready() {
  super.ready();
  this.initImageDetection();
}

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

Is the Shape Detection API compatible with Polymer 2.x?

Is the Shape Detection API compatible with Chrome on macOS?

[msi-matthew]

When removing the await command I get the error:

Uncaught ReferenceError: BarcodeDetector is not defined

[tomayac]

Uncaught SyntaxError: await is only valid in async function

The error message is actually pretty good :-) You need to make your initImageDetection() asynchronous: async initImageDetection(). This is unrelated to the Shape Detection API.

[msi-matthew]

Note: After enabling async behavior, the Experimental Web Platform features chrome flag also needs to be enabled to utilize this feature.