fix(giphy-integration) Fix input issues (#11601)

Fix auto focus on menu open
Fix unable to use space in input

react/features/base/premeeting/components/web/InputField.js

@@ -2,7 +2,6 @@
 
 import React, { PureComponent } from 'react';
 
-import { isMobileBrowser } from '../../../environment/utils';
 import { getFieldValue } from '../../../react';
 
 type Props = {
@@ -131,11 +130,16 @@ export default class InputField extends PureComponent<Props, State> {
                 onChange = { this._onChange }
                 onFocus = { this._onFocus }
                 onKeyDown = { this._onKeyDown }
+                onKeyPress = { this._onKeyPress }
                 placeholder = { this.props.placeHolder }
                 readOnly = { this.props.readOnly }
                 // eslint-disable-next-line react/jsx-no-bind
-                ref = { inputElement => this.props.autoFocus && isMobileBrowser()
+                ref = { inputElement => {
-                    && inputElement && inputElement.focus() }
+                    if (this.props.autoFocus) {
+                        inputElement && inputElement.focus();
+                        setTimeout(() => inputElement && inputElement.focus(), 200);
+                    }
+                } }
                 type = { this.props.type }
                 value = { this.state.value } />
         );
@@ -200,4 +204,14 @@ export default class InputField extends PureComponent<Props, State> {
 
         onSubmit && event.key === 'Enter' && onSubmit();
     }
+
+    /**
+     * Stop event propagation on key press.
+     *
+     * @param {Event} event - Key press event object.
+     * @returns {void}
+     */
+    _onKeyPress(event) {
+        event.stopPropagation();
+    }
 }