fix: input not work at firefox #2151 #2215

Author: tangjinzhou

components/_util/antInputDirective.js

@@ -17,15 +17,12 @@ function makeMap(str, expectsLowerCase) {
 const isTextInputType = makeMap('text,number,password,search,email,tel,url');
 
 function onCompositionStart(e) {
-  e.target.originPlaceholder = e.target.placeholder;
-  e.target.placeholder = '';
   e.target.composing = true;
 }
 
 function onCompositionEnd(e) {
   // prevent triggering an input event for no reason
   if (!e.target.composing) return;
-  e.target.placeholder = e.target.originPlaceholder;
   e.target.composing = false;
   trigger(e.target, 'input');
 }

components/input/Input.jsx

@@ -173,12 +173,9 @@ export default {
       });
     },
     handleChange(e) {
-      if (e.inputType === 'insertCompositionText') {
-        return;
-      }
       const { value, composing } = e.target;
       // https://github.com/vueComponent/ant-design-vue/issues/2203
-      if ((composing && this.lazy) || this.stateValue === value) return;
+      if (((e.isComposing || composing) && this.lazy) || this.stateValue === value) return;
       this.setValue(value, this.clearPasswordValueAttribute);
       resolveOnChange(this.$refs.input, e, this.onChange);
     },

components/input/TextArea.jsx

@@ -69,11 +69,8 @@ export default {
       this.$emit('input', e);
     },
     handleChange(e) {
-      if (e.inputType === 'insertCompositionText') {
-        return;
-      }
       const { value, composing } = e.target;
-      if ((composing && this.lazy) || this.stateValue === value) return;
+      if (((e.isComposing || composing) && this.lazy) || this.stateValue === value) return;
 
       this.setValue(e.target.value, () => {
         this.$refs.resizableTextArea.resizeTextarea();

components/vc-calendar/src/date/DateInput.jsx

@@ -85,7 +85,7 @@ const DateInput = {
     onInputChange(e) {
       const { value: str, composing } = e.target;
       const { str: oldStr = '' } = this;
-      if (composing || oldStr === str) return;
+      if (e.isComposing || composing || oldStr === str) return;
 
       const { disabledDate, format, selectedValue } = this.$props;
 

components/vc-mentions/src/Mentions.jsx

@@ -72,8 +72,8 @@ const Mentions = {
       }
       this.$emit('change', value);
     },
-    onChange({ target: { value, composing } }) {
-      if (composing) return;
+    onChange({ target: { value, composing }, isComposing }) {
+      if (isComposing || composing) return;
       this.triggerChange(value);
     },
     onKeyDown(event) {

components/vc-pagination/Options.jsx

@@ -33,7 +33,7 @@ export default {
     },
     handleChange(e) {
       const { value, composing } = e.target;
-      if (composing || this.goInputText === value) return;
+      if (e.isComposing || composing || this.goInputText === value) return;
       this.setState({
         goInputText: value,
       });

components/vc-pagination/Pagination.jsx

@@ -195,7 +195,7 @@ export default {
       }
     },
     handleKeyUp(e) {
-      if (e.target.composing) return;
+      if (e.isComposing || e.target.composing) return;
       const value = this.getValidValue(e);
       const stateCurrentInputValue = this.stateCurrentInputValue;
 

components/vc-select/Select.jsx

@@ -323,7 +323,7 @@ const Select = {
     onInputChange(e) {
       const { value: val, composing } = e.target;
       const { _inputValue = '' } = this.$data;
-      if (composing || _inputValue === val) {
+      if (e.isComposing || composing || _inputValue === val) {
         this.setState({
           _mirrorInputValue: val,
         });

components/vc-time-picker/Header.jsx

@@ -61,7 +61,7 @@ const Header = {
     onInputChange(e) {
       const { value: str, composing } = e.target;
       const { str: oldStr = '' } = this;
-      if (composing || oldStr === str) return;
+      if (e.isComposing || composing || oldStr === str) return;
 
       this.setState({
         str,

components/vc-tree-select/src/SearchInput.jsx

@@ -98,7 +98,7 @@ const SearchInput = {
     handleInputChange(e) {
       const { value, composing } = e.target;
       const { searchValue = '' } = this;
-      if (composing || searchValue === value) {
+      if (e.isComposing || composing || searchValue === value) {
         this.mirrorSearchValue = value;
         return;
       }