Text at certain font sizes renders as a black box for render: { mipmapFilter: 'LINEAR_MIPMAP_LINEAR' }

[saintflow47]

With the help of @rexrainbow we were able to narrow down the black box text issue to the following codepen.

https://codepen.io/rexrainbow/pen/mdopKbV

What leads to the text rendering as a black box seem to be both, the fontSize being 58px (some other fontSizes are also broken, other fontSizes are working though) and the mipmapFilter being LINEAR_MIPMAP_LINEAR

It happens on Chromium (both Chrome and Electron), it does not happen on Firefox

[BenjaminDRichards]

Thanks for narrowing that down! I've resolved the issue.

Basically, WebGL only supports MIPMaps at certain resolutions (power-of-two, aka POT). Phaser will ask WebGL to generate them, and set some texture parameters to be compatible with them.

But when a texture updates its resolution, those texture parameters also need to be updated, which was partially overlooked. In this case, the text creates a canvas which is 1x64px (this is POT), then adding the text resizes it to 200x64px (this is NOT POT, and breaks things). No text other than 58pt, or a handful of other unusual sizes, would cause it to initialize as POT.

I've updated the render system to properly update those values (https://github.com/phaserjs/phaser/commit/13d6defb33b56cb055865cbbaf1f93ea0ace5dba), and text works properly.