Cordova plugins' <clobbers> tags don't work in Ionic


#1

I recently created an Ionic 2 project using Typescript and I cannot use plugins using the object they declare in their tag. If I try, for instance, to use InAppBrowser, which is supposed to be accessible through cordova.InAppBrowser.open(), I get an error because the global cordova object is undefined.

Two more plugins affected by this are SocialSharing and NativeAudio.

InAppBrowser also clobbers window.open(), and that one works; my guess is because that method already exists. I’ve verified that it is indeed calling the plugin’s version of open(), and succeeding, so the plugin is loading for sure. To reiterate, the plugin loads, and successfully clobbers window.open(), and does not successfully clobber cordova.InAppBrowser.open().

With InAppBrowser, I can work around this issue by using window.open(), but with the other plugins this bug renders them entirely unusable.

I’ve mentioned my issue in a few other topics, and I don’t seem to be the only one having these difficulties. Someone else noted that cordova.InAppBrowser.open() doesn’t exist, and another user is struggling with the Social Sharing plugin. I earlier misdiagnosed the issue as all plugins entirely failing to load, but I have ruled that out at this point.

So, does anyone know what the problem is? I suspect a bug in Ionic 2, or the latest version of the starter code.

I do not believe the cause is a lack of .d.ts files. I have created them for each of these plugins, and the compile-time errors go away, but the run-time errors do not. Besides, my understanding is that type errors at compile time are unimportant; if I don’t include the .d.ts file for a working plugin, it spits out errors at compile time, but works at runtime.


Cordova plugins supported in Ionic?
#2

This worked for me

Create a file cordova.d.ts with below code in Typings folder
interface Window { plugins: any; }

Reference it in main.d.ts as
/// <reference path="./cordova.d.ts"/>
and I’m able to use window.plugins.socialsharing.share(‘Message only’);

Regarding InAppBrowser I added below code and it worked.
declare let cordova: any;

This is my Env
`Your system information:

Cordova CLI: 6.0.0
Gulp version: CLI version 3.9.0
Gulp local:
Ionic Version: 2.0.0-beta.1
Ionic CLI Version: 2.0.0-beta.17
Ionic App Lib Version: 2.0.0-beta.8
ios-deploy version: 1.8.2
ios-sim version: 5.0.1
OS: Mac OS X El Capitan
Node Version: v0.12.7
Xcode version: Xcode 7.2.1 Build version 7C1002
`


#3

Thanks for answering. I haven’t tried it out because we’ve decided to go back to Ionic 1 for the time being, for this and other reasons, but I appreciate that you took the time to try to help me nonetheless.


#4

if you don’t mine can u share the folder structure where we need to create typings folder and where will be main.d.ts file?