フォームタグの中でのenterを押しても正しく挙動しなくて困った話（Vue.js）

環境

・google chrome バージョン: 67.0.3396.99（Official Build） （64 ビット）

エンターキーを押してもログインできない

See the Pen xJGZjN by moimoi (@moimoi02649370) on CodePen.

上記のよう標準的なログインフォームを作成した。

ログインボタンを押下することでログインできる。
エンターキーを押すことでもログインが出来るべきだが、
フォームに入力した文字が消えるだけでログインができない。

formタグ内にあるbuttonタグを1つにしその他をaタグにする

See the Pen xJGZjN by moimoi (@moimoi02649370) on CodePen.

formタグのなかにあるbuttonタグの一つをaタグに変えてみたところうまく挙動した。
ログインボタンはそのままにし、Cancelボタンをaタグに変更した。

まとめ

おそらくbuttonタグが2つ存在することが不具合の原因であると推測される。