Q:

Transparency issue on IE with BlendColor filter

Here a little demo where I use the filter BlendColor from the framework Fabric.js to make an image blue.
https://jsfiddle.net/w2kdcs21/7/
var canvas = new fabric.Canvas('c');

fabric.Image.fromURL(document.getElementById('logo').src, function(img) {
  img.filters.push(
    new fabric.Image.filters.BlendColor({
        color: '#222299',
      mode: 'tint'
    })
  );

  img.applyFilters();
  canvas.add(img);
});

// create a rectangle with angle=45
var rect = new fabric.Rect({
  left: 50,
  top: 50,
  fill: 'red',
  width: 100,
  height: 100
});
canvas.add(rect);

https://github.com/fabricjs/fabric.js/issues/4715
Expected Behavior
The transparent area of the PNG should remain transparent.
Actual Behavior
On in IE or Edge, the transparent area of the PNG is not fully transparent anymore and a part of the red square is now pink.
Any leads are welcome, thanks!

A:

So the problem here is some crappy Microsoft webgl support.
We have 2 cases, EDGE and IE11.
IE11 has premultiplied alpha always set to true, while EDGE looks like it supports the parameter, but the bug is there anyway.

The texture gets some kind of soft alpha bluish
I managed to fix the issue modifying the shader for each filter, i think at expense of performance for each browser.
The difference is from this:
  tint: 'precision highp float;\n' +
    'uniform sampler2D uTexture;\n' +
    'uniform vec4 uColor;\n' +
    'varying vec2 vTexCoord;\n' +
    'void main() {\n' +
      'gl_FragColor = texture2D(uTexture, vTexCoord);\n' +
      'gl_FragColor.rgb *= (1.0 - uColor.a);\n' +
      'gl_FragColor.rgb += uColor.rgb;\n' +
    '}'

to this:
  tint: 'precision highp float;\n' +
    'uniform sampler2D uTexture;\n' +
    'uniform vec4 uColor;\n' +
    'varying vec2 vTexCoord;\n' +
    'void main() {\n' +
      'vec4 color = texture2D(uTexture, vTexCoord);\n' +
      'gl_FragColor = color;\n' +
      'if (color.a > 0.0) {\n' +
        'gl_FragColor.rgb *= (1.0 - uColor.a);\n' +
        'gl_FragColor.rgb += uColor.rgb;\n' +
        'gl_FragColor.a = color.a;\n' +
      '}\n' +
    '}'

I'll try to push up a release out as soon as possible.

