Криво работает на сенсорных устроиствах

    div.onpointerenter = _ => {
        div.style.background = 'red';
    }

    div.onpointerleave = _ => {
        div.style.background = '#fff';
    }

  div {
    height: 2000px;
    width: 100%;
    /***touch-action: none;***/
  }

<div id=div>Наведите курсор, либо зажмите на таче и попробуйте проскролить</div>

При курсоре работает на ура, при касании тоже срабатывает, но при касании необходимо скролить вверх либо в низ.

Если скролить, то переодично срабатывает pointerleave. Можно присвоить touch-action: none;, но тогда скрол работать перестанет.

Собственно как сделать так, чтобы при касании сбрасывалось тогда когда, касания нету...