Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<head>
<title>script.aculo.us Unit test file</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="../../lib/prototype.js" type="text/javascript"></script>
<script src="../../src/scriptaculous.js" type="text/javascript"></script>
<script src="../../src/unittest.js" type="text/javascript"></script>
<link rel="stylesheet" href="../test.css" type="text/css" />
<style>
.selected { background-color: #888; }
</style>
</head>
<body>
<h1>script.aculo.us Unit test file</h1>
<p>
Tests for Ajax.Autocompleter in controls.js.
</p>
<!-- Log output -->
<div id="testlog"> </div>
<input id="ac_input" type="text" autocomplete="off" />
<div id="ac_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
<input id="ac_input_br" type="text" autocomplete="off" />
<div id="ac_update_br" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
<input id="ac2_input" type="text" autocomplete="off" />
<div id="ac2_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
<input id="actoken_input" type="text" autocomplete="off" />
<div id="actoken_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
<input id="dummy_element" type="text" autocomplete="off" />
<!-- Tests follow -->
<script type="text/javascript" language="javascript" charset="utf-8">
// <![CDATA[
new Test.Unit.Runner({
// Integration test, tests the entire cycle
testAjaxAutocompleter: function() { with(this) {
var ac = new Ajax.Autocompleter('ac_input','ac_update','_autocomplete_result.html',
{ method: 'get' }); //override so we can use a static for the result
assertInstanceOf(Ajax.Autocompleter, ac);
// box not visible
assertNotVisible('ac_update');
// focus, but box not visible
Event.simulateMouse('ac_input', 'click');
assertNotVisible('ac_update');
Event.simulateKeys('ac_input','abcdefg');
assertEqual('abcdefg', $('ac_input').value);
// check box popping up on input
wait(1000, function() { with(this) {
assertVisible('ac_update');
assertEqual('test1', $('ac_update').firstChild.firstChild.innerHTML);
assertEqual('test2', $('ac_update').firstChild.firstChild.nextSibling.innerHTML);
// intl. characters return (UTF-8)
assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update').firstChild.lastChild.innerHTML);
// first entry should be selected
assert(Element.hasClassName($('ac_update').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
// second entry should be selected
assert(!Element.hasClassName($('ac_update').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
assert(Element.hasClassName($('ac_update').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
// check selecting with <TAB>
Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_TAB});
assertEqual('test2',$('ac_input').value);
// check box going away
wait(500, function() { with(this) {
assertNotVisible('ac_update');
// check selecting with mouse click
Event.simulateKeys('ac_input','3');
assertEqual('test23', $('ac_input').value);
wait(1000, function() { with(this) {
assertVisible('ac_update');
Event.simulateMouse($('ac_update').firstChild.childNodes[4],'click');
wait(1000, function() { with(this) {
// tests if removal of 'informal' nodes and HTML escaping works
assertEqual('(GET <ME> INSTEAD)',$('ac_input').value);
assertNotVisible('ac_update');
// check cancelling with <ESC>
Event.simulateKeys('ac_input','abcdefg');
wait(1000, function() { with(this) {
assertVisible('ac_update');
assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_ESC});
assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
}});
}});
}});
}});
}});
}},
testAfterUpdateElement: function() { with(this) {
var ac = new Ajax.Autocompleter('ac2_input','ac2_update','_autocomplete_result.html',
{ method: 'get',
afterUpdateElement: function(element,selectedElement) {
element.value = 'afterupdate:' + selectedElement.tagName;
}
});
assertInstanceOf(Ajax.Autocompleter, ac);
Event.simulateMouse('ac2_input', 'click');
Event.simulateKeys('ac2_input','abcdefg');
wait(1000, function() { with(this) {
assertVisible('ac2_update');
Event.simulateKey('ac2_input','keypress',{keyCode:Event.KEY_TAB});
assertEqual('afterupdate:LI',$('ac2_input').value);
}});
}},
testTokenizing: function() { with(this) {
var actoken = new Ajax.Autocompleter('actoken_input','ac_update','_autocomplete_result.html',
{ tokens:',', method: 'get' });
assertInstanceOf(Ajax.Autocompleter, actoken);
Event.simulateKeys('actoken_input','abc');
wait(1000, function() { with(this) {
Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
assertEqual('test1',$('actoken_input').value);
Event.simulateKeys('actoken_input',',abc');
wait(1000, function() { with(this) {
Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_DOWN});
Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
assertEqual('test1,test2',$('actoken_input').value);
}});
}});
}},
// Same integration test, results has no linebreaks
testAjaxAutocompleterNoLinebreaksInResult: function() { with(this) {
var ac = new Ajax.Autocompleter('ac_input_br','ac_update_br','_autocomplete_result_nobr.html',
{ method: 'get' }); //override so we can use a static for the result
assertInstanceOf(Ajax.Autocompleter, ac);
// box not visible
assertNotVisible('ac_update_br');
// focus, but box not visible
Event.simulateMouse('ac_input_br', 'click');
assertNotVisible('ac_update_br');
Event.simulateKeys('ac_input_br','abcdefg');
assertEqual('abcdefg', $('ac_input_br').value);
// check box popping up on input
wait(1000, function() { with(this) {
assertVisible('ac_update_br');
assertEqual('test1', $('ac_update_br').firstChild.firstChild.innerHTML);
assertEqual('test2', $('ac_update_br').firstChild.firstChild.nextSibling.innerHTML);
// intl. characters return (UTF-8)
assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update_br').firstChild.lastChild.innerHTML);
// first entry should be selected
assert(Element.hasClassName($('ac_update_br').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
// second entry should be selected
assert(!Element.hasClassName($('ac_update_br').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
assert(Element.hasClassName($('ac_update_br').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
// check selecting with <TAB>
Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_TAB});
assertEqual('test2',$('ac_input_br').value);
// check box going away
wait(500, function() { with(this) {
assertNotVisible('ac_update_br');
// check selecting with mouse click
Event.simulateKeys('ac_input_br','3');
assertEqual('test23', $('ac_input_br').value);
wait(1000, function() { with(this) {
assertVisible('ac_update_br');
Event.simulateMouse($('ac_update_br').firstChild.childNodes[4],'click');
wait(1000, function() { with(this) {
// tests if removal of 'informal' nodes and HTML escaping works
assertEqual('(GET <ME> INSTEAD)',$('ac_input_br').value);
assertNotVisible('ac_update_br');
// check cancelling with <ESC>
Event.simulateKeys('ac_input_br','abcdefg');
wait(1000, function() { with(this) {
assertVisible('ac_update_br');
assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_ESC});
assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
}});
}});
}});
}});
}});
}}
});
// ]]>
</script>
</body>
</html>