javascript onmouseover chrome での扱い方

javascriptのマウスイベントに関した質問です

HTML要素にCanvasを生成した後、Canvas要素上でマウスのポインタを動かすと、継続的にマウスポインタの位置情報を表示する、というプログラムを作っていますが、Google Chromeではonmouseoverイベントが働かず、クリックしたときにイベント発火となるようです。Microsoft Edgeでは思った通りにマウスポインタを動かすと位置情報が継続的に取得され表示できます。

Microsoft Edge同様に、Google Chromeでもマウスポインタの位置情報を表示し続けるプログラムを作るためのアドバイスをお願いします。

コードは下記です。

<script>
function mouseOver(){
  let area=document.getElementById('canvas');
  let div =document.getElementById('div');
  area.addEventListener('mousemove',e=>{
    div.textContent=e.clientX+'.'+e.clientY;
  });
}
</script>

<canvas id="canvas" onmouseover="mouseOver()" width="200" height="200"></canvas>
<div id="div"></div>