[jira] [Created] (CB-8798) Android 4.x - HTML5 video tag only audio playing

["Tanase Butcaru (JIRA)" <ji...@apache.org>]

Tanase Butcaru created CB-8798:
----------------------------------

             Summary: Android 4.x - HTML5 video tag only audio playing
                 Key: CB-8798
                 URL: https://issues.apache.org/jira/browse/CB-8798
             Project: Apache Cordova
          Issue Type: Bug
          Components: Android
    Affects Versions: Master
         Environment: Archlinux host
Cordova 4.3.0
Xperia Sola with Android 4.4.4  (unofficial)
Android Simulator - Android 5.0.1 & 4.4.2 
            Reporter: Tanase Butcaru
            Priority: Critical


HTML5 video tag doesn't work properly on android 4.4 (.2 & .4) webView - only the audio is playing. With 5.0.1 it works just fine!

If I enable controls on video tag and enter fullscreen mode then I have video working, but when I'm out of fullscreen the video screen is black.

I have android:hardwareAccelerated="true" and I also tried this plugin which is outdated now (same issue though).

It doesn't matter if I control video with JS or I interact with the video controls. Tried both, same behaviour. Tried with all video file formats, no change.

I know there are similar questions on the web, but all are 1-2 years old and solutions provided for them are outdated or not working.

* Using latest version of phonegap/cordova. I have also created a sample app to test the video tag, thought maybe was something related to my app, but the problem persists.

Simple test case:
1. create a sample phonegap app:
cordova create helloworld com.helloworld.cdv "Phonegap Test"

2. add latest android platform after entering helloworld dir:
cordova platform add android@latest

3. open index.html and add the following after "deviceready" div ending tag:
<video id="vid" controls webkit-playsinline></video>

4. open index.js and add the following inside ``onDeviceReady`` method:
       //video test
        var videoObject = document.getElementById('vid');
        videoObject.src = 'http://demo.touchmediahost.com/kmapp/vid.mp4';
        videoObject.load();

        videoObject.addEventListener('canplay', function(){
            //video can be played!!
            videoObject.play();
        })

5. Setup 2 AVDs like this: (1) Nexus S with Android 4.4.2 (API 19), Intel Atom x86 and (2) Nexus 5 with Android 5.0.1 (API 21), Intel Atom x86.
6. For each AVD run ``cordova emulate android``.

You'll see that on lollipop the video is displaying the image and the sound is working & on kitkat the image is black and it only works on fullscreen mode.

All files are the default ones; in AndroidManifest.xml the hardware accel si true by default.
Also tested on my real device with kitkat 4.4.4.

I tried these days to change the webview to Crosswalk, but still the problem persists. Also tried the MediaElement.js with no success.
The only webview were the video tag works correctly is ludei's cocoonjs (webview plus), but I don't really like it because it doesn't render the css like it should (only some properties).



--
This message was sent by Atlassian JIRA
(v6.3.4#6332)

---------------------------------------------------------------------
To unsubscribe, e-mail: issues-unsubscribe@cordova.apache.org
For additional commands, e-mail: issues-help@cordova.apache.org