1.1 --- /dev/null Thu Jan 01 00:00:00 1970 +0000
1.2 +++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_autocompleter_test.html Wed Dec 31 06:09:35 2014 +0100
1.3 @@ -0,0 +1,232 @@
1.4 +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
1.5 + "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
1.6 +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
1.7 +<head>
1.8 + <title>script.aculo.us Unit test file</title>
1.9 + <meta http-equiv="content-type" content="text/html; charset=utf-8" />
1.10 + <script src="../../lib/prototype.js" type="text/javascript"></script>
1.11 + <script src="../../src/scriptaculous.js" type="text/javascript"></script>
1.12 + <script src="../../src/unittest.js" type="text/javascript"></script>
1.13 + <link rel="stylesheet" href="../test.css" type="text/css" />
1.14 + <style>
1.15 + .selected { background-color: #888; }
1.16 + </style>
1.17 +</head>
1.18 +<body>
1.19 +<h1>script.aculo.us Unit test file</h1>
1.20 +<p>
1.21 + Tests for Ajax.Autocompleter in controls.js.
1.22 +</p>
1.23 +
1.24 +<!-- Log output -->
1.25 +<div id="testlog"> </div>
1.26 +
1.27 +<input id="ac_input" type="text" autocomplete="off" />
1.28 +<div id="ac_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
1.29 +
1.30 +<input id="ac_input_br" type="text" autocomplete="off" />
1.31 +<div id="ac_update_br" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
1.32 +
1.33 +<input id="ac2_input" type="text" autocomplete="off" />
1.34 +<div id="ac2_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
1.35 +
1.36 +<input id="actoken_input" type="text" autocomplete="off" />
1.37 +<div id="actoken_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
1.38 +
1.39 +<input id="dummy_element" type="text" autocomplete="off" />
1.40 +
1.41 +<!-- Tests follow -->
1.42 +<script type="text/javascript" language="javascript" charset="utf-8">
1.43 +// <![CDATA[
1.44 +
1.45 +
1.46 + new Test.Unit.Runner({
1.47 +
1.48 + // Integration test, tests the entire cycle
1.49 + testAjaxAutocompleter: function() { with(this) {
1.50 + var ac = new Ajax.Autocompleter('ac_input','ac_update','_autocomplete_result.html',
1.51 + { method: 'get' }); //override so we can use a static for the result
1.52 + assertInstanceOf(Ajax.Autocompleter, ac);
1.53 +
1.54 + // box not visible
1.55 + assertNotVisible('ac_update');
1.56 +
1.57 + // focus, but box not visible
1.58 + Event.simulateMouse('ac_input', 'click');
1.59 + assertNotVisible('ac_update');
1.60 +
1.61 + Event.simulateKeys('ac_input','abcdefg');
1.62 + assertEqual('abcdefg', $('ac_input').value);
1.63 +
1.64 + // check box popping up on input
1.65 + wait(1000, function() { with(this) {
1.66 + assertVisible('ac_update');
1.67 + assertEqual('test1', $('ac_update').firstChild.firstChild.innerHTML);
1.68 + assertEqual('test2', $('ac_update').firstChild.firstChild.nextSibling.innerHTML);
1.69 +
1.70 + // intl. characters return (UTF-8)
1.71 + assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update').firstChild.lastChild.innerHTML);
1.72 +
1.73 + // first entry should be selected
1.74 + assert(Element.hasClassName($('ac_update').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
1.75 +
1.76 + Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
1.77 +
1.78 + // second entry should be selected
1.79 + assert(!Element.hasClassName($('ac_update').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
1.80 + assert(Element.hasClassName($('ac_update').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
1.81 +
1.82 + // check selecting with <TAB>
1.83 + Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_TAB});
1.84 + assertEqual('test2',$('ac_input').value);
1.85 +
1.86 + // check box going away
1.87 + wait(500, function() { with(this) {
1.88 + assertNotVisible('ac_update');
1.89 +
1.90 + // check selecting with mouse click
1.91 + Event.simulateKeys('ac_input','3');
1.92 + assertEqual('test23', $('ac_input').value);
1.93 + wait(1000, function() { with(this) {
1.94 + assertVisible('ac_update');
1.95 + Event.simulateMouse($('ac_update').firstChild.childNodes[4],'click');
1.96 +
1.97 + wait(1000, function() { with(this) {
1.98 + // tests if removal of 'informal' nodes and HTML escaping works
1.99 + assertEqual('(GET <ME> INSTEAD)',$('ac_input').value);
1.100 + assertNotVisible('ac_update');
1.101 +
1.102 + // check cancelling with <ESC>
1.103 + Event.simulateKeys('ac_input','abcdefg');
1.104 +
1.105 + wait(1000, function() { with(this) {
1.106 + assertVisible('ac_update');
1.107 + assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
1.108 +
1.109 + Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
1.110 + Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_ESC});
1.111 +
1.112 + assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
1.113 + }});
1.114 + }});
1.115 + }});
1.116 + }});
1.117 + }});
1.118 + }},
1.119 +
1.120 + testAfterUpdateElement: function() { with(this) {
1.121 + var ac = new Ajax.Autocompleter('ac2_input','ac2_update','_autocomplete_result.html',
1.122 + { method: 'get',
1.123 + afterUpdateElement: function(element,selectedElement) {
1.124 + element.value = 'afterupdate:' + selectedElement.tagName;
1.125 + }
1.126 + });
1.127 + assertInstanceOf(Ajax.Autocompleter, ac);
1.128 +
1.129 + Event.simulateMouse('ac2_input', 'click');
1.130 + Event.simulateKeys('ac2_input','abcdefg');
1.131 +
1.132 + wait(1000, function() { with(this) {
1.133 + assertVisible('ac2_update');
1.134 + Event.simulateKey('ac2_input','keypress',{keyCode:Event.KEY_TAB});
1.135 +
1.136 + assertEqual('afterupdate:LI',$('ac2_input').value);
1.137 + }});
1.138 + }},
1.139 +
1.140 + testTokenizing: function() { with(this) {
1.141 + var actoken = new Ajax.Autocompleter('actoken_input','ac_update','_autocomplete_result.html',
1.142 + { tokens:',', method: 'get' });
1.143 + assertInstanceOf(Ajax.Autocompleter, actoken);
1.144 +
1.145 + Event.simulateKeys('actoken_input','abc');
1.146 +
1.147 + wait(1000, function() { with(this) {
1.148 + Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
1.149 + assertEqual('test1',$('actoken_input').value);
1.150 + Event.simulateKeys('actoken_input',',abc');
1.151 + wait(1000, function() { with(this) {
1.152 + Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_DOWN});
1.153 + Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
1.154 + assertEqual('test1,test2',$('actoken_input').value);
1.155 + }});
1.156 + }});
1.157 + }},
1.158 +
1.159 + // Same integration test, results has no linebreaks
1.160 + testAjaxAutocompleterNoLinebreaksInResult: function() { with(this) {
1.161 + var ac = new Ajax.Autocompleter('ac_input_br','ac_update_br','_autocomplete_result_nobr.html',
1.162 + { method: 'get' }); //override so we can use a static for the result
1.163 + assertInstanceOf(Ajax.Autocompleter, ac);
1.164 +
1.165 + // box not visible
1.166 + assertNotVisible('ac_update_br');
1.167 +
1.168 + // focus, but box not visible
1.169 + Event.simulateMouse('ac_input_br', 'click');
1.170 + assertNotVisible('ac_update_br');
1.171 +
1.172 + Event.simulateKeys('ac_input_br','abcdefg');
1.173 + assertEqual('abcdefg', $('ac_input_br').value);
1.174 +
1.175 + // check box popping up on input
1.176 + wait(1000, function() { with(this) {
1.177 + assertVisible('ac_update_br');
1.178 + assertEqual('test1', $('ac_update_br').firstChild.firstChild.innerHTML);
1.179 + assertEqual('test2', $('ac_update_br').firstChild.firstChild.nextSibling.innerHTML);
1.180 +
1.181 + // intl. characters return (UTF-8)
1.182 + assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update_br').firstChild.lastChild.innerHTML);
1.183 +
1.184 + // first entry should be selected
1.185 + assert(Element.hasClassName($('ac_update_br').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
1.186 +
1.187 + Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
1.188 +
1.189 + // second entry should be selected
1.190 + assert(!Element.hasClassName($('ac_update_br').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
1.191 + assert(Element.hasClassName($('ac_update_br').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
1.192 +
1.193 + // check selecting with <TAB>
1.194 + Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_TAB});
1.195 + assertEqual('test2',$('ac_input_br').value);
1.196 +
1.197 + // check box going away
1.198 + wait(500, function() { with(this) {
1.199 + assertNotVisible('ac_update_br');
1.200 +
1.201 + // check selecting with mouse click
1.202 + Event.simulateKeys('ac_input_br','3');
1.203 + assertEqual('test23', $('ac_input_br').value);
1.204 + wait(1000, function() { with(this) {
1.205 + assertVisible('ac_update_br');
1.206 + Event.simulateMouse($('ac_update_br').firstChild.childNodes[4],'click');
1.207 +
1.208 + wait(1000, function() { with(this) {
1.209 + // tests if removal of 'informal' nodes and HTML escaping works
1.210 + assertEqual('(GET <ME> INSTEAD)',$('ac_input_br').value);
1.211 + assertNotVisible('ac_update_br');
1.212 +
1.213 + // check cancelling with <ESC>
1.214 + Event.simulateKeys('ac_input_br','abcdefg');
1.215 +
1.216 + wait(1000, function() { with(this) {
1.217 + assertVisible('ac_update_br');
1.218 + assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
1.219 +
1.220 + Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
1.221 + Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_ESC});
1.222 +
1.223 + assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
1.224 + }});
1.225 + }});
1.226 + }});
1.227 + }});
1.228 + }});
1.229 + }}
1.230 +
1.231 + });
1.232 +// ]]>
1.233 +</script>
1.234 +</body>
1.235 +</html>
1.236 \ No newline at end of file
