Skip to content

Commit

Permalink
fix: always install composition event listeners
Browse files Browse the repository at this point in the history
Previously the installation was skipped on Android because
it was not needed for Chinese IME - however some IMEs such
as Japanese exhibits the same behavior as on other browers.

So it is safer to always enable the check. Closes #7367
  • Loading branch information
yyx990803 committed Mar 7, 2018
1 parent 3eb37ac commit f7ca21e
Show file tree
Hide file tree
Showing 2 changed files with 22 additions and 26 deletions.
8 changes: 3 additions & 5 deletions src/platforms/web/runtime/directives/model.js
Expand Up @@ -6,7 +6,7 @@
import { isTextInputType } from 'web/util/element'
import { looseEqual, looseIndexOf } from 'shared/util'
import { mergeVNodeHook } from 'core/vdom/helpers/index'
import { warn, isAndroid, isIE9, isIE, isEdge } from 'core/util/index'
import { warn, isIE9, isIE, isEdge } from 'core/util/index'

/* istanbul ignore if */
if (isIE9) {
Expand Down Expand Up @@ -34,15 +34,13 @@ const directive = {
} else if (vnode.tag === 'textarea' || isTextInputType(el.type)) {
el._vModifiers = binding.modifiers
if (!binding.modifiers.lazy) {
el.addEventListener('compositionstart', onCompositionStart)
el.addEventListener('compositionend', onCompositionEnd)
// Safari < 10.2 & UIWebView doesn't fire compositionend when
// switching focus before confirming composition choice
// this also fixes the issue where some browsers e.g. iOS Chrome
// fires "change" instead of "input" on autocomplete.
el.addEventListener('change', onCompositionEnd)
if (!isAndroid) {
el.addEventListener('compositionstart', onCompositionStart)
el.addEventListener('compositionend', onCompositionEnd)
}
/* istanbul ignore if */
if (isIE9) {
el.vmodel = true
Expand Down
40 changes: 19 additions & 21 deletions test/unit/features/directives/model-text.spec.js
Expand Up @@ -183,27 +183,25 @@ describe('Directive v-model text', () => {
})
}

if (!isAndroid) {
it('compositionevents', function (done) {
const vm = new Vue({
data: {
test: 'foo'
},
template: '<input v-model="test">'
}).$mount()
const input = vm.$el
triggerEvent(input, 'compositionstart')
input.value = 'baz'
// input before composition unlock should not call set
triggerEvent(input, 'input')
expect(vm.test).toBe('foo')
// after composition unlock it should work
triggerEvent(input, 'compositionend')
triggerEvent(input, 'input')
expect(vm.test).toBe('baz')
done()
})
}
it('compositionevents', function (done) {
const vm = new Vue({
data: {
test: 'foo'
},
template: '<input v-model="test">'
}).$mount()
const input = vm.$el
triggerEvent(input, 'compositionstart')
input.value = 'baz'
// input before composition unlock should not call set
triggerEvent(input, 'input')
expect(vm.test).toBe('foo')
// after composition unlock it should work
triggerEvent(input, 'compositionend')
triggerEvent(input, 'input')
expect(vm.test).toBe('baz')
done()
})

it('warn invalid tag', () => {
new Vue({
Expand Down

0 comments on commit f7ca21e

Please sign in to comment.