Canvas rendering produces strange result (buffer overflow?).

Not reproducible Issue #7410609

Details

Author
Tomas E.
Created
May 2, 2016
Privacy
This issue is public.
Found in
  • Microsoft Edge
Found in build #
13.10586
Reports
Reported by 2 people

Sign in to watch or report this issue.

Steps to reproduce

Put this code in a blank html page.

<canvas id="myCanvas"></canvas>

<script type="text/javascript">
  
    var myCanvas = document.getElementById("myCanvas");
    myCanvas.width = window.innerWidth;
    myCanvas.height = window.innerHeight;
   
    window.requestAnimationFrame(update);

    function update() {
        var ctx = myCanvas.getContext("2d");
        ctx.clearRect(0, 0, myCanvas.width, myCanvas.height);

        for (var x = 0; x < 3; x++) {
            for (var y = 0; y < 3; y++) {
                var bitmap = ctx.createImageData(512, 511);
                bitmap.data.fill(127);
                ctx.putImageData(bitmap, x * 512, y * 100);
            }
        }

        window.requestAnimationFrame(update);
    }

</script>

Or see this codepen https://codepen.io/tengl/pen/RaqxrJ.

You will see a strange behavior in the upper left corner. Codepen behaves a bit differently from a stand alone page. See attached screenshot.

Expected the entire canvas to be gray.

Attachments

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “Brad E.”

  • Hello,

    I have not been successful in reproducing the output you have shown in the screenshot. Would you be able to provide us with more information on the problem?

    In this case it would be helpful to obtain the version number of edge and the output from dxdiag so that we can better understand the environment you are encountering this output with. Thank you for your feedback and working with me to diagnose the problem.

    All the best,
    The MS Edge Team

  • Hi, thanks for the quick reply.

    Microsoft Edge 25.10586.0.0.

    We have reproduced the issue on several machines, but unfortunately they all are quite similar.

    In Codepen you might have to resize the window or open a menu on the page or something. Instead of the pattern seen on a stand-alone page, it will be a white rectangle flickering on and off (on my machine).

    I will attach dxdiag information and also our original page, which is same as code above.

  • I just observed that the bug is not visible unless the window is maximized (and refreshed).

    If you have a smaller window with scrollbars you will see a blank rectangle while scrolling.

  • Microsoft Edge Team

    Changed Assigned To to “Rico M.”

    Changed Assigned To from “Rico M.” to “Christian F.”

    Changed Assigned To from “Christian F.” to “Li-Hsin H.”

    Changed Status to “Confirmed”

  • Hi, any progress on this issue?

  • Microsoft Edge Team

    Changed Status from “Confirmed” to “Not reproducible”

  • Nobody has been able to repro this in later builds, officially it was last tested with 14906. Sorry about the delay in getting back to you on our findings.

    All the best,
    The MS Edge Team

You need to sign in to your Microsoft account to add a comment.

Sign in