Sprite as a mask problem

[LucaDB]

Hi, this is my first post 

I'm trying to use an image (png) as a container mask,

it seems to work well on macOS but on Windows 8.1/10 ( ie11, edge, firefox 53) mask has no effect.

Here is the simple code

var app = new PIXI.Application(window.innerWidth,window.innerHeight);
document.body.appendChild(app.view);

var baseContainer = new PIXI.Container();

app.stage.addChild(baseContainer);

var theMask = PIXI.Sprite.fromImage('mask.png');

var baseImg = new PIXI.Sprite.fromImage('base.jpg');

baseContainer.addChild(baseImg);
baseContainer.addChild(theMask);
baseContainer.mask = theMask;

I'm using PIXI 4.4.1

Any idea why this is not working?

Thank you

[LucaDB]

Here is the pen

[ivan.popelyshev]

It works if you remove "new" word. PIXI.Sprite.fromImage is a static function, not a constructor.

[LucaDB]

Thank you for your reply Ivan.

I edited the pen, unfortunately the result is still the same .

First image is on Windows Internet Explorer,

second one is the desired result in Chrome

Thanks

[LucaDB]

Why is my reply hidden?

[LucaDB]

Thank you for your reply Ivan.

I edited the pen, unfortunately the result is still the same .

 

[ivan.popelyshev]

It works for me in ie11 and edge. Are you sure you have videodrivers installed on Win machine? no drivers => no webgl => canvas fallback doesnt have sprite masks. However it can be emulated with MULTIPLY blendmode instead.

[LucaDB]

Yes, that was the problem.

I was testing on a video driverless machine (browserstack).

Thank you for your help.