Ionic-native: Youtube Video Player not working on android 7.0

[MattFisch]

I'm submitting a ...
[x] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or https://ionicworldwide.herokuapp.com/

Current behavior:

Executing the command

ionic cordova run android

fails, due to the Youtube Video Player plugin with the following error message:

cp: copyFileSync: could not write to dest file (code=ENOENT):/[PATH_TO_IONIC_APP]/platforms/android/res/xml/config.xml
no such file or directory

Removing the Youtube Video Player plugin with

npm remove --save @ionic-native/youtube-video-player
ionic cordova plugin remove cordova-plugin-youtube-video-player

and running

ionic cordova run androind

leads to the app beeing built and deployed as expected.

Expected behavior:

The app should build and run on android 7.0

Steps to reproduce:

open an ionic application
run:

ionic cordova platform add android
ionic cordova plugin add cordova-plugin-youtube-video-player
npm install --save @ionic-native/youtube-video-player
ionic cordova run android

Other information:
cp: copyFileSync: could not write to dest file (code=ENOENT):/Users/mfi/workspace/git/ennstaltv/platforms/android/res/xml/config.xml

Parsing /Users/mfi/workspace/git/ennstaltv/platforms/android/res/xml/config.xml failed
(node:1053) UnhandledPromiseRejectionWarning: Error: ENOENT: no such file or directory, open '/Users/mfi/workspace/git/ennstaltv/platforms/android/res/xml/config.xml'
at Object.fs.openSync (fs.js:667:18)
at Object.fs.readFileSync (fs.js:572:33)
at Object.parseElementtreeSync (/Users/mfi/workspace/git/ennstaltv/platforms/android/cordova/node_modules/cordova-common/src/util/xml-helpers.js:180:27)
at new ConfigParser (/Users/mfi/workspace/git/ennstaltv/platforms/android/cordova/node_modules/cordova-common/src/ConfigParser/ConfigParser.js:30:24)
at updateConfigFilesFrom (/Users/mfi/workspace/git/ennstaltv/platforms/android/cordova/lib/prepare.js:106:18)
at Api.module.exports.prepare (/Users/mfi/workspace/git/ennstaltv/platforms/android/cordova/lib/prepare.js:42:20)
at Api.prepare (/Users/mfi/workspace/git/ennstaltv/platforms/android/cordova/Api.js:192:45)
at /usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/cordova/prepare.js:106:36
at _fulfilled (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/q/q.js:787:54)
at self.promiseDispatch.done (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/node_modules/q/q.js:816:30)
(node:1053) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:1053) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Ionic info::

cli packages: (/usr/local/lib/node_modules)

@ionic/cli-utils  : 1.19.1
ionic (Ionic CLI) : 3.19.1

global packages:

cordova (Cordova CLI) : 8.0.0

local packages:

@ionic/app-scripts : 3.1.8
Cordova Platforms  : android 7.0.0
Ionic Framework    : ionic-angular 3.9.2

System:

Node : v9.6.1
npm  : 5.6.0 
OS   : macOS High Sierra

Environment Variables:

ANDROID_HOME : not set

Misc:

backend : pro

[MattFisch]

Using

ionic cordova platform add [email protected]

Solves the issue, but I would rather use android 7.0.
It seems like the folder structure changed from android 6 to android 7 from

/platforms/android/res/xml/config.xml

to

/platforms/android/app/src/main/res/xml/config.xml

and the plugin tries to access the old config.xml files location, which is no longer there in android 7.

[danielsogl]

Related to the plugin source.

[sebastian-zarzycki-es]

For what it's worth, if you have cordova-plugin-youtube-video-player plugin added and then at some point you will remove android platform, if you try to add it again (cordova platform add android) it will complain about not being able to find AndroidManifest.xml. It is evidently caused by this plugin, because as soon as you remove it, you can add android platform just fine.

Sure, this is plugin source related, but since there is no way to submit issues to that repo, and ionic docs point to that plugin, I would expect some resolution here.

[MattFisch]

Well since you provide this plugin over ionic native, you might atleast mention in the ionic mative docs for this plugin, that its deprecated...

[MartinFavreau]

Hi everyone, I have exactly the same problem, do you find any solution to resolve it ?

[rijink7]

Stuck with same problem ,how to solve it ?

[pavandasilva]

Stuck with same problem ,how to solve it ?

[rosses]

I fork this plugin and setup to cordova-android >= 7.0.0

https://github.com/rosses/CordovaYoutubeVideoPlayer.git

Remove your plugin and install it
cordova plugin add https://github.com/rosses/CordovaYoutubeVideoPlayer.git

[whatnowangga]

@rosses You saved my day !
Thanks alot

[Maksi1994]

@rosses, Probably this is either a connection problem, or plugin spec is incorrect.
I saw this message when tried to install your solution.
by this command cordova plugin add https://github.com/rosses/CordovaYoutubeVideoPlayer.git

[rosses]

Hi @Maksi1994 test with

cordova plugin add https://github.com/rosses/CordovaYoutubeVideoPlayer.git --nofetch

[doktr]

Hi @rosses,

thanks alot for your fork!
I finally reattempted to install this plugin, but in my case i had to adjust a few things.
I use cordovaCLI 8.0.0 and cordova-android 7.1.1.

I have to use following hook to get most plugins to work:

https://gist.github.com/joeljeske/68121fa6d643e0937f50458d0172e16e

scripts/patch-android-studio-check.js

module.exports = function (context) {
if (context.opts.cordova.platforms.indexOf('android') < 0) {
return;
}
console.log('CORDOVA::PatchAndroidStudioCheck');
const path = context.requireCordovaModule('path');
const androidStudioPath = path.join(context.opts.projectRoot, 'platforms/android/cordova/lib/AndroidStudio');
const androidStudio = context.requireCordovaModule(androidStudioPath);
androidStudio.isAndroidStudioProject = function () { return true; };
};

config.xml

for platform android

    <hook src="scripts/patch-android-studio-check.js" type="before_plugin_install" />
    <hook src="scripts/patch-android-studio-check.js" type="before_plugin_add" />
    <hook src="scripts/patch-android-studio-check.js" type="before_plugin_rm" />
    <hook src="scripts/patch-android-studio-check.js" type="before_build" />
    <hook src="scripts/patch-android-studio-check.js" type="before_run" />
    <hook src="scripts/patch-android-studio-check.js" type="before_prepare" />

When using:

ionic cordova build android --prod

It resulted in some errors and i found out that the libs have not been loaded and my AndroidManifest.xml and config.xml have not been updated.

My working android config for plugin.xml for @rosses fork:
<platform name="android"> <config-file target="res/xml/config.xml" parent="/*"> <feature name="YoutubeVideoPlayer"> <param name="android-package" value="com.bunkerpalace.cordova.YoutubeVideoPlayer"/> </feature> </config-file> <config-file target="AndroidManifest.xml" parent="/*"> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/> </config-file> <config-file target="AndroidManifest.xml" parent="/manifest/application"> <activity android:name="com.keyes.youtube.OpenYouTubePlayerActivity" android:screenOrientation="landscape"/> <activity android:name="com.bunkerpalace.cordova.YouTubeActivity" android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:theme="@android:style/Theme.Black.NoTitleBar" android:windowSoftInputMode="adjustResize"/> </config-file> <source-file src="platforms/android/src/com/bunkerpalace/cordova/YouTubeActivity.java" target-dir="app/src/main/java/com/bunkerpalace/cordova" /> <source-file src="platforms/android/src/com/bunkerpalace/cordova/YoutubeVideoPlayer.java" target-dir="app/src/main/java/com/bunkerpalace/cordova" /> <source-file src="platforms/android/libs/openyoutubeactivity.jar" target-dir="app/libs"/> <source-file src="platforms/android/libs/YouTubeAndroidPlayerApi.jar" target-dir="app/libs" /> </platform>

Hope this helps someone else

Regards

[rosses]

Great @doktr

I have noticed that there are also other complications using services like phonegap build (PGB), which do not work well with the merge in edit-config.

thanks for share your solution!

[rijink7]

@rosses We've tried the plugin. Thers was no error while build.But we are getting an error "Class not found,
YoutubeVideoPlayer result = error "after calling Open video function.

[rosses]

@rijink7 whats version of cordova CLI you're using?

[elTigre9]

I'm in a similar situation as @rijink7.

I use the fork and everything builds fine. It works without a hitch for iOS, but doesn't for Android.
I run the apk_debug file in Android Studio (emulator). When I press my button to play a video, it gives me the class not found error:

D/PluginManager: exec() call to unknown plugin: YoutubeVideoPlayer
D/SystemWebChromeClient: http://localhost:8080/plugins/ .../YoutubeVideoPlayer.js: Line 14 : Class not found

Would you happen to have any suggestions?

EDIT -----------------------------
I found this in the git. Wondering if this might be the culprit:

For Android 5.0+ you will need to add the following to config.xml

<preference name="YouTubeDataApiKey" value="[YOUR YOUTUBE API]" />
with your own YouTube Key.

[dayaki]

@rijink7 whats version of cordova CLI you're using?

Thanks for the fork but am having an error whenever I want to build, I get this:

UnhandledPromiseRejectionWarning: TypeError: Path must be a string. Received undefined
    at assertPath (path.js:28:11)
    at Object.join (path.js:1236:7)
    at ConfigKeeper_get [as get] (/usr/local/lib/node_modules/cordova/node_modules/cordova-common/src/ConfigChanges/ConfigKeeper.js:45:26)

Cordova version 8.0 and cordova Android 7.1.1

[netdedek]

This task is closed, I suppose the issue will continue in https://github.com/ionic-team/ionic-native/issues/2447

[rijink7]

@rosses sorry forthe late reply.
Cordova version 8.0 and cordova Android 7.1.0