v4.2.1 Mask and Blend Mode interaction bleeding into other Container children

[rpn-ollie-james]

Version

• Phaser Version: 4.2.1
• Operating system: Windows 11 Pro
• Browser: Brave 1.96.59 ( Chromium: 154.0.8037.58 )

Description

When a container has an object with a blend mode, and another container is added (nested) after it, if the nested container uses a mask filter, the blend mode from the first sibling will be applied across the nested container.

Example Test Code

class Example extends Phaser.Scene
{
    preload ()
    {
        // this.load.setBaseURL('https://cdn.phaserfiles.com/v385');
        this.load.image('stone', 'assets/particles/stone.png');
        this.load.atlas('sea', 'assets/animations/seacreatures_json.png', 'assets/animations/seacreatures_json.json');
    }

    create ()
    {
        this.add.image(400, 300, 'stone').setScale(3);

        const box = new Phaser.GameObjects.Container(this, 350, 300);
        this.add.existing(box);

        const blended = new Phaser.GameObjects.Image(this, -20, -100, 'sea', 'crab10000');
        blended.setBlendMode(Phaser.BlendModes.ADD);
        box.add(blended);

        const innerBox = this.add.container(0, 0);
        box.add(innerBox);

        const crab = new Phaser.GameObjects.Image(this, 0, 0, 'sea', 'crab10000');
        innerBox.add(crab);
        const jelly = new Phaser.GameObjects.Image(this, 50, 100, 'sea', 'blueJellyfish0001');
        jelly.enableFilters();
        Phaser.Actions.AddMaskShape(
            innerBox,
            { shape: 'rectangle', scaleMode: -1, invert: true, region: new Phaser.GameObjects.Rectangle(this, 325, 310, 80, 80) }
        );
        innerBox.add(jelly);
    }
}

const config = {
    type: Phaser.WEBGL,
    width: 800,
    height: 600,
    parent: 'phaser-example',
    scene: Example
};

const game = new Phaser.Game(config);

Additional Information

Note that:

• blended above must be added to box before innerBox is, otherwise there's no issue
• jelly must have filters enabled and actually have the mask applied, just calling .enableFilters doesn't repro
• I'm not sure if any other filters cause an issue, I've only tried mask
• At first I thought it might be to do with the shared texture 'sea' but I don't think that actually makes a difference
• The blend mode used doesn't matter, happens with SCREEN, ADD, and MULTIPLY at least

[rpn-ollie-james]

I thought it seemed familiar..
Looks like it's a regression of this issue my colleague posted which was fixed in the 4.0.0-rc.6 release: #7201

I can confirm the workaround from there works as well, explicitly doing .setBlendMode(Phaser.BlendModes.NORMAL) fixes it