Drawing HTML5 video to canvas shows repeated pixels on the bottom and right edge
Reported by
trsdom...@gmail.com,
May 12 2016
|
|||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36 Example URL: http://testzone.subtest.dk/pixi_videochrome/ Steps to reproduce the problem: 1. Visit the URL pasted 2. View the video 3. Notice the repeated pixels in the bottom and right side What is the expected behavior? No repeated pixels What went wrong? I'm experiencing a weird video texture issue, when drawing a HTML5 video element onto a HTML5 canvas element. The video is scaled in height, and the remaining pixels (where the video should have been, shows the bottom line of pixels repeated/stretched . The repeated/stretched pixels are always 12 pixels. The issue seems to be dependent on the size of the video. I did a number of tests with the same video encoded as baseline mp4 (the height seems to be the determining factor, but I don't see any convincing pattern): (Fails = repeated pixels, Works = looks fine) 930x180 Fails 960x400 Works 1116x216 Fails 1025x256 works 1024x256 Works 1024x257 works 1024x216 Fails 300x216 Fails 1024x400 Works 1024x200 Fails 1024x254 Works 1024x230 Fails 1024x240 Works 1024x235 Fails 1024x232 Fails 1024x238 Fails 1024x239 Works 512x239 Works 512x238 Works 512x118 Fails 512x119 Fails 512x120 Fails 512x140 Works 512x130 Fails 90x130 Fails Changing from normal canvas rendering to WebGl renderer does not make any difference. If I make a standard HTML video element, with the same video source, I do not see the issue. (running Chrome 50.0.2661.94 m, but this is not a new issue) This is my own repro of the issue. In this the issue also occured in the right side of the video - but mostly it occurs in the bottom: http://testzone.subtest.dk/pixi_videochrome/ I'm using the PixiJS 2D renderer, but I'm fairly sure this is a Chrome issue, since I found this Flash issue, which exhibits the exact same behaviour, and none of the other browsers I have tried has this issue. https://bugs.chromium.org/p/chromium/issues/detail?id=558799 Did this work before? N/A Is it a problem with Flash or HTML5? HTML5 Does this work in other browsers? Yes Chrome version: 50.0.2661.94 Channel: n/a OS Version: 10.0 Flash Version:
,
May 13 2016
No repro on Linux Firefox 46.0 and Linux Chrome 50.0.2661.94 (software decode). Reproduces on M50-M52 Intel ChromeOS and (presumably) hw decode.
,
Jul 19 2016
,
Jul 20 2016
,
Aug 8 2016
,
Oct 6 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/feb2e37e78f375218f842448db94eae13254b536 commit feb2e37e78f375218f842448db94eae13254b536 Author: zakerinasab <zakerinasab@google.com> Date: Thu Oct 06 21:28:49 2016 Fixing repeated pixels when drawing HTML5 video to canvas. When the coded size of the video frame is different from the visible rect, SkCanvasVideoRenderer::Paint tries to scale the video while it must ignore the pixels outside visible rect. This is addressed by clipping the SkImage object created from VideoFrame prior to painting the frame on the canvas. BUG= 611330 Review-Url: https://codereview.chromium.org/2369093002 Cr-Commit-Position: refs/heads/master@{#423688} [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer.cc [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer.h [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer_unittest.cc
,
Oct 7 2016
,
Oct 10 2016
Verified the issue on windows 10 using chrome dev version #55.0.2883.6 as per the steps mentioned in the comment #0. The steps followed to reproduce the issue are as follows: ----------- 1. Visit the URL http://testzone.subtest.dk/pixi_videochrome/ 2. Viewed the video 3. Observed no repeated pixels in the bottom and right side. Hence, the fix is working as expected. Attaching screencast for reference Adding the verified labels.
,
Oct 27 2016
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/feb2e37e78f375218f842448db94eae13254b536 commit feb2e37e78f375218f842448db94eae13254b536 Author: zakerinasab <zakerinasab@google.com> Date: Thu Oct 06 21:28:49 2016 Fixing repeated pixels when drawing HTML5 video to canvas. When the coded size of the video frame is different from the visible rect, SkCanvasVideoRenderer::Paint tries to scale the video while it must ignore the pixels outside visible rect. This is addressed by clipping the SkImage object created from VideoFrame prior to painting the frame on the canvas. BUG= 611330 Review-Url: https://codereview.chromium.org/2369093002 Cr-Commit-Position: refs/heads/master@{#423688} [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer.cc [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer.h [modify] https://crrev.com/feb2e37e78f375218f842448db94eae13254b536/media/renderers/skcanvas_video_renderer_unittest.cc
,
Nov 4 2016
[Automated comment] removing mislabelled merge-merged-2840 |
|||||||||
►
Sign in to add a comment |
|||||||||
Comment 1 by yini...@chromium.org
, May 12 2016588 KB
588 KB View Download