Skip to content

Inexplicable error with decodeContinuously() (iPhone only) #642

@ffff65535

Description

@ffff65535

Describe the bug
Tried to use the library in an Angular app and it worked as expected, EXCEPT when it was tested on an iPhone.
Tested OK: Edge 140 on Windows 11, Chrome 141 on Windows 11, Chrome 141 on Android 15, Chrome 141 on Android 16.
Tested ERROR: Safari and Chrome on iPhone iOS 28. (Presumably the same rendering engine used internally.)

To Reproduce
Sanitized code snippet:

    this.scannerReader.tryPlayVideo(video).then(() => {
      this.scannerReader.decodeContinuously(video, (result: Result, error?: Exception) => {
        if (result) {
          // handle result
        } else if (error && !(error instanceof NotFoundException)) {
          // handle error (written to text element in web page in JSON format as quick&dirty diagnostic)
        }
      });
    });

On the error platform, the error object is (JSON): { "line": 369342, "column": 60, "sourceURL": "https://{{OUR_DOMAIN}}/main-77UX3WTX.js" }

That line is: var imageData = canvas2.getContext("2d").getImageData(0, 0, canvas2.width, canvas2.height);

A bigger snippet of the JS file, with line numbers, and context before and after the mentioned line:

369324	var HTMLCanvasElementLuminanceSource = (
369325	  /** @class */
369326	  function(_super) {
369327	    __extends16(HTMLCanvasElementLuminanceSource2, _super);
369328	    function HTMLCanvasElementLuminanceSource2(canvas2, doAutoInvert) {
369329	      if (doAutoInvert === void 0) {
369330	        doAutoInvert = false;
369331	      }
369332	      var _this = _super.call(this, canvas2.width, canvas2.height) || this;
369333	      _this.canvas = canvas2;
369334	      _this.tempCanvasElement = null;
369335	      _this.buffer = HTMLCanvasElementLuminanceSource2.makeBufferFromCanvasImageData(canvas2, doAutoInvert);
369336	      return _this;
369337	    }
369338	    HTMLCanvasElementLuminanceSource2.makeBufferFromCanvasImageData = function(canvas2, doAutoInvert) {
369339	      if (doAutoInvert === void 0) {
369340	        doAutoInvert = false;
369341	      }
369342	      var imageData = canvas2.getContext("2d").getImageData(0, 0, canvas2.width, canvas2.height);
369343	      return HTMLCanvasElementLuminanceSource2.toGrayscaleBuffer(imageData.data, canvas2.width, canvas2.height, doAutoInvert);
369344	    };
369345	    HTMLCanvasElementLuminanceSource2.toGrayscaleBuffer = function(imageBuffer, width, height, doAutoInvert) {
369346	      if (doAutoInvert === void 0) {
369347	        doAutoInvert = false;
369348	      }
369349	      var grayscaleBuffer = new Uint8ClampedArray(width * height);
369350	      HTMLCanvasElementLuminanceSource2.FRAME_INDEX = !HTMLCanvasElementLuminanceSource2.FRAME_INDEX;
369351	      if (HTMLCanvasElementLuminanceSource2.FRAME_INDEX || !doAutoInvert) {
369352	        for (var i = 0, j = 0, length_1 = imageBuffer.length; i < length_1; i += 4, j++) {
369353	          var gray = void 0;
369354	          var alpha = imageBuffer[i + 3];
369355	          if (alpha === 0) {
369356	            gray = 255;
369357	          } else {
369358	            var pixelR = imageBuffer[i];
369359	            var pixelG = imageBuffer[i + 1];
369360	            var pixelB = imageBuffer[i + 2];
369361	            gray = 306 * pixelR + 601 * pixelG + 117 * pixelB + 512 >> 10;
369362	          }
369363	          grayscaleBuffer[j] = gray;
369364	        }
369365	      } else {
369366	        for (var i = 0, j = 0, length_2 = imageBuffer.length; i < length_2; i += 4, j++) {
369367	          var gray = void 0;
369368	          var alpha = imageBuffer[i + 3];
369369	          if (alpha === 0) {
369370	            gray = 255;
369371	          } else {
369372	            var pixelR = imageBuffer[i];
369373	            var pixelG = imageBuffer[i + 1];
369374	            var pixelB = imageBuffer[i + 2];
369375	            gray = 306 * pixelR + 601 * pixelG + 117 * pixelB + 512 >> 10;
369376	          }
369377	          grayscaleBuffer[j] = 255 - gray;
369378	        }
369379	      }
369380	      return grayscaleBuffer;
369381	    };
369382	    HTMLCanvasElementLuminanceSource2.prototype.getRow = function(y, row) {

Expected behavior
in callback, results are returned as scanned, no error (similar to other platforms)

Screenshots
N/A

Desktop (please complete the following information):
N/A

Smartphone (please complete the following information):

  • Platform: iPhone ??
  • OS: iOS28
  • Browser: stock browser: safari, as well as Chrome
  • Version: ?? (up to date)

Additional context
Sorry for incomplete info, tested by various team members and not all information was retrieved in time.
No other platforms are applicable to our app, sadly no info on those.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions