Software Archive
Read-only legacy content
17061 Discussions

Problem accessing plugins in new version of Intel XDK

Ian_I_
Beginner
581 Views

I have an app that has worked for a long time (over a year). I last compiled it about 2-3 weeks ago and it worked fine. However, when I tried to compile it a few days ago the java script could not recognize several third party plugins, and can no longer function correctly.  I have been able to recreate this problem on a simple test project, using only one of the third party plugins.  The test project does two things: 

1. Adds the third party plugin through the project settings page

url: https://github.com/triceam/LowLatencyAudio
ID: com.phonegap.LowLatencyAudio

2. Iterates through the windows.plugins collection. However, the collection is empty, where before the plugin would be an object that was available and reference-able. 

Here is the only code I added (right after the myEventHandler code in the default cordova template):  

    alert("looking for plugins");
    
      for(var propertyName in window.plugins) {
                          alert ("enumerating propertyName-"+propertyName);
                        }
 

Attached is a zip file of the test project containing the above.

Thanks for your help.
Ian Ippolito

 

0 Kudos
1 Solution
PaulF_IntelCorp
Employee
581 Views

Hello Ian,

Your test fails because that plugin's namespace is not within a global object named "plugin." There is no required or standard location where plugins are placed in the namespace, although window.plugin and cordova.plugin are used, there are many other places those plugins may reside.

Within that template that you used, there are two lines that, if you set them to true, will spit out a bunch of useful console messages, including one that lists the plugins that are included in your app. I took your app and enabled those lines, built the app (with "debuggable" set to "true" in the additions.xml file), attached it to my laptop and used Chrome to utilize the remote debug feature (this only works with Android 4.4 and higher devices). Attached is an image showing the results of those console.log messages, along with a few commands I typed into the console, at the very end.

Note that if you try this in the Emulate tab, with App Preview or using the Debug tab you will not see your third-party plugin. The only way to debug an app that contains third-party plugins is to build it and run it on a real device (which is what I did here). We are working on a more convenient solution to this problem, but that option is currently not available, so an Android 4.4+ device with Chrome is your best option. If you have a Mac, you can do the same with an iOS device and Safari, on the Mac.

If you look inside the plugins.xml file for that LowLatency plugin you'll see some lines like the following:

    <js-module src="www/LowLatencyAudio.js" name="LowLatencyAudio">
    	<clobbers target="window.LowLatencyAudio" />
    </js-module>

which shows the namespace that the plugin's API resides within. You can see that in the attached image, as well. The code below can be used to enumerate all of the plugins that are part of your build, it is the code that generated the list of plugins in the attached image.

    if( window.cordova && cordova.version ) {                   // only works in Cordova 3.x
        app.consoleLog("cordova.version: " + cordova.version) ; // print new Cordova 3.x version string...

        if( cordova.require ) {                                 // print included cordova plugins
            app.consoleLog(JSON.stringify(cordova.require('cordova/plugin_list').metadata, null, 1)) ;
        }
    }

If you're having some troubles debugging your app, I recommend using the "debuggable" equals "true" approach on an Android 4.4+ device with remote Chrome. More hints on how to do that can be found here: https://software.intel.com/en-us/xdk/docs/intel-xdk-debug-and-test-overview#RemoteChromeDevTools.

Screen Shot 2015-05-01 at 2.30.09 PM.png

View solution in original post

0 Kudos
2 Replies
PaulF_IntelCorp
Employee
582 Views

Hello Ian,

Your test fails because that plugin's namespace is not within a global object named "plugin." There is no required or standard location where plugins are placed in the namespace, although window.plugin and cordova.plugin are used, there are many other places those plugins may reside.

Within that template that you used, there are two lines that, if you set them to true, will spit out a bunch of useful console messages, including one that lists the plugins that are included in your app. I took your app and enabled those lines, built the app (with "debuggable" set to "true" in the additions.xml file), attached it to my laptop and used Chrome to utilize the remote debug feature (this only works with Android 4.4 and higher devices). Attached is an image showing the results of those console.log messages, along with a few commands I typed into the console, at the very end.

Note that if you try this in the Emulate tab, with App Preview or using the Debug tab you will not see your third-party plugin. The only way to debug an app that contains third-party plugins is to build it and run it on a real device (which is what I did here). We are working on a more convenient solution to this problem, but that option is currently not available, so an Android 4.4+ device with Chrome is your best option. If you have a Mac, you can do the same with an iOS device and Safari, on the Mac.

If you look inside the plugins.xml file for that LowLatency plugin you'll see some lines like the following:

    <js-module src="www/LowLatencyAudio.js" name="LowLatencyAudio">
    	<clobbers target="window.LowLatencyAudio" />
    </js-module>

which shows the namespace that the plugin's API resides within. You can see that in the attached image, as well. The code below can be used to enumerate all of the plugins that are part of your build, it is the code that generated the list of plugins in the attached image.

    if( window.cordova && cordova.version ) {                   // only works in Cordova 3.x
        app.consoleLog("cordova.version: " + cordova.version) ; // print new Cordova 3.x version string...

        if( cordova.require ) {                                 // print included cordova plugins
            app.consoleLog(JSON.stringify(cordova.require('cordova/plugin_list').metadata, null, 1)) ;
        }
    }

If you're having some troubles debugging your app, I recommend using the "debuggable" equals "true" approach on an Android 4.4+ device with remote Chrome. More hints on how to do that can be found here: https://software.intel.com/en-us/xdk/docs/intel-xdk-debug-and-test-overview#RemoteChromeDevTools.

Screen Shot 2015-05-01 at 2.30.09 PM.png

0 Kudos
Ian_I_
Beginner
581 Views

Paul, thanks so much for the detailed response: I really, really appreciate it. Part of my problem is that the plug-in changed without my realization; so originally it had been under window.plugins but moved, and that caused my confusion. I wasn't aware of that new(er) debugging option on android/chrome… that is awesome. Thanks again for all the useful information.

Ian Ippolito

0 Kudos
Reply