Merge pull request #478 from ericblade/dev

CameraAccess: enableTorch and disableTorch will re-throw errors, also post a log warning if torch is not supported

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ericblade/quagga2",
-  "version": "1.8.0",
+  "version": "1.8.1",
   "description": "An advanced barcode-scanner written in JavaScript",
   "main": "lib/quagga.js",
   "types": "type-definitions/quagga.d.ts",
@@ -76,6 +76,7 @@
     "build:dev": "npx cross-env NODE_ENV=development BUILD_ENV=development webpack --config configs/webpack.config.js",
     "build:prod": "npx cross-env NODE_ENV=production BUILD_ENV=production webpack --config configs/webpack.config.min.js",
     "build:node": "npx cross-env NODE_ENV=production BABEL_ENV=commonjs BUILD_ENV=node webpack --config configs/webpack.node.config.js",
+    "build-new": "npx cross-env NODE_OPTIONS=--openssl-legacy-provider npm run build",
     "build": "npm run check-types && npm run build:dev && npm run build:prod && npm run build:node",
     "watch": "npx cross-env BUILD_ENV=development webpack --watch",
     "lint": "eslint src",

src/analytics/result_collector.ts

@@ -1,5 +1,5 @@
 import ImageDebug from '../common/image_debug';
-import {
+import type {
     QuaggaJSCodeResult,
     QuaggaJSResultCollector,
     QuaggaJSResultCollectorFilterFunction,
@@ -29,7 +29,7 @@ interface ResultCollector {
 export default {
     create(config: QuaggaJSResultCollector): ResultCollector {
         const canvas = document.createElement('canvas');
-        const ctx = canvas.getContext('2d') as CanvasRenderingContext2D;
+        const ctx = canvas.getContext('2d', { willReadFrequently: !!config.willReadFrequently }) as CanvasRenderingContext2D;
         const results: Array<QuaggaJSCodeResult> = [];
         let capacity = config.capacity ?? 20;
         const capture = config.capture === true;

src/common/cv_utils.js

@@ -563,6 +563,7 @@ export function loadImageArray(src, callback, canvas = document && document.crea
         canvas.width = this.width;
         // eslint-disable-next-line no-param-reassign
         canvas.height = this.height;
+        console.warn('* loadImageArray getContext 2d');
         const ctx = canvas.getContext('2d');
         ctx.drawImage(this, 0, 0);
         const array = new Uint8Array(this.width * this.height);

src/common/image_wrapper.ts

@@ -222,6 +222,7 @@ class ImageWrapper implements SparseImageWrapper {
 
     // Display this ImageWrapper in a given Canvas element at the specified scale
     show(canvas: HTMLCanvasElement, scale = 1.0): void {
+        console.warn('* imagewrapper show getcontext 2d');
         const ctx = canvas.getContext('2d');
         if (!ctx) {
             throw new Error('Unable to get canvas context');
@@ -248,6 +249,7 @@ class ImageWrapper implements SparseImageWrapper {
         const whiteRgb = [255, 255, 255];
         const blackRgb = [0, 0, 0];
         let result = [];
+        console.warn('* imagewrapper overlay getcontext 2d');
         const ctx = canvas.getContext('2d');
         if (!ctx) {
             throw new Error('Unable to get canvas context');

src/common/subImage.ts

@@ -30,6 +30,7 @@ export class SubImage {
 
     // Displays the {SubImage} in a given canvas at a given scale
     show(canvas: HTMLCanvasElement, scale = 1.0): void {
+        console.warn('* subImage.show getcontext 2d');
         const ctx = canvas.getContext('2d');
         if (!ctx) {
             throw new Error('Unable to get canvas context');

src/decoder/barcode_decoder.js

@@ -68,6 +68,7 @@ export default {
                         $debug.appendChild(_canvas.dom.frequency);
                     }
                 }
+                console.warn('* barcode decoder initCanvas getcontext 2d');
                 _canvas.ctx.frequency = _canvas.dom.frequency.getContext('2d');
 
                 _canvas.dom.pattern = document.querySelector('canvas.patternBuffer');

src/input/camera_access.ts

@@ -137,15 +137,29 @@ const QuaggaJSCameraAccess: CameraAccessType = {
         // TODO: should we acquire camera access even if there's no current camera open?
         // TODO: what happens on iOS or another device where torch isn't supported at all? Should we throw an error?
         if (track) {
-            await track.applyConstraints({ advanced: [{ torch: false }] } as MediaTrackConstraintSet);
+            try {
+                await track.applyConstraints({ advanced: [{ torch: false }] } as MediaTrackConstraintSet);
+            } catch (err) {
+                if (err instanceof OverconstrainedError) {
+                    console.warn('quagga2/CameraAccess: Torch not supported on this device');
+                }
+                throw err;
+            }
         }
     },
     async enableTorch() {
         const track = getActiveTrack();
         // TODO: should we acquire camera access even if there's no current camera open?
         // TODO: what happens on iOS or another device where torch isn't supported at all? Should we throw an error?
         if (track) {
-            await track.applyConstraints({ advanced: [{ torch: true }] } as MediaTrackConstraintSet);
+            try {
+                await track.applyConstraints({ advanced: [{ torch: true }] } as MediaTrackConstraintSet);
+            } catch (err) {
+                if (err instanceof OverconstrainedError) {
+                    console.warn('quagga2/CameraAccess: Torch not supported on this device');
+                }
+                throw err;
+            }
         }
     },
 };

src/input/frame_grabber_browser.js

@@ -44,6 +44,7 @@ FrameGrabber.create = function (inputStream, canvas) {
     _canvas = canvas || document.createElement('canvas');
     _canvas.width = _canvasSize.x;
     _canvas.height = _canvasSize.y;
+    console.warn('*** frame_grabber_browser: willReadFrequently=', willReadFrequently, 'canvas=', _canvas);
     _ctx = _canvas.getContext('2d', { willReadFrequently: !!willReadFrequently }); // double not because we have an optional bool that needs to pass as a bool
     _data = new Uint8Array(_size.x * _size.y);
     if (ENV.development) {

src/locator/barcode_locator.js

@@ -94,7 +94,9 @@ function initCanvas() {
     if (ENV.development && _config.debug.showCanvas === true) {
         document.querySelector('#debug').appendChild(_canvasContainer.dom.binary);
     }
-    _canvasContainer.ctx.binary = _canvasContainer.dom.binary.getContext('2d');
+    const willReadFrequently = !!_config.willReadFrequently;
+    console.warn('* initCanvas willReadFrequently', willReadFrequently, _config);
+    _canvasContainer.ctx.binary = _canvasContainer.dom.binary.getContext('2d', { willReadFrequently });
     _canvasContainer.dom.binary.width = _binaryImageWrapper.size.x;
     _canvasContainer.dom.binary.height = _binaryImageWrapper.size.y;
 }

src/quagga/initCanvas.ts

@@ -1,6 +1,6 @@
 import { QuaggaContext, CanvasContainer } from 'QuaggaContext';
-import type { XYSize } from '../../type-definitions/quagga.d';
 import getViewPort from './getViewPort';
+import type { XYSize } from '../../type-definitions/quagga.d';
 
 function findOrCreateCanvas(selector: string, className: string) {
     let canvas: HTMLCanvasElement | null = document.querySelector(selector);
@@ -11,16 +11,17 @@ function findOrCreateCanvas(selector: string, className: string) {
     return canvas;
 }
 
-function getCanvasAndContext(selector: string, className: string) {
+function getCanvasAndContext(selector: string, className: string, options: { willReadFrequently: boolean }) {
     const canvas = findOrCreateCanvas(selector, className);
-    const context = canvas.getContext('2d');
+    console.warn('* initCanvas getCanvasAndContext');
+    const context = canvas.getContext('2d', { willReadFrequently: options.willReadFrequently });
     return { canvas, context };
 }
 
-function initCanvases(canvasSize: XYSize): CanvasContainer | null {
+function initCanvases(canvasSize: XYSize, { willReadFrequently }: { willReadFrequently: boolean }): CanvasContainer | null {
     if (typeof document !== 'undefined') {
-        const image = getCanvasAndContext('canvas.imgBuffer', 'imgBuffer');
-        const overlay = getCanvasAndContext('canvas.drawingBuffer', 'drawingBuffer');
+        const image = getCanvasAndContext('canvas.imgBuffer', 'imgBuffer', { willReadFrequently });
+        const overlay = getCanvasAndContext('canvas.drawingBuffer', 'drawingBuffer', { willReadFrequently });
 
         // eslint-disable-next-line no-multi-assign
         image.canvas.width = overlay.canvas.width = canvasSize.x;
@@ -45,7 +46,7 @@ export default function initCanvas(context: QuaggaContext): CanvasContainer | nu
     const viewport = getViewPort(context?.config?.inputStream?.target);
     const type = context?.config?.inputStream?.type;
     if (!type) return null;
-    const container = initCanvases(context.inputStream.getCanvasSize());
+    const container = initCanvases(context.inputStream.getCanvasSize(), { willReadFrequently: !!context?.config?.inputStream?.willReadFrequently });
     if (!container) return { dom: { image: null, overlay: null }, ctx: { image: null, overlay: null } };
 
     const { dom } = container;

type-definitions/quagga.d.ts

@@ -703,6 +703,7 @@ export interface QuaggaJSResultCollector {
     create?(param: QuaggaJSResultCollector): QuaggaJSResultCollector;
 
     getResults?(): QuaggaJSCodeResult[];
+    willReadFrequently?: boolean;
 }
 
 /**
@@ -913,7 +914,7 @@ export interface QuaggaJSConfigObject {
          * Available values: x-small, small, medium, large, x-large
          */
         patchSize?: string;
-
+        willReadFrequently?: boolean;
         debug?: {
             /**
              * @default false