Canvas drawImage does not support negative sx and sy

Fixed, not yet flighted Issue #13829710


Mohammad R.
Sep 19, 2017
This issue is public.
Found in
  • Microsoft Edge
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

It seems that IE and Edge do not support negative sx and sy properly (or do not do the clipping properly). Please see that attached fiddle. The expected behavior is to have a 25x25 gray rectangle shown at 25,25, but nothing is displayed.
Please see for a more detailed discussion.


0 attachments

    Comments and activity

    • Microsoft Edge Team

      Changed Assigned To to “James M.”

    • Hello,

      Thank you for providing this information about the issue. Unfortunately, I cannot get your HTML file to produce any results. Perhaps I am missing drawimage_html_image_12_ref.html
      for the repro? Please check and provide a new sample which works in other browsers but fails in Edge.

      Best Wishes,
      The MS Edge Team

    • Hi James,

      Please see the output of different browsers attached. According to the spec, the behavior of Blink (Chromium and Opera) and Gecko (Firefox) is correct. WebKit (Safari) shows the expected 25x25 gray box, but the location is wrong (it is located at 0,0). IE and Edge do not show the box. The spec says:

      “When the source rectangle is outside the source image, the source rectangle must be clipped to the source image and the destination rectangle must be clipped in the same proportion.”

      Here the source rectangle is clipped by 25 from top and left, so the destination rectangle should be adjusted proportionally and end up as [25, 25] -> [50, 50].

    • Hello,

      Thank you for the update. I still do not have a working repro code or sample page. I will put this on hold until you provide a working repro or we can get more feedback from others about the issue.

      Best Wishes,
      The MS Edge Team

    • Hello,

      I found the problem and have now privately attached the correct test files, which my team can use for the repro. We will investigate and post an update when we have a solution.

      Best Wishes,
      The MS Edge Team

    • Microsoft Edge Team

      Changed Assigned To to “”

      Changed Status to “Confirmed”

      Changed Assigned To from “” to “Sergey M.”

      Changed Status from “Confirmed” to “Fixed”

      Changed Status from “Fixed” to “Fixed, not yet flighted”

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

    Sign in