Capacitor: Camera API not working - cameraModal.present is not a function

[FazioNico]

Hi.

I've try the Capacitor Camera API...
Simple to settup but in fact it not realy work.
Here the returned error from an Ionic 4 + Angular 6 application.

Following code bug:

import { Component, OnInit } from '@angular/core';
import { Plugins, CameraResultType, FilesystemDirectory } from '@capacitor/core';

const { Camera, Filesystem } = Plugins;

@Component({
  selector: 'app-tab-three',
  templateUrl: './tab-three.component.html',
  styleUrls: ['./tab-three.component.css']
})
export class TabThreeComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

  takePhoto() {
    const options = {
      resultType: CameraResultType.Uri
    };
    Camera.getPhoto(options).then(
        (photo) => {
            console.log(photo);
        }, (err) => {
            console.log(err);
        }
    );
  }
}

Error:

core.js:1598 ERROR Error: Uncaught (in promise): TypeError: cameraModal.present is not a function
TypeError: cameraModal.present is not a function
    at CameraPluginWeb.<anonymous> (camera.js:49)
    at step (tslib.es6.js:91)
    at Object.next (tslib.es6.js:72)
    at fulfilled (tslib.es6.js:62)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4062)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at CameraPluginWeb.<anonymous> (camera.js:49)
    at step (tslib.es6.js:91)
    at Object.next (tslib.es6.js:72)
    at fulfilled (tslib.es6.js:62)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4062)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at resolvePromise (zone.js:814)
    at zone.js:724
    at fulfilled (tslib.es6.js:62)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:4062)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4053)

[mlynch]

You need to have this script include for now in your index.html:

https://github.com/ionic-team/capacitor/blob/master/example/src/index.html#L14

[dotnetdreamer]

@mlynch i am having this issue too. Why is this script necessary?

[servrox]

--> open issue: https://github.com/ionic-team/capacitor/issues/658

[alejandroquadri]

@mlynch solution worked for me on ionic 4.0

[davidseek]

worked for me as well.
but creeps me out that it's not part
of stable build since this came up a year ago.

makes me question,
how stable this whole stuff overall is.