Personal tools
You are here: Home Data Concurrency bug patterns Case7


alert() makes parsing stop at unsafe point


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.



"Timing and Synchronization in JavaScript",

Source code


<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<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;
<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;
<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>

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).

Document Actions