<html>
<head>
<script>
function debug(str) {
	console = document.getElementById('console');

	li = document.createElement('li');
	console.appendChild(li);
	li.appendChild(document.createTextNode(str));	
}

function runTests() { 
	if (window.testRunner) { 
		testRunner.dumpAsText();
	}
	div = document.getElementById('duplicate');
	dup1 = div.parentNode.removeChild(div);

	div = document.getElementById('duplicate');
	if (!div) {
		debug('Failed: getElementById returned null');
		return;
	}
	
	if (div.firstChild.nodeValue != 'This is the second duplicate div') {
		debug('Failed: getElementById returned the wrong div');
		return;
	}
	
	dup2 = div.parentNode.removeChild(div);
	if (document.getElementById('duplicate')) {
		debug('Failed: getElementById did not return null');
		return;
	}
	
	// Now insert the nodes again
	container = document.getElementById('container');
	container.appendChild(dup1);
	container.appendChild(dup2);
	
	if (!document.getElementById('duplicate')) {
		debug('Failed: getElementById returned null');
		return;
	}
	
	debug('Success!');
}
</script>
</head>
<body onLoad="runTests()">
This tests that getElementById works as elements with duplicate ids are added and removed. If the test is successful, the text "success" should be shown below.
<div id="container">
<div id="duplicate">This is the first duplicate div</div>
<div id="duplicate">This is the second duplicate div</div>
</div>
<ul id="console">
</li>
</body>
</html>
