Incorrect mipmaps generating after resize image in Win7 on Chrome

[darkhus]

Description of the problem

When texture in not power of two, it generates wrong mipmaps (I suppose) after resize of texture. When mipmaps are not generated 2D texture displays correctly.
Inside "WebGLTextures.js" there is a function "makePowerOfTwo" where image is resized. I have made quick workaround to achive correct rendering on Windows 7:
after line: context.drawImage( image, 0, 0, canvas.width, canvas.height );
I add: context.getImageData(0, 0, canvas.width, canvas.height);
and it seems to be resised properly to generate proper mipmaps, but I'm not sure why and if calling getImageData is proper way...
On Firefox it looks fine but got console message Error: WebGL warning: texImage2D: Conversion requires pixel reformatting

Three.js version

• Dev
• r85
• ...

Browser

• All of them
• Chrome
• Firefox
• Internet Explorer

OS

• All of them
• Windows
• macOS
• Linux
• Android
• iOS

Hardware Requirements (graphics card, VR Device, ...)

Windows 7 32-bit, SP1, CPU i7 2600S

[mrdoob]

Could you create a jsfiddle?

[pailhead]

Are you trying to generate mip maps from NPOT textures?

[darkhus]

please look at this fiddle, line 178 (without it on Win7 texture and mip maps has wrong coords)
http://jsfiddle.net/L6u37xsb/3/
I'm not trying to create mip maps from NPOT textures but first resize it to POT.

[pailhead]

Can you explain this:

Inside "WebGLTextures.js" there is a function "makePowerOfTwo" where image is resized. I have made quick workaround to achive correct rendering on Windows 7:

How is the makePowerOfTwo relevant to your second sentence? What is the workaround? In your fiddle, you seem to be creating a texture that is NPOT (768 x 1280). Mipmaps cannot be generated on such textures.

[darkhus]

Inside Three.js source in WebGLTextures.js there is method makePowerOfTwo (https://github.com/mrdoob/three.js/blob/dev/src/renderers/webgl/WebGLTextures.js#L46)

as I understand, each image which is going to have mipmap and is NPOT is resized by this function...

My work around is line 178 inside fiddle, as I copied this method and add one line and somehow it start to give correct maps on Win7 and Chrome...

[mrdoob]

Shouldn't this be reported to Chrome/Firefox instead? It's a browser bug, isn't it?

[darkhus]

you are right, it's much more browser than three.js/webgl, but from other hand, browser resize it properly (I mean I checked it and it gives correct resized image), but webgl generates wrong mipmaps..

[mrdoob]

@darkhus Just to confirm...

The issue here is that Chrome and Edge on Windows 7 produce wrong results when doing mipmaping of a POT -based texture. Right?

If that's the case. Any chance you could create a simpler jsfiddle?

/cc @kenrussell

[mrdoob]

@devotwo posted a jsfiddle for this in #11503

https://jsfiddle.net/kdkjrte8/20/

[kenrussell]

Can't reproduce on my Windows 10 workstation with Chrome Canary and AMD R7 250 GPU.

I suspect this may have been a bug in ANGLE's Direct3D 9 backend that has already been fixed. Can you test with Chrome Canary on this hardware?

If it still fails, please provide the plaintext contents of about:gpu (perhaps on pastebin) and screenshots of working vs. failing with the fiddle https://jsfiddle.net/kdkjrte8/20/ .

[darkhus]

My test resoults:
now it works fine with Chrome Canary;
also I updated Chrome (from 58.0.3029.110 to 59.0.3071.104) and bug dissapear aswell;

just to show how it was looking bad:

without mip maps

about:gpu *.zip file