javascript - serratus - QuaggaJS no pudo ejecutar ''drawImage''

quagga js map

Question

Estoy intentando cargar un archivo de imagen estática utilizando el método de entrada de archivo + decodeSingle () con QuaggaJS dentro de un componente Lightning de Salesforce Communities. Básicamente, estoy aceptando una imagen de usuario como entrada, recuperando del documento por id, y luego creando un objeto de estado Quagga y pasándolo al método decodeSingle () donde recibo el siguiente error:

Error al ejecutar ''drawImage'' en ''CanvasRenderingContext2D'': el valor proporcionado no es del tipo ''(CSSImageValue o HTMLImageElement o HTMLVideoElement o HTMLCanvasElement o ImageBitmap o OffscreenCanvas)''

La imagen se muestra en la pantalla, por lo que parece que se está cargando correctamente, pero por alguna razón parece haber un error de tipo.

Etiqueta de entrada:

<input type="file" class="barcodeImages" id="barcodeImages" aura:id="barcodeImages" multiple="false" capture="camera" accept="image/*;capture=camera" onchange="handleBarcodeChange();"/>

JS:

decode: function(component) {
        var barcodeImages = document.getElementById("barcodeImages");

        if (barcodeImages.files && barcodeImages.files.length)
        {
            var self = this;
            var fr = new FileReader();

            fr.readAsDataURL(barcodeImages.files[0]);
            fr.onload = function() {
                console.log(''fr onload'');

                var state = {
                    inputStream: {
                        size: 800,
                        type: "ImageStream", 
                        singleChannel: false
                    },
                    numOfWorkers: 0,
                    locator: {
                        patchSize: "large",
                        halfSample: false
                    },
                    decoder: {
                        readers: ["code_39_vin_reader"]
                    },
                    locate: true,
                    src:  fr.result
                };

                self.decodeSingle(state,component,0);

            };

Quagga decodeSingle ():

decodeSingle : function(state, component, count) {
    var self = this;
    Quagga.decodeSingle(state, function(result) {
        var result = JSON.parse(JSON.stringify(result));
        var code = (result && result.codeResult) ? result.codeResult.code : null;
        if(code)
        {
            component.set("v.code",code);
        }
        else if(count < 3)
        {
            count = count+1;
            self.decodeSingle(state,component,count);
        }
    });        
}

He tenido esto trabajando en un servidor anterior usando un enfoque de iframe incrustado donde el iframe pasa la imagen al componente principal y luego llama a Quagga. Ambos enfoques recuperan la imagen de la misma manera, por lo que no estoy seguro de por qué uno fallaría y el otro funcionaría.