Native event and VueJs Event modifier

[kl3sk]

Version

2.5.2

Reproduction link

https://jsfiddle.net/klesk/0x4q5kup/1/

Steps to reproduce

A/ Press enter in the input

B/ Check the checkbox (that emultae keyboard event)

What is expected?

A/ the classList should appear

B/ the classList should appear

What is actually happening?

A/ the classList of it appear

B/ nothing appear

---

Remove the modifier in the template (eg: @keyup) and the checkbox raise event.

Is that normal? Or a bug ?

[yyx990803]

enter is a built-in alias so Vue is checking for $event.keyCode == 13. So you should pass { keyCode: 13 } to the event constructor.

However, Chrome ignores the keyCode option (seems to be a bug, although keyCode is technically deprecated). For now you might have to simulate the event using the old fashioned way (document.createrEvent + initEvent).

If you want to pass the key it should be { key: 'Enter' }. We should probably make that supported somehow.