JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html>
<head>
<title></title>
</head>
<body>
    <p id="output"></p>
    <script>
        var output = document.getElementById("output");
        var proto = Object.getPrototypeOf(HTMLImageElement);
        proto.newDataProperty = "src";
        var own = Object.getOwnPropertyDescriptor(proto, "src");
        output.innerHTML +="getOwnPropertyDescriptor of HTMLImageElement's prototype is " + own + "<br/>";
        (function(){
        Object.defineProperty(proto, "src", {
            get:function(bla){
                output.innerHTML += "Is the getter's \"this\" the prototype of the window element ??? " + (this==Object.getPrototypeOf(window))+ "<br/>";
            },
            set:function(val){
                output.innerHTML += "Trying to set value of " + val + "<br/>";
            }
        });
        })();
        output.innerHTML += "Going to define image tag<br/>";
    </script>
    <img src="http://www.google.com/intl/en/images/logos/chrome_logo.gif" id="chr">
    <script>
        output.innerHTML += "Going to fetch image <br/>";
        var img = document.getElementById("chr");
        output.innerHTML += "Going to trigger getter <br/>";
        var src = img.src;
        output.innerHTML += "Got: " + src + "<br/>";
        img.src = "https://javascript.ru/forum/image.php?u=20699&dateline=1502382178";
        output.innerHTML += "If set worked image should be chromium <br/>";
    </script>
</body>
</html>