cordova-plugin-fcm-with-dependecy-updated: TypeError: Cannot read property 'requestPushPermission' of undefined

Hey guys, I’m having this problem as well.

I’m using the setup() method like @andrehtissot and the imports like @elkhalifte. But the error is that firebase service is undefined.

const permission = await this.firebase.requestPushPermission()
TypeError: Cannot read property 'requestPushPermission' of undefined

_Originally posted by @tiagotrigger in https://github.com/andrehtissot/cordova-plugin-fcm-with-dependecy-updated/issues/113#issuecomment-656883810_

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 26 (14 by maintainers)

Most upvoted comments

It was a very strange issue. But if you can keep it up-to-date with newer versions of cordova-android, you lower the risks of facing issues on newer devices.

Thank you very much @andrehtissot it is working now. And sorry for the trouble.

A summary of what was changed:

  • changed cordova-android of 7.1.4 to 9.0.0
  • changed android-minSdkVersion of 19 to 22
  • added cordova-plugin-androidx and cordova-plugin-androidx-adapter
  • added package.json plugin fcm variables
"cordova-plugin-fcm-with-dependecy-updated": {
  "ANDROID_GRADLE_TOOLS_VERSION": "4.0.0",
  "ANDROID_FCM_VERSION": "19.0.0",
  "ANDROID_GOOGLE_SERVICES_VERSION": "4.3.3",
  "ANDROID_DEFAULT_NOTIFICATION_ICON": "@mipmap/ic_launcher"
}

Sure here it is.

{
  "name": "myapp",
  "version": "1.0.4",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "resolutions": {
    "@babel/preset-env": "7.5.5"
  },
  "dependencies": {
    "@angular/animations": "^8.2.14",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "~8.1.2",
    "@angular/core": "~8.1.2",
    "@angular/forms": "~8.1.2",
    "@angular/material": "~7.3.7",
    "@angular/platform-browser": "~8.1.2",
    "@angular/platform-browser-dynamic": "~8.1.2",
    "@angular/pwa": "^0.901.9",
    "@angular/router": "~8.1.2",
    "@angular/service-worker": "~8.1.2",
    "@code-square/stamper-models": "^1.0.81",
    "@code-square/ts-utils": "^1.0.10",
    "@fortawesome/angular-fontawesome": "^0.6.1",
    "@fortawesome/fontawesome-svg-core": "^1.2.28",
    "@fortawesome/free-brands-svg-icons": "^5.13.0",
    "@fortawesome/free-solid-svg-icons": "^5.13.0",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/device": "^5.27.0",
    "@ionic-native/fcm": "^5.27.0",
    "@ionic-native/geolocation": "^5.26.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^4.7.1",
    "@ionic/storage": "^2.2.0",
    "@ngx-share/button": "~7.1.4",
    "angular-validate-br": "0.1.0-beta",
    "cordova-android": "7.1.4",
    "cordova-ios": "5.1.1",
    "cordova-plugin-fcm-with-dependecy-updated": "^7.0.6",
    "cordova-plugin-geolocation": "^4.0.2",
    "core-js": "^2.5.4",
    "ngx-google-analytics": "^8.0.0",
    "ngx-mask": "^8.1.7",
    "ngx-mask-ionic": "^1.1.2",
    "ngx-sharebuttons": "~8.0.0",
    "ngx-social-share": "^1.0.0",
    "ngx-spinner": "^9.0.2",
    "rxjs": "~6.5.1",
    "tslib": "^1.9.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.801.2",
    "@angular-devkit/build-angular": "^0.803.24",
    "@angular-devkit/core": "~8.1.2",
    "@angular-devkit/schematics": "~8.1.2",
    "@angular/cli": "~8.1.2",
    "@angular/compiler": "~8.1.2",
    "@angular/compiler-cli": "~8.1.2",
    "@angular/language-service": "~8.1.2",
    "@babel/compat-data": "~7.8.0",
    "@ionic/angular-toolkit": "^2.1.1",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "cordova-plugin-device": "^2.0.3",
    "cordova-plugin-ionic-keyboard": "^2.2.0",
    "cordova-plugin-ionic-webview": "^4.2.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "pwa-asset-generator": "^3.1.1",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "tslint-eslint-rules": "~5.4.0",
    "typescript": "~3.4.3"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-geolocation": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-fcm-with-dependecy-updated": {}
    },
    "platforms": [
      "ios",
      "android"
    ]
  }
}

I’m getting an error when building my project. Using Angular 8 and Typescript 3.4.5.

C:\c2\mb\notification-test>ionic cordova run android
[INFO] Hardware device(s) found for android. Using --device.
> ng.cmd run app:ionic-cordova-build --platform=android
Browserslist: caniuse-lite is outdated. Please run the following command: `npm update`

ERROR in node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:2:13 - error TS1005: '=' expected.

2 import type { IChannelConfiguration } from '../../www/IChannelConfiguration';
              ~
node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:2:44 - error TS1005: ';' expected.

2 import type { IChannelConfiguration } from '../../www/IChannelConfiguration';
                                             ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:3:13 - error TS1005: '=' expected.

3 import type { INotificationPayload } from '../../www/INotificationPayload';
              ~
node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:3:43 - error TS1005: ';' expected.

3 import type { INotificationPayload } from '../../www/INotificationPayload';
                                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:4:13 - error TS1005: '=' expected.

4 import type { IRequestPushPermissionOptions } from '../../www/IRequestPushPermissionOptions';
              ~
node_modules/cordova-plugin-fcm-with-dependecy-updated/ionic/ngx/FCM.d.ts:4:52 - error TS1005: ';' expected.

4 import type { IRequestPushPermissionOptions } from '../../www/IRequestPushPermissionOptions';
                                                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[ERROR] An error occurred while running subprocess ng.

        ng.cmd run app:ionic-cordova-build --platform=android exited with exit code 1.

        Re-running this command with the --verbose flag may provide more information.