olamedia/blockingPromise.html

## blockingPromise.html
<!doctype html>
<html>
<head>
<meta charset="utf-8">
    <script>

    function blockingClick(){
        console.log('blocking promise');
        (new Promise((resolve, reject) => {
            let i = 0;
            while (i++ < 10000000000){
            }
        }).then(function(){
            console.log('resolved');
        }))

    }
    function isBlockingClick(){
        document.body.appendChild(document.createTextNode('Not blocked '));
        console.log('not blocked');
    }
    function over(el){
        el.style.backgroundColor = "#0f0";
        el.style.color = "#fff";
    }
    function out(el){
        el.style.backgroundColor = "#ccc";
        el.style.color = "#000";
    }
    </script>
</head>
<body>
    <button onclick="blockingClick();">Click me</button>
    <button onclick="isBlockingClick();" onmouseover="over(this)" onmouseout="out(this)">not blocked?</button>
<body>
</html>
	<!doctype html>
	<html>
	<head>
	<meta charset="utf-8">
	<script>

	function blockingClick(){
	console.log('blocking promise');
	(new Promise((resolve, reject) => {
	let i = 0;
	while (i++ < 10000000000){
	}
	}).then(function(){
	console.log('resolved');
	}))

	}
	function isBlockingClick(){
	document.body.appendChild(document.createTextNode('Not blocked '));
	console.log('not blocked');
	}
	function over(el){
	el.style.backgroundColor = "#0f0";
	el.style.color = "#fff";
	}
	function out(el){
	el.style.backgroundColor = "#ccc";
	el.style.color = "#000";
	}
	</script>
	</head>
	<body>
	<button onclick="blockingClick();">Click me</button>
	<button onclick="isBlockingClick();" onmouseover="over(this)" onmouseout="out(this)">not blocked?</button>
	<body>
	</html>