capacitor-community / barcode-scanner

A fast and efficient (QR) barcode scanner for Capacitor
MIT License
437 stars 172 forks source link

Calling method checkPermissions on plugin in ml-kit branch returns undefined #149

Closed ferranJS closed 2 years ago

ferranJS commented 2 years ago

Describe the bug This problem ocurrs when trying to calling BarcodeScanner.checkPermissions() function in iOS in ml-kit branch: ⚡️ To Native -> CapacitorCommunityBarcodeScanner checkPermissions 131742848 ⚡️ TO JS undefined ⚡️ [log] - status: undefined ⚡️ [log] - some problem with the camera

The start method returns -1. The request permission method does return an error, but I'm assuming by the plugin.m file that it isn't really implemented.

To Reproduce Steps to reproduce the behavior:

npm run build -> npx cap sync -> npx cap run ios or in xcode Then when app launches and I click the button where the method is associated, xcode gives me that error.

Expected behavior That the app the functions work as intended, giving me a valid value.

Version package.json:

{
  "name": "test",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/common": "^14.0.0",
    "@angular/core": "^14.0.0",
    "@angular/forms": "^14.0.0",
    "@angular/platform-browser": "^14.0.0",
    "@angular/platform-browser-dynamic": "^14.0.0",
    "@angular/router": "^14.0.0",
    "@capacitor-community/barcode-scanner": "github:capacitor-community/barcode-scanner#ml-kit",
    "@capacitor/core": "^3.7.0",
    "@capacitor/ios": "^3.7.0",
    "@ionic/angular": "^6.1.9",
    "rxjs": "~6.6.0",
    "tslib": "^2.2.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^14.0.0",
    "@angular-eslint/builder": "~13.0.1",
    "@angular-eslint/eslint-plugin": "~13.0.1",
    "@angular-eslint/eslint-plugin-template": "~13.0.1",
    "@angular-eslint/template-parser": "~13.0.1",
    "@angular/compiler": "^14.0.0",
    "@angular/compiler-cli": "^14.0.0",
    "@angular/language-service": "^14.0.0",
    "@capacitor/cli": "4.1.0",
    "@ionic/angular-toolkit": "^6.0.0",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "@typescript-eslint/eslint-plugin": "5.3.0",
    "@typescript-eslint/parser": "5.3.0",
    "eslint": "^7.6.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-jsdoc": "30.7.6",
    "eslint-plugin-prefer-arrow": "1.2.2",
    "jasmine-core": "~3.8.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.3.2",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "typescript": "~4.7.3"
  },
  "description": "An Ionic project"
}

Desktop (please complete the following information):

Smartphone (please complete the following information):

Additional context It is a new blank project. The project compiles in www without problems and the version of the plugin indicated in xcode when compiling is 3.0.1 so I don't understand how this is happening. The code: html:

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title> Tab 1 </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <ion-header collapse="condense">
    <ion-toolbar>
      <ion-title size="large">Tab 1</ion-title>
    </ion-toolbar>
  </ion-header>

  <ion-button (click)="startScan()">scan</ion-button>
</ion-content>

page.ts:

import { Component } from '@angular/core';
// import { BarcodeScanner } from '@capacitor-community/barcode-scanner';
import { BarcodeScanner } from '@capacitor-community/barcode-scanner';
@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
})
export class Tab1Page {
  constructor() {}
  async startScan() {
    // BarcodeScanner.hideBackground(); // make background of WebView transparent
    console.log('tryin to scan!');
    // console.log(BarcodeScanner);
    const status = await BarcodeScanner.checkPermissions();
    console.log('status:', status);
    if (status !== 'granted') {
      console.log(
        'some problem with the camera\n',
        'If you want to grant permission for using your camera, enable it in the app settings.'
      );
      const req = await BarcodeScanner.requestPermissions();
      console.log('request:', req);
    } else if (status === 'granted') {
      console.log('camera permission granted!');
    }

    const result = await BarcodeScanner.start(); // start scanning and wait for a result

    // if the result has content
    console.log('result?');
    if (result) {
      console.log(result); // log the raw scanned content
    }
  }
}
ferranJS commented 2 years ago

angular target in tsconfig is es5 because of it is an old iPhone and info.plist camera permissions are set

thegnuu commented 2 years ago

@fewNeurons the ml-kit branch is a complete work in progress (and kind of a mess) and it is very well possible that the requestPermission stuff is broken. The plan was to rewrite the permission check completely since the current implementation is far from perfect anyways, so my plan was to use the same implementation that is used in https://github.com/ionic-team/capacitor-plugins/tree/main/camera

A simple workaround for now would be to just use this plugin for the permission check, with this workaround you can at least test the ml-kit implementation....

Unfortunately this branch does not have the highest priority atm since I was not able to find anyone who is willing help me develop the android part of it (I am not really used to develop Android apps and it would take me ages to do that all myself).

Thank you anyways for testing it out and I will have a loot at it once I find time to do so.

Right now I think that we need to create a different plugin for the ml-kit stuff anyways, I am not sure about this.

ferranJS commented 2 years ago

Hi @thegnuu, thank you for your response and your workaround suggestion. Another plugin seams right in a future. I have been thinking of implementing the Android version myself. I will be updating you about my progress!

thegnuu commented 2 years ago

If you are willing to implement some android code and help out here this would be awesome. The current "discussion" is found here #107

I will close this issue for now, keeping this issue in my backlog for the ml-kit stuff. Feel free to ask question or post news on the ml-kit issue!

Thank you!

ferranJS commented 2 years ago

Hi again, I've made it able to work in this quick demo https://github.com/fewNeurons/barcode-scanner-test.

Bhagatameya21 commented 5 months ago

@ferranJS Can you please share how did u resolve it Facing similar issues in mlkit Error calling method requestPermissions on plugin BarcodeScanner: No method found.