Case7
Description
alert() pauses JavaScript execution except network event such as onload event. In this example, the value of a variable text is an object in line 25 of case7.html but line 30 in window.onload event handler set a variable text as 0. When button3 is clicked and alert() is called, window.onload event changes the variable text and a concurrency bug occurs.
Example
http://pswlab.kaist.ac.kr:81/case7.html
Reference
"Timing and Synchronization in JavaScript", http://dev.opera.com/articles/view/timing-and-synchronization-in-javascript/
Source code
case7.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Case7</title>
</head>
<body>
<img src="image1.jpg" onload="image1Loaded()" height="80" witdth="80" /><br>
<script type="text/javascript">
function image1Loaded() {
document.getElementById("outputImage1").innerHTML = "Image1 is loaded";
document.getElementById("button2").disabled = false;
}
</script>
<div id="outputImage1"></div>
<script type="text/javascript">
function button1Clicked() {
document.getElementById("outputButton1").innerHTML = "Button1 is clicked";
}
function button2Clicked() {
document.getElementById("outputButton2").innerHTML = "Button2 is clicked";
document.getElementById("button3").disabled = false;
}
function button3Clicked() {
text = {imageName:"image1"};
alert("Alert Message");
document.getElementById("outputButton3").innerHTML = text.imageName;
}
window.onload = function () {
text = 0;
}
</script>
<button id="button1" onclick="button1Clicked();" >Button1</button>
<button id="button2" onclick="button2Clicked();" disabled="true" >Button2</button>
<button id="button3" onclick="button3Clicked();" disabled="true" >Start Alert</button>
<div id="outputButton1"></div>
<div id="outputButton2"></div>
<div id="outputButton3"></div>
<script src='dummy.js'></script>
</body>
</html>
Execution Model
Operations and an Inital Test Case
There are 7 operations in this example.
- p1: parsing operation, parse line 1~38 of case7.html
- p2: parsing operation, parse dummy.js and line 39~41 of case7.html
- n1: network operation, trigger onload event of image1.jpg
- n2: network operation, trigger window.onload event
- u1: user event operation, trigger onclick event of button1
- u2: user event operation, trigger onclick event of button2
- u3: user event operation, trigger onclick event of button3
The inital test case: p1 - p2 - n1 - n2 - u1 - u2 - u3
Happens-before Relations
- For two parsing operations: (p1, p2)
- For two user event operations: (u1, u2), (u2, u3)
- For a parsing operation and a user event operation: (p1, u1), (p1, u2), (p1, u3)
- For a network operation: (p1, n1), (p1, n2), (p2, n2), (n1, n2)
Generated Possible Test Cases
26 test cases are generated and 10 test cases of them are buggy because they contains (u3, n2).