HTML5 Canvas flickering in Firefox extension

Add-ons Development
#1

Hello!
I ran into the following problem in chrome.browserAction.setIcon: if I create a canvas


and I use it in JS as follows

var canv, canvContext;
var array_logo = [];

$(document).ready(function(){
canv = document.getElementById(‘canv’);
canvContext = canv.getContext(‘2d’);
array_logo = document.getElementsByTagName(‘img’);
});

function doAnimate() {
canvContext.save();
canvContext.clearRect(0, 0, canv.width, canv.height);
canvContext.rotate(0.52Math.PI);
canvContext.drawImage(array_logo[0],-Math.floor(array_logo[0].width/2), -Math.floor(array_logo[0].height/2));
canvContext.restore();
chrome.browserAction.setIcon({imageData: canvContext.getImageData(0, 0, canv.width, canv.height)});
}

setInterval(function(){doAnimate();}, 10);

The extension icon is strongly flickering, or not at all, this behavior is only observed in Firefox, this code is correctly executed in the Chrome browser.
how to fix the flicker? or is it a bug firefox engine?

#2

Does no one know how to solve this problem? I really need help, although I think it’s a bug in firefox

#3

Have you tested this on a web page? If the problem happens there too, then you should file a Firefox bug in Bugzilla.

#4

Yes, I tested it on a web page, and it all works well. The problem occurs when using chrome.browserAction.setIcon
The resulting icon flickers strongly, or disappears altogether. I also noticed that during the downloading of any browser tab, the flicker is reduced, and then everything is still flickering. Apparently I’ll still have to describe the bug in Bugzilla

#5

Yes, but in that case it’s probably better to file it as a WebExtensions bug.