Social Share not working (Ionic 5)

Hi All

I am trying to implement Ionic Social Share and so far its giving me issues to a point where I am about to give up on it.

App Details

Ionic:

   Ionic CLI                     : 6.12.1 (C:\Users\xxx\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework               : @ionic/angular 5.3.2
   @angular-devkit/build-angular : 0.1000.8
   @angular-devkit/schematics    : 10.0.8
   @angular/cli                  : 10.0.8
   @ionic/angular-toolkit        : 2.3.3

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.2.1, (and 18 other plugins)

Plugin Details

"@ionic-native/social-sharing": "^5.27.0",
"cordova-plugin-x-socialsharing": "^5.6.8",

Error DEtails

ERROR Error: Uncaught (in promise): Class not found
    at T (polyfills-es2015.f432bc0bb7242979dc1a.js:1)
    at polyfills-es2015.f432bc0bb7242979dc1a.js:1
    at Object.callbackFromNative (cordova.c464b14390c8a3bb44df.js:1)

image

It is virtually impossible to debug production mode builds. Does your problem persist even when building in debug mode?

I get this in debug mode

ERROR Error: Uncaught (in promise): Class not found
    at resolvePromise (polyfills-es2015.js:3904)
    at polyfills-es2015.js:3811
    at Object.callbackFromNative (cordova.js:289)
    at processMessage (cordova.js:1129)
    at processMessages (cordova.js:1152)
    at ZoneDelegate.invoke (polyfills-es2015.js:3470)
    at Object.onInvoke (vendor-es2015.js:69538)
    at ZoneDelegate.invoke (polyfills-es2015.js:3469)
    at Zone.run (polyfills-es2015.js:3229)
    at polyfills-es2015.js:3963

I did encounter this issue as well managed to resolved:

Error on console showing when I “ionic cordova run android -l -external”:

[cordova] FAILURE: Build failed with an exception.
[cordova]
[cordova] * What went wrong:
[cordova] Execution failed for task ':app:mergeDebugResources'.
[cordova] > This project uses AndroidX dependencies, but the 'android.useAndroidX' property is not enabled. Set this property to true in the gradle.properties file and retry.
[cordova]   The following AndroidX dependencies are detected: androidx.versionedparcelable:versionedparcelable:1.0.0, androidx.slidingpanelayout:slidingpanelayout:1.0.0, androidx.fragment:fragment:1.0.0, androidx.core:core:1.0.0, androidx.customview:customview:1.0.0, androidx.swiperefreshlayout:swiperefreshlayout:1.0.0, androidx.interpolator:interpolator:1.0.0, androidx.loader:loader:1.0.0, androidx.drawerlayout:drawerlayout:1.0.0, androidx.viewpager:viewpager:1.0.0, androidx.collection:collection:1.0.0, androidx.localbroadcastmanager:localbroadcastmanager:1.0.0, androidx.lifecycle:lifecycle-common:2.0.0, androidx.arch.core:core-common:2.0.0, androidx.annotation:annotation:1.0.0, androidx.lifecycle:lifecycle-livedata:2.0.0, androidx.legacy:legacy-support-core-ui:1.0.0, androidx.lifecycle:lifecycle-viewmodel:2.0.0, androidx.lifecycle:lifecycle-livedata-core:2.0.0, androidx.legacy:legacy-support-v4:1.0.0, androidx.media:media:1.0.0, androidx.arch.core:core-runtime:2.0.0, androidx.legacy:legacy-support-core-utils:1.0.0, androidx.documentfile:documentfile:1.0.0, androidx.cursoradapter:cursoradapter:1.0.0, androidx.lifecycle:lifecycle-runtime:2.0.0, androidx.coordinatorlayout:coordinatorlayout:1.0.0, androidx.asynclayoutinflater:asynclayoutinflater:1.0.0, androidx.print:print:1.0.0

By adding androidx cordova plugin as follows solves my issue:

  1. ionic cordova plugin add cordova-plugin-androidx
  2. ionic cordova plugin add cordova-plugin-androidx-adapter

However, next thing I encounter now is the plugin getting Sharing Failed on Whatsapp.

Updated my solution here in case anyone stumbled across the same issue:
So, instead of using the .share() function which is bugged for me in ionic 5 android@9.0.0 I done it specifically to detect either FB or WS to share out the message. Last would be email if FB and WS not shareable.

goto_share() {
    let title = "My Brand";
    let message = "Hi! Just to let you know about My Brand, a platform for this this this! Visit https://www.google.com now!";
    this.shareWhatsapp(message, title).then(shared => {
      if (!shared) {
        this.shareFacebook(message, title).then(shared => {
          if (!shared) {
            this.shareNormal(message, title)
          }
        })
      }
    });

  }

  shareWhatsapp(message, title) {
    return new Promise((resolve) => {
      this.social.canShareVia("whatsapp", message, title).then(
        (e) => {
          if (e != "OK") {
            this.social.shareVia("whatsapp", message, title)
            resolve(true)
          }
          else resolve(false)
        });
    })
  }

  shareFacebook(message, title) {
    return new Promise((resolve) => {
      this.social.canShareVia("facebook", message, title).then(
        (e) => {
          if (e != "OK") {
            this.social.shareVia("facebook", message, title)
            resolve(true)
          }
          else resolve(false)
        });
    })
  }

  shareNormal(message, title) {
    return new Promise((resolve) => {
      try {

        //this code is buggy, file parameter must not empty only can work. However whatsapp sharing will cause error
//this.social.share(message,title,"1");

        this.social.shareViaEmail(message, title, []);
        resolve(true)
      } catch (e) {
        resolve(false)
      }
    })
  }