videojs / videojs-contrib-ads

A Tool for Building Video.js Ad Plugins
http://videojs.github.io/videojs-contrib-ads/
Other
379 stars 257 forks source link

Library not compatible with Samsung Tizen TVs #523

Closed kevinscroggins-youi closed 1 year ago

kevinscroggins-youi commented 3 years ago

Description

While attempting to integrate the Google IMA Video.js plugin in a Samsung Tizen TV HTML5 web application, it has come to my attention that the fundamental logic used by this library renders it unusable. There is a limitation on Tizen TVs such that you can only ever have a single HTMLVideoElement at a time, and if you have more than one then you will receive events on ALL HTMLVideoElement instances rather than the one it was intended for. This streams from the design choice to restrict the application to only being able to use a single video player at a time due to the fact that due to the low end ARMV7 processors used by these devices. The HTMLVideoElement is ultimately tied to the Samsung streaming engine under the hood, which is not correctly implemented to spec and can lead to very confusing issues. As far as I understand, this library does indeed make use of a separate HTMLVideoElement which in this case is extremely problematic. So long story short, my question ultimately around whether it is possible to optionally have the library use the HTMLVideoElement which is bound to the Video.js player instance for ad playback, which would mean that the player would need to be stopped and re-started at the previous timestamp prior to starting ad playback?

Related ticket:

Steps to Reproduce

Attempting to integrate any sort of ad playback and test it in a Tizen TV web application should be sufficient, as long as an HLS or DASH manifest is used instead of an MPEG4 file.

Expected Results

Ad playback should be successful, if the ad framework is optionally able to play back ads using the HTMLVideoElement instance used by the Video.js player.

Actual Results

Ad playback is successful, but since events from the ad playback are also sent to the Video.js player instance, resuming video playback will fail with errors such as:

14:12:47.183 [134319995] E/Tizen    | [14:12:46.926] Error: Failed to read the 'buffered' property from 'SourceBuffer': This SourceBuffer has been removed from the parent media source.
    at Error (native)
    at get$$1 (file:///assets/scripts/video.js:48533:32)
    at buffered (file:///assets/scripts/video.js:48429:25)
    at VirtualSourceBuffer.get$$1 (file:///assets/scripts/video.js:48670:18)
    at SourceUpdater.buffered (file:///assets/scripts/video.js:50514:34)
    at SegmentLoader.buffered_ (file:///assets/scripts/video.js:51852:36)
    at SegmentLoader.fillBuffer_ (file:///assets/scripts/video.js:52265:50)
    at SegmentLoader.monitorBufferTick_ (file:///assets/scripts/video.js:52234:16)

Reproducing Unit Test

N/A since this is a platform issue

Versions

videojs-contrib-ads version: 6.7.0

Video-js version: 7.8.4

Other plugins:

Platforms

OS/Devices: Samsung Standard 2017 Tizen TV

gkatsev commented 3 years ago

contrib-ads actually doesn't dictate whether a separate video element is used or not. Both methods are supported. I believe IMA by default uses a separate video element unless specifically configured not to, which is generally done for iPhone support.

aakashsingh-maz commented 3 years ago

@kevinscroggins-youi I am also facing the same issue on tizen smart TV, did you find any solution ?

allen8101070 commented 2 years ago

Hi, I have the same problem on Tizen TV. Is there any solution? Thanks!

kevinscroggins-youi commented 2 years ago

Not that I'm aware of, I did not have any luck. I had limited time to investigate this unfortunately. I also apologize for not responding sooner but I have been unable to comment here for some reason.

gkatsev commented 2 years ago

If you have an adblocker, make sure to disable it for contrib-ads, as github's javascript will fail to load due to the repo name.

kevinscroggins-youi commented 2 years ago

Good to know, but I don't believe that is the issue here since this code is running on a physical Tizen TV. I had attempted a direct integration of IMA into Video.js on Tizen and while I could get CSAI to work for MP4 based content, it would not work for DASH since regardless of how I configured IMA, it would still create multiple video elements which would ultimately conflict with each other. The only solution that I could see working was to tear down the entire player, play the add, then re-start the player but that would require a custom VAST parser, ad scheduling system and API integrations which was not particularly feasible. I may have overlooked something as well, but I have not worked on this in some time so I'm trying to recall from memory. A lot of 'smart' TVs restrict the amount of video elements you can have active and trying to use more than one produces a lot of interesting problems, such as signals from the last created video element coming through on all video elements present in the DOM.. for example when an ad is playing, the player would get playing events since they did not ultimately share the same video element.

gkatsev commented 2 years ago

Sorry my comment was specifically about the "I have been unable to comment here for some reason".

While adblocker can cause issues, it's likely unrelated and most TVs don't have adblockers available.

gkatsev commented 2 years ago

Are you using videojs-ima? You may want to open an issue there. I know that IMA has options to re-use the existing video element, specifically for iPhones, which you can try, but it may not work on not-an-iphone.

kevinscroggins-youi commented 2 years ago

Oh! That's hilarious.. I do have an ad blocker actually, and strangely it is working now. 🤷‍♂️ Apologies for the confusion!

I was originally, but I also tried a more direct integration using the IMA SDK directly and ran into a number of issues with that as well. I had passed in the video element of the underlying Video.js player to the AdDisplayContainer and it was still using it's own HTMLVideoElement.

ie.

            self.video = document.createElement("video");
            self.video.id = "videojs_player";

            document.body.appendChild(self.video);

            self.player = videojs(self.video.id, {
                controls: false,
                autoplay: false,
                loadingSpinner: false,
                html5: {
                    nativeTextTracks: false,
                    nativeAudioTracks: true,
                    nativeVideoTracks: false,
                    vhs: {
                        overrideNative: true
                    }
                }
            });

            ...

            self.adsContainer = document.createElement("div");
            document.body.appendChild(self.adsContainer);

            self.adsDisplayContainer = new google.ima.AdDisplayContainer(self.adsContainer, self.video);
            self.adsDisplayContainer.initialize();

            self.adsLoader = new google.ima.AdsLoader(self.adsDisplayContainer);

I'd also contacted Google directly and the end result was that they don't support Tizen essentially, so there wasn't anything they could do. https://groups.google.com/g/ima-sdk/c/-q9F_7XHNwk/m/XaBOc1xEAQAJ It's a bit hazy now as this was some time ago and is not something I am actively working on anymore and no longer require. I'm not sure I had run into or tried any setting to re-use the video element that I can recall. 🤷‍♂️

In any case I think it's sufficient to say that this issue is more likely to be in the IMA library itself and is not necessarily relevant to this library so you can feel free to close this issue unless you think there is any further action that can be taken.