JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<body>
<input type="text" id="text"/>
<input type="button" value="clear" id="clear"/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<pre id="result">
</pre>
</body>
</html>
JavaScript
var text = document.getElementById('text');
var result = document.getElementById('result');
var clear = document.getElementById('clear');
text.addEventListener('input', function(ev) {
result.textContent += "input:" + ev.isComposing + "\n";
});
text.addEventListener('compositionend', function(ev) {
result.textContent += "compositionend\n";
});
clear.addEventListener('click', function(ev) {
result.textContent = "";
});