Electron app not asking for Camera and Microphone permission on macOS Monterey

Question

I have built an application of stack electron and reactjs. I am trying to access the camera and microphone from the application. But the app does not ask for permission when requested and also it does not show in the System Preferences -> Security and Privacy under camera and microphone. Below are the versions I am using:

"electron": "^15.3.0",
"electron-builder": "^22.14.5",
"electron-devtools-installer": "^3.2.0",
"electron-notarize": "^1.1.1",
"electron-rebuild": "^3.2.3", 
"react": "^17.0.2"

Let me know what I am missing or needs to be changed. Thanks in advance.

Answer 1

I also had this problem it worked fine in macOS Catalina but in Monterey sometimes it didn't.

I solved after reading this in the electron official documentation:

"If you plan to access the microphone or camera within your app using Electron's APIs, you'll also need to add the following entitlements"

<key>com.apple.security.device.audio-input</key>
<true/>
<key>com.apple.security.device.camera</key>
<true/>

To add the entitlements since you are using electron-builder there's a config that you can use in package.json to add it under "mac" you add this:

"extendInfo": {
        "NSMicrophoneUsageDescription": "Please give us access to your microphone",
        "NSCameraUsageDescription": "Please give us access to your camera",
        "com.apple.security.device.audio-input": true,
        "com.apple.security.device.camera": true
      },

And then you need to add the following lines to ask for media permissions:

const { systemPreferences } = require('electron')

const microphone = systemPreferences.askForMediaAccess('microphone');
const camera = systemPreferences.askForMediaAccess('camera');