JSFiddle - React, Tailwind, and code Playground

HTML

<div id=clickable1>Pointerdown</div>
<div id=clickable2>Touchstart</div>
<div id=clickable3>Mousedown</div>
<input type=color>
<pre></pre>

CSS

div {
  border: 1px solid black;
  background: gray;
  padding: 8px;
  margin: 8px;
  
}

JavaScript

const $ = document.querySelector.bind(document);
function handle(event) {
  $('pre').textContent = event.type;
  $('input').click();
}
$('#clickable1').addEventListener('pointerdown', handle);
$('#clickable2').addEventListener('touchstart', handle);
$('#clickable3').addEventListener('mousedown', handle);