JSFiddle - React, Tailwind, and code Playground

by Abhijeet Kandalkar

HTML

<body>
<div style="height: 1100px">scroll down...</div>
<button id="a">Push State</button>
<button id="b">Back</button>
<script>
if (window.testRunner) {
    testRunner.dumpAsText();
    testRunner.waitUntilDone();
}


function pushBrowserState()
{
    console.log("pushBrowserState");
    history.pushState({}, '', window.location.href.split("#")[0] + "#a");
    return false;
}

function back()
{
    console.log("3. window.scrollY" + window.scrollY);

            console.log("BACK");
            console.log("4.window.scrollY" + window.scrollY);
            history.back();
            console.log("5.window.scrollY" + window.scrollY);
            if (window.testRunner)
                testRunner.notifyDone();

}

window.onload = function() {
    console.log("window.onload");
    if (window.eventSender) {
        //eventSender.mouseScrollBy(0, -20);
        var ele = document.getElementById("a");
        ele.addEventListener('click', pushBrowserState, false);

        // Click twice
        window.scrollBy(0, 1000);
        console.log("0. window.scrollY" + window.scrollY);
        var rect = ele.getBoundingClientRect();
        console.log(rect.left + "   " + rect.top);
        eventSender.mouseMoveTo(rect.left + 2, rect.top + 2);
        console.log("A : Click-1");
        eventSender.mouseDown();
        eventSender.mouseUp();
        console.log("A : Click-2");
        eventSender.mouseDown();
        eventSender.mouseUp();
        console.log("1. window.scrollY" + window.scrollY);

        ele = document.getElementById("b");
        ele.addEventListener('click', back, false);
        rect = ele.getBoundingClientRect();
        eventSender.mouseMoveTo(rect.left + 2, rect.top + 2);
        console.log("B : Click-1");
        eventSender.mouseDown();
        eventSender.mouseUp();
        console.log("2. window.scrollY" + window.scrollY);
    }
};
</script>
</body>