fix(device_selection_popup): On Firefox

modules/transport/Transport.js

@@ -233,9 +233,11 @@ export default class Transport {
 
         return new Promise((resolve, reject) => {
             this._responseHandlers.set(id, ({ error, result }) => {
-                if (result) {
+                if (typeof result !== 'undefined') {
                     resolve(result);
-                } else if (error) {
+
+                // eslint-disable-next-line no-negated-condition
+                } else if (typeof error !== 'undefined') {
                     reject(error);
                 } else { // no response
                     reject(new Error('Unexpected response format!'));

react/features/device-selection/DeviceSelectionPopup.js

@@ -61,9 +61,9 @@ export default class DeviceSelectionPopup {
             disableAudioInputChange: true,
             disableDeviceChange: true,
             hasAudioPermission: JitsiMeetJS.mediaDevices
-                .isDevicePermissionGranted('audio'),
+                .isDevicePermissionGranted.bind(null, 'audio'),
             hasVideoPermission: JitsiMeetJS.mediaDevices
-                .isDevicePermissionGranted('video'),
+                .isDevicePermissionGranted.bind(null, 'video'),
             hideAudioInputPreview: !JitsiMeetJS.isCollectingLocalStats(),
             hideAudioOutputSelect: true
         };
@@ -139,12 +139,14 @@ export default class DeviceSelectionPopup {
             this._getAvailableDevices(),
             this._isDeviceListAvailable(),
             this._isDeviceChangeAvailable(),
+            this._isDeviceChangeAvailable('output'),
             this._getCurrentDevices(),
             this._isMultipleAudioInputSupported()
         ]).then(([
             availableDevices,
             listAvailable,
             changeAvailable,
+            changeOutputAvailable,
             currentDevices,
             multiAudioInputSupported
         ]) => {
@@ -155,7 +157,7 @@ export default class DeviceSelectionPopup {
                 currentVideoInputId: currentDevices.videoInput,
                 disableAudioInputChange: !multiAudioInputSupported,
                 disableDeviceChange: !listAvailable || !changeAvailable,
-                hideAudioOutputSelect: !changeAvailable
+                hideAudioOutputSelect: !changeOutputAvailable
             });
         });
     }
@@ -164,10 +166,13 @@ export default class DeviceSelectionPopup {
      * Returns Promise that resolves with true if the device change is available
      * and with false if not.
      *
+     * @param {string} [deviceType] - Values - 'output', 'input' or undefined.
+     * Default - 'input'.
      * @returns {Promise}
      */
-    _isDeviceChangeAvailable() {
+    _isDeviceChangeAvailable(deviceType) {
         return this._transport.sendRequest({
+            deviceType,
             type: 'devices',
             name: 'isDeviceChangeAvailable'
         }).catch(e => {

react/features/device-selection/actions.js

@@ -51,9 +51,9 @@ function _openDeviceSelectionDialogHere() {
                     disableDeviceChange: !isDeviceListAvailable
                         || !JitsiMeetJS.mediaDevices.isDeviceChangeAvailable(),
                     hasAudioPermission: JitsiMeetJS.mediaDevices
-                        .isDevicePermissionGranted('audio'),
+                        .isDevicePermissionGranted.bind(null, 'audio'),
                     hasVideoPermission: JitsiMeetJS.mediaDevices
-                        .isDevicePermissionGranted('video'),
+                        .isDevicePermissionGranted.bind(null, 'video'),
                     hideAudioInputPreview:
                         !JitsiMeetJS.isCollectingLocalStats(),
                     hideAudioOutputSelect: !JitsiMeetJS.mediaDevices
@@ -144,7 +144,8 @@ function _processRequest(dispatch, getState, request, responseCallback) {
             break;
         case 'isDeviceChangeAvailable':
             responseCallback(
-                JitsiMeetJS.mediaDevices.isDeviceChangeAvailable());
+                JitsiMeetJS.mediaDevices.isDeviceChangeAvailable(
+                    request.deviceType));
             break;
         case 'isMultipleAudioInputSupported':
             responseCallback(JitsiMeetJS.isMultipleAudioInputSupported());

react/features/device-selection/components/DeviceSelectionDialog.js

@@ -66,14 +66,16 @@ class DeviceSelectionDialog extends Component {
         dispatch: React.PropTypes.func,
 
         /**
-         * Whether or not a new audio input source can be selected.
+         * Function that checks whether or not a new audio input source can be
+         * selected.
          */
-        hasAudioPermission: React.PropTypes.bool,
+        hasAudioPermission: React.PropTypes.func,
 
         /**
-         * Whether or not a new video input sources can be selected.
+         * Function that checks whether or not a new video input sources can be
+         * selected.
          */
-        hasVideoPermission: React.PropTypes.bool,
+        hasVideoPermission: React.PropTypes.func,
 
         /**
          * If true, the audio meter will not display. Necessary for browsers or

react/features/device-selection/components/DeviceSelectionDialogBase.js

@@ -71,14 +71,16 @@ class DeviceSelectionDialogBase extends Component {
         disableDeviceChange: React.PropTypes.bool,
 
         /**
-         * Whether or not a new audio input source can be selected.
+         * Function that checks whether or not a new audio input source can be
+         * selected.
          */
-        hasAudioPermission: React.PropTypes.bool,
+        hasAudioPermission: React.PropTypes.func,
 
         /**
-         * Whether or not a new video input sources can be selected.
+         * Function that checks whether or not a new video input sources can be
+         * selected.
          */
-        hasVideoPermission: React.PropTypes.bool,
+        hasVideoPermission: React.PropTypes.func,
 
         /**
          * If true, the audio meter will not display. Necessary for browsers or
@@ -381,7 +383,7 @@ class DeviceSelectionDialogBase extends Component {
         const configurations = [
             {
                 devices: availableDevices.videoInput,
-                hasPermission: this.props.hasVideoPermission,
+                hasPermission: this.props.hasVideoPermission(),
                 icon: 'icon-camera',
                 isDisabled: this.props.disableDeviceChange,
                 key: 'videoInput',
@@ -391,7 +393,7 @@ class DeviceSelectionDialogBase extends Component {
             },
             {
                 devices: availableDevices.audioInput,
-                hasPermission: this.props.hasAudioPermission,
+                hasPermission: this.props.hasAudioPermission(),
                 icon: 'icon-microphone',
                 isDisabled: this.props.disableAudioInputChange
                     || this.props.disableDeviceChange,
@@ -405,8 +407,8 @@ class DeviceSelectionDialogBase extends Component {
         if (!this.props.hideAudioOutputSelect) {
             configurations.push({
                 devices: availableDevices.audioOutput,
-                hasPermission: this.props.hasAudioPermission
-                    || this.props.hasVideoPermission,
+                hasPermission: this.props.hasAudioPermission()
+                    || this.props.hasVideoPermission(),
                 icon: 'icon-volume',
                 isDisabled: this.props.disableDeviceChange,
                 key: 'audioOutput',

react/features/device-selection/popup.js

@@ -3,10 +3,14 @@ import 'aui-experimental-css';
 
 import DeviceSelectionPopup from './DeviceSelectionPopup';
 
+declare var JitsiMeetJS: Object;
+
 let deviceSelectionPopup;
 
 window.init = function(i18next) {
+    JitsiMeetJS.init({}).then(() => {
         deviceSelectionPopup = new DeviceSelectionPopup(i18next);
+    });
 };
 
 window.addEventListener('beforeunload', () =>

static/deviceSelectionPopup.html

@@ -8,9 +8,9 @@
     <script><!--#include virtual="/interface_config.js" --></script>
     <script>
         window.config = {};
-        window.JitsiMeetJS = window.opener.window.JitsiMeetJS;
     </script>
-    <script src="libs/device_selection_popup_bundle.min.js"></script>
+    <script src="libs/lib-jitsi-meet.min.js?v=139"></script>
+    <script src="libs/device_selection_popup_bundle.min.js?v=1"></script>
     <link rel="stylesheet" href="css/all.css">
   </head>
   <body>