New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 4 users

Issue metadata

Status: WontFix
Owner:
Closed: Sep 2015
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows , Mac
Pri: 2
Type: Bug



Sign in to add a comment

Web components that use <video> not working in Chrome 36, OSX & Win

Reported by karlgro...@gmail.com, Sep 18 2014

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36

Example URL:

Steps to reproduce the problem:
1. Create a Polymer Web Component that uses the <video> element
2. Open the page in Chrome 36
3. Activate the play button

What is the expected behavior?
Video will play

What went wrong?
Full description, originally entered at
https://github.com/addyosmani/video-js/issues/2

The videoJS component does not work in Chrome 36. This was tested in OSX and Windows 8.1 (tested and confirmed the intended behavior against Firefox and Safari)

I'm raising this issue here because I don't believe it to actually be an issue with VideoJS but I'm not sure whether it is an issue with Polymer or with Chrome. I first became aware of this issue while working on my own HTML5 video component. I decided to test Addy's component as a sanity check and found the same issue. In my gut I worry about whether this is due to Chrome's handling of the <video> inside of a web component, but I have no info to support this.

Here's what's up:

Video-js component demo in Chrome 36/ OSX showing unstyled controls. 
https://cloud.githubusercontent.com/assets/873419/3735575/a0c1d604-1725-11e4-9211-2a6f02501f79.png

Video-js component demo in Chrome 36/ Win 8.1 (on load)
https://cloud.githubusercontent.com/assets/873419/3735758/923d24f6-1727-11e4-9e3f-9b857402b424.png

Video-js component demo in Chrome 36/ Win 8.1 (video playing)
https://cloud.githubusercontent.com/assets/873419/3735778/baaffec2-1727-11e4-84df-bdb305fd2b90.png

It appears that the only real difference between OSX and Win 8.1 is that in Windows the controls toolbar appears. The behavior of the component is identical.

Play/ Pause button: Activating this button toggles the button's text. It also causes the poster image to disappear but does not play/ pause the video

Fullscreen button: Activating this button triggers the full screen behavior but does not play the video

There are no immediately obvious reasons for these problems. Console shows now indications why, all files appear to be loading, etc.

I've also tested Addy's Video Player Component located at http://addyosmani.github.io/video-player/ and the same issue with Chrome appears:
https://cloud.githubusercontent.com/assets/873419/3736489/542ff2cc-172e-11e4-8742-25c7f67c2cd0.png

Did this work before? No 

Is it a problem with Flash or HTML5? N/A

Does this work in other browsers? N/A 

Chrome version: 37.0.2062.120  Channel: stable
OS Version: OS X 10.9.4
Flash Version: Shockwave Flash 15.0 r0

This does not appear to be related to Polymer. For some reason, other assets, such as stylesheets are not loading.
 

Comment 1 by tkent@chromium.org, Sep 19 2014

Labels: Cr-Blink-WebComponents

Comment 2 by hayato@chromium.org, Sep 19 2014

Cc: hayato@chromium.org
Labels: Needs-Feedback
@karlgroves --> Can you please provide us with a url or sample file to investigate the bug further?
Labels: -Needs-Feedback M-39 OS-Windows
Status: Untriaged
Able to reproduce the issue using http://addyosmani.github.io/video-player/ with chrome 37.0.2062.120 stable, 38.0.2125.69 beta and 39.0.2166.2 canary.

Issue exists since M34. Not a regression.

hayato@, would you mind take a look and comment.
Cc: dglazkov@chromium.org
+dglazkov

I wonder if this is a bug when trying to interact with <video>'s secret shadow DOM for it's default controls when said <video> is already inside a shadow DOM as a component

Comment 7 by hayato@chromium.org, Sep 25 2014

Could someone minimize the repro case?

I've created the simple jsfiddle: http://jsfiddle.net/n88owmop/1/
I can play <video> in the shadow tree there.

Labels: Needs-Feedback

Comment 9 by Deleted ...@, Oct 1 2014

If you simply modify the example as I have here

http://jsfiddle.net/n88owmop/4/

It does not work. What is wrong with the modified example?

Comment 10 by Deleted ...@, Oct 1 2014

Seems like there might be a conflict between the HTML 5.x spec

http://www.w3.org/html/wg/drafts/html/master/embedded-content.html#the-source-element

and web components tree composition

Oops :-)

Owner: hayato@chromium.org
Status: Assigned
Could you help me to understand what is conflicting?
I am wondering whether this is a spec issue or an implementation issue.

Comment 13 by amin...@google.com, Oct 10 2014

Labels: -M-39 MovedFrom-39 M-40
Moving all non essential bugs to the next Milestone.
Labels: -M-40 MovedFrom-40
This issue has already been moved once and is lower than Priority 1,therefore removing mstone.
Labels: StaleAssigned
Labels: Hotlist-Recharge
This issue likely requires triage.  The current issue owner maybe inactive (i.e. hasn't fixed an issue in the last 30 days).  Thanks for helping out!

-Anthony
Status: WontFix

Sign in to add a comment