UserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.41 Safari/537.36

Steps to reproduce the problem:
1. Create and bind a webgl texture.
2. Load an image and draw it into a canvas via the drawImage method. Note: image dimensions should be greater than the viewport's width and height.
3. Use this canvas as a source in the texImage2D call for the created texture.
4. Generate mipmaps for the texture using LINEAR_MIPMAP_LINEAR min filter.
5. Render the texture in a browser using the ANGLE D3D9 backend.

What is the expected behavior?
The texture should be rendered fine.

What went wrong?
The image seems upscaled or like its mipmap levels blended with each other (depends on the image's dimensions). You can see this on the attached screenshot "bug.png".

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 58.0.3029.110  Channel: stable
OS Version: Windows 7/8/10
Flash Version: 

This bug is reproduced under Windows for the old GeForce 7300 GS card, which doesn't support DirectX 11, and for newer ones with -use-angle=d3d9 command line flag.

The attached test case archive contains the test HTML-file and a texture for reproducing the bug.

Also, there are some cases that seem to cure this issue:
 - don't use mimapping
 - don't use a canvas as an intermediate step and put HTMLImageElement in a webgl texture directly
 - use a canvas, but get its data in the form of Uint8Array and send it to texImage2D:
var data = new Uint8Array(canvas.getContext("2d").getImageData(0, 0, canvas.width, canvas.height).data.buffer);
 

Deleted: test_d3d9.zip 46.4 KB

test_d3d9.zip 46.4 KB Download

Deleted: bug.png 155 KB

	bug.png 155 KB View Download