New issue
Advanced search Search tips

Issue 740824 link

Starred by 2 users

Issue metadata

Status: Available
Owner: ----
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Linux
Pri: 2
Type: Bug



Sign in to add a comment

border-radius does not work on video in <iframe> element

Reported by mikko.ra...@gmail.com, Jul 11 2017

Issue description

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

Steps to reproduce the problem:
1. Open https://jsfiddle.net/3kdLzdk4/
2. Start video

What is the expected behavior?
The video should have three rounded corners and the box-shadow should follow the rounding.

What went wrong?
Preview image is displayed corretly but once iframe starts to show the video, the iframe is clipped incorrectly. There may be some flickering with video and clipping fighting during the first few moments of video playback.

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 59.0.3071.86  Channel: stable
OS Version: Ubuntu 16.04.2 LTS
Flash Version: Flash is disabled

Youtube debug info from iframe:
{
  "ns": "yt",
  "el": "embedded",
  "cpn": "JBkiIZxLgjFysJKI",
  "docid": "-i0InwW0V9k",
  "ver": 2,
  "referrer": "https://www.youtube.com/embed/-i0InwW0V9k",
  "cmt": "0.933",
  "plid": "AAVUBNgYXvJlcWOm",
  "ei": "qXBkWcmDHoiSdNWnnIgC",
  "fmt": "243",
  "fs": "0",
  "rt": "88.049",
  "of": "frNe4q7jqBhkof5WhW97gg",
  "euri": "https://fiddle.jshell.net/3kdLzdk4/show/",
  "lact": 6,
  "cl": "161160339",
  "mos": 0,
  "state": "4",
  "vm": "CAEQARgE",
  "volume": 100,
  "subscribed": "1",
  "c": "WEB",
  "cver": "1.20170706",
  "cplayer": "UNIPLAYER",
  "cbr": "Chrome",
  "cbrver": "59.0.3071.86",
  "cos": "X11",
  "hl": "en_US",
  "cr": "FI",
  "len": "291.821",
  "fexp": "3300114,3300133,3312886,3313274,3313321,9413142,9419452,9422596,9431012,9434289,9441149,9446364,9449243,9453897,9457141,9463594,9465813,9466793,9466795,9466797,9467217,9467242,9468480,9468797,9468799,9468805,9469372,9471660,9474565,9474595,9474795,9476737,9477080,9478688,9479627,9479708,9480475,9480538,9481401,9482504,9482647",
  "afmt": "251",
  "size": "309:554",
  "inview": "1.01",
  "vct": "0.933",
  "vd": "291.821",
  "vpl": "0.000-0.933,",
  "vbu": "0.000-96.095,",
  "vpa": true,
  "vsk": false,
  "ven": false,
  "vpr": 1,
  "vrs": 4,
  "vns": 2,
  "vec": null,
  "vvol": 1,
  "lct": "0.933",
  "lsk": false,
  "lmf": false,
  "lbw": "12029912.610",
  "lhd": "0.017",
  "lst": "0.000",
  "laa": "itag=251,seg=9,range=1481340-1665186,time=90.0-100.0,off=0",
  "lva": "itag=243,seg=17,range=4557920-4799789,time=90.8-96.1,off=0",
  "lar": "itag=251,seg=9,range=1481340-1665186,time=90.0-100.0,off=0",
  "lvr": "itag=243,seg=17,range=4557920-4799789,time=90.8-96.1,off=0",
  "lvh": "r4---sn-ovgq0oxu-5goe",
  "lab": "0.000-100.001,",
  "lvb": "0.000-96.095,",
  "ismb": 40750000,
  "relative_loudness": "-0.249",
  "optimal_format": "360p",
  "user_qual": "auto",
  "debug_videoId": "-i0InwW0V9k",
  "0sz": false,
  "op": "",
  "yof": false,
  "dis": "",
  "gpu": "Mesa_DRI_Intel(R)_Ivybridge_Desktop_",
  "cgr": true,
  "debug_playbackQuality": "medium",
  "debug_date": "Tue Jul 11 2017 09:32:31 GMT+0300 (EEST)"
}
 
Howering top right corner before starting the video shows fighting between iframe and border clipping.
Components: Internals>GPU>Video
Labels: PaintTeamTriaged-20170711 BugSource-User
Status: Available (was: Unconfirmed)
The issue is the mask code for the border radius is interacting badly with the video playback layer in the compositor. There's a decent chance this is a cc issue.
Project Member

Comment 3 by sheriffbot@chromium.org, Jul 11

Labels: Hotlist-Recharge-Cold
Status: Untriaged (was: Available)
This issue has been Available for over a year. If it's no longer important or seems unlikely to be fixed, please consider closing it out. If it is important, please re-triage the issue.

Sorry for the inconvenience if the bug really should have been left as Available.

For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
Components: -Blink>Compositing
Status: Available (was: Untriaged)
Summary: border-radius does not work on video in <iframe> element (was: border-radius does not work on <iframe> element)
The behavior here is definitely related to the way that video is handled in the compositor. If there's something we can do in the Blink compositor to address this, we will, but I can't help thinking that the video manages to be rendered without the mask layer that is applying the border radius.

Sign in to add a comment