Bug: GL_INVALID_FRAMEBUFFER_OPERATION: Framebuffer is incomplete: Attachment has zero size

[Denver-Meadows]

Current Behavior

When scaling a sprite with a filter, the shader is causing the texture to turn black at certain scales.

Expected Behavior

The sprite does not turn black at any scale

Steps to Reproduce

Here is a simplified example of the code but this is how we are adding the filter. I selected a random size to scale but as seen in the below video, as we scale the image smaller, it eventually turns black throwing some WebGL errors.

import { Application, Assets, Sprite, NoiseFilter } from 'pixi.js';

(async () =>
{
    // Create a new application
    const app = new Application();

    // Initialize the application
    await app.init({ background: '#1099bb', resizeTo: window });

    // Append the application canvas to the document body
    document.body.appendChild(app.canvas);
    const myImage = 'https://live.staticflickr.com/65535/53657675512_e10fbf9d7e_m.jpg';

    // Load the image texture
    const texture = await Assets.load(myImage);

    // Create a image Sprite
    const image = new Sprite(texture);

    // Center the sprite's anchor point
    image.anchor.set(0.5);

    // Move the sprite to the center of the screen
    image.x = app.screen.width / 2;
    image.y = app.screen.height / 2;

    // Add filter
    image.filters = [new NoiseFilter()];

    // Scale
    let scaleX = .8;
    let scaleY = .8;
    image.scale.set(scaleX, scaleY);

    app.stage.addChild(image);
})();

Here's a video of the actual bug happening.

Screen.Recording.2024-04-16.at.1.52.32.PM.mov

Environment

• pixi.js version: 7.2.4
• Browser & Version: e.g. Chrome 123
• OS & Version: macOS Ventura 13.6.5

Possible Solution

No response

Additional Information

No response

[GoodBoyDigital]

thanks for posting - will take a look!