I develop a html5 canvas browser game with createjs (Adobe Animate) and after the last update of Samsung Internet browser when the user clicks somewhere, it fires the click event for totally different button. It looks like the createjs native method _getObjectsUnderPoint() gives the wrong target of the click. Even when I click on empty space on the stage, where there is not buttons, a click handler is fired. This strange behavior is not present in Google Chrome or Opera for mobile, only in Samsung Internet.
In rare cases, even though the click target is correct, the handler is not called. More specifically, the problem must be in the createjs functions _testMask() or _testHit(). They use the canvas context and matrix transformations.
Does anyone has idea what should be fixed in the CreateJs library for Samsung Internet browser.
I solved the problem like this:
Check if the user agent contains SamsungBrowser
var userAgent = navigator.userAgent;
userAgent = userAgent.toLowerCase();
var isSamsungBrowser = userAgent.indexOf("samsungbrowser") != -1;
In CreateJs in _getObjectsUnderPoint() I added this near the end of the
for loop:
if(isSamsungBrowser) {
var bounds = child.getBounds();
if(bounds) {
var p = child.globalToLocal(x, y);
var hit = p.x >= bounds.x &&
p.x <= bounds.x + bounds.width &&
p.y >= bounds.y &&
p.y <= bounds.y + bounds.height;
if(! hit) {
continue;
}
}
else {
console.error('NO BOUNDS FOR', child);
continue;
}
}
The only drawback is that every Shape must have bounds. So you can convert the shapes to bitmaps in Adobe Animate or use setBounds().