v-model did not handle CompositionEvent on Android

[LeuisKen]

Version

2.5.13

Reproduction link

https://codepen.io/LeuisKen/pen/ZvydmK?editors=1010

Steps to reproduce

1、Chrome 63 on Android, select the input tag;
2、Use IME, such as Google Japanese in example;
3、Inputing contents.

What is expected?

Update data only when compositionend event fired, according to issue:
#5158 (comment)

What is actually happening?

See the screen shot in Steps to reproduce, v-model sync the input data when compositionend not fired.

---

Suggestion: Replacing isAndroid check in code https://github.com/vuejs/vue/blob/dev/src/platforms/web/runtime/directives/model.js#L42 with window.CompositionEvent.

[LeuisKen]

Giving pull request according to my suggestion: #7368

[HerringtonDarkholme]

Thanks, it sounds reasonable. Any suggestion? @ktsn @kazupon ? OP suggests that v-model should only update value after CompositionEnd if composition happens, as discussed in #5158 (comment). This especially affects Japanese Input on Android, other IME like Google Chinese input doesn't exhibit the problem at all.

The Android check dates back long ago. It looks like we just leave it untouched in the code base.

Yup, Chinese input just stop firing input event during composing. Japanese Input correctly fires input and correctly set event.isComposing to true. However, Vue uses e.target.isComposing not e.isComposing.

https://jsfiddle.net/ov5jqqss/

BTW, a very whitey test case that almost valuable to be collected in an album, hehe.

[LeuisKen]

Translate to English for more extensive discussion.
Thank you for your reasonable reply and respect.😄

[b-jan]

Hi there,

I am actually developing an application (in Nuxt.js) where I need the exact behaviour you reported.

My application has not the expected behaviour on Android. I need the v-model binding to behave when composing on Android keyboard. On Iphone, everything is working. How can we fix that?

Thank you :)