JSFiddle - React, Tailwind, and code Playground

HTML

<input id="input1" type="text" />

<div id="last-change">
    Change Summary
</div>

JavaScript

var changeType = { added: 0, deleted: 1, overwrite: 2 };
var previousValue = '';

window.setInterval(checkChange, 100);

function checkChange() {
    var newValue = $("#input1").val();
    if(newValue != previousValue) {
        showChange(findChange(previousValue, newValue));
        previousValue = newValue;
    }
}

function showChange(result) {
    $("#last-change").html("Prev: " + previousValue + "<br/>Next:" + $("#input1").val() + "<br/>");

    if(result == null)  {
        $("#last-change").html($("#last-change").html() + " no change detected");
        return;
    }
            
    switch (result.change) {
        case changeType.added:
            $("#last-change").html($("#last-change").html() + "added '" + result.added.text + "' at position " + result.added.position + "<br />");
            break;
        case changeType.deleted:
            $("#last-change").html($("#last-change").html() + "deleted '" + result.lost.text + "' at position " + result.lost.position + "<br />");
            break;
        case changeType.overwrite:
            $("#last-change").html($("#last-change").html() + "overwrote '" + result.lost.text + "' with '" + result.added.text + "' at position " + result.added.position + "<br />");
            break;
    }
}
function findChange(older, newer) {
            if(older.length != newer.length) {
                if(older.length == 0) {
                    return { change: changeType.added, added: { text: newer, position: 0 }};
                }

                if(newer.length == 0) {
                    return { change: changeType.deleted, lost: { text: older, position: 0 }};
                }

                var oldInNew = newer.indexOf(older);
                var newInOld = older.indexOf(newer);

                if(oldInNew != -1) {
                    return (oldInNew == 0) ? 
                        { change: changeType.added, added: { text: newer.substring(older.length), position: older.length }} :
                        {...