TextTrack's VTTCues are not displayed inside the video element when translate or rotateY transforms are applied to a parent element
Reported by
e...@jwplayer.com,
Jul 27 2016
|
||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36 Steps to reproduce the problem: 1. Go to: http://demo.jwplayer.com/samples/vtt-transform.html 2. Inspect the page 3. Observe that VTTCues are showing in the first video, but not in the second or third 4. Look at the in-line styles for the divs wrapping the video elements to see the transforms being applied What is the expected behavior? VTTCues should be visible within the video regardless of transforms applied to a parent element. What went wrong? VTTCues are not visible when the following transforms are applied: - translate - rotateY(Ndeg) [N>3) Did this work before? N/A Chrome version: 51.0.2704.103 Channel: stable OS Version: OS X 10.11.5 Flash Version: Shockwave Flash 22.0 r0 The -webkit-media-text-track-display pseudo element has a negative bottom value, causing the cue div to be below the -webkit-media-text-track-container pseudo-element.
,
Jul 28 2016
,
Jul 28 2016
ssamanoori@, I've updated the link in the ticket to better explain the expected and actual behavior: http://demo.jwplayer.com/samples/vtt-transform.html. I've also attached a screencast illustrating the following: - Playback starts with no transforms applied. Captions are visible. - After applying the translate transform, captions rendered after the transform was appleid are not visible within the video window. I highlighted the -webkit-media-text-track-display element in the shadow dom to show where the cues are positioned. - I removed the transform. Captions start showing again. - I applied the rotateY transform. Captions rendered after the transform was applied are once again not visible. The highlighted -webkit-media-text-track-display element shows once again that the cue is positioned below the video. Thanks, Evol
,
Aug 1 2016
+liberato@ FYI This is a bug in the media controls stylesheet: because of the transform, the text track ends up outside the text track container and because it has "overflow: hidden;", it doesn't show up. Commenting "overflow: hidden;" draws the text track (still in the wrong place). See attached screenshot.
,
Aug 9 2016
,
Oct 10 2016
Definitely a polish fix and high priority given it impacts players with CC, and accessibility is important.
,
Jan 17 2017
,
Feb 9 2017
Marking as WontFix since I'm unable to repro the issue. Tested on Ubuntu 14.04 using Chrome 56.0.2924.87 (Official Build) (64-bit): 1. Opened URL: http://demo.jwplayer.com/samples/vtt-transform.html 2. Played first, second, third videos 3. Captions functioning properly in all three videos
,
Oct 26 2017
|
||||||||
►
Sign in to add a comment |
||||||||
Comment 1 by ssamanoori@chromium.org
, Jul 28 2016Labels: Needs-Feedback
3.6 MB
3.6 MB View Download