WebGL Render Warning if cacheAsBitmap is true

If cacheAsBitmap is set to true on a container that is empty or has only invisible children, Chrome (v56) and Firefox (v49) log a WebGL warning.

Warning Chrome:

[.Offscreen-For-WebGL-0000005524CBB4F0] GL ERROR :GL_INVALID_FRAMEBUFFER_OPERATION : glClear: framebuffer incomplete
[.Offscreen-For-WebGL-0000005524CBB4F0] RENDER WARNING: texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering.

Warning Firefox:

Error: WebGL: clear: Incomplete framebuffer: Status 0x8cd6: COLOR_ATTACHMENT0 has no width or height.
Error: WebGL: drawElements: Active texture 0 for target 0x0de1 is 'incomplete', and will be rendered as RGBA(0,0,0,1), as per the GLES 2.0.24 $3.8.2: The dimensions of `level_base` are not all positive.

Example: https://codepen.io/anon/pen/PWrXOB

Actual use-case: I have a container with n sprite elements. Depending on the state of the application I want to show 0 to n of the elements (by setting visible to true/false). After updating which sprites are visible, the container can be cached. If all elements are set to invisible the warnings appear.

My suggestion would be to extend the condition in DisplayObject.prototype._renderCachedWebGL (and maybe in DisplayObject.prototype._renderCachedCanvas to be consistent) to include a check for width and height of the element.

if (!this.visible || this.worldAlpha <= 0 || !this.renderable)
{
  return;
}

to

if (!this.visible || this.worldAlpha <= 0 || !this.renderable || this.width === 0 || this.height === 0)
{
  return;
}

I can create a Pull request if you like the solution but I wanted to discuss it first as I am not sure if it’s the only/best place for a fix.

[jsfi]

Maybe I understand something wrong, but aren’t the bounds used to generate the texture?

https://github.com/pixijs/pixi.js/blob/dev/src/extras/cacheAsBitmap.js#L186

If either width or height are zero, the texture should be empty. So by checking width and height first, it is possible to step over lines 178 to 205 and create the sprite without texture (which will automatically use Texture.Empty https://github.com/pixijs/pixi.js/blob/dev/src/core/sprites/Sprite.js#L103)

[ivanpopelyshev]

I’m not sure that bounds won’t be changed later. Its better to add flag to cached object that renderTexture is empty, or may be reference Texture.EMPTY instead, and then check it in rendering method