diff options
Diffstat (limited to 'test')
| -rw-r--r-- | test/delegatetest.html | 123 | ||||
| -rw-r--r-- | test/unit/event.js | 139 |
2 files changed, 254 insertions, 8 deletions
diff --git a/test/delegatetest.html b/test/delegatetest.html new file mode 100644 index 000000000..c580b290e --- /dev/null +++ b/test/delegatetest.html @@ -0,0 +1,123 @@ +<html>
+ <head>
+ <script src='../dist/jquery.js' type='text/javascript'></script>
+ <style>
+ .red {
+ background-color: red;
+ border: solid 3px red;
+ }
+ </style>
+ </head>
+ <body>
+ <h2>Change Tests</h2>
+ <table>
+ <tr>
+ <td>
+ Change each:
+ </td>
+ <td>
+ <select class='select_test'>
+ <option value='one'>change me 1</option>
+ <option value='two'>change me 2</option>
+ <option value='three'>change me 3</option>
+ </select>
+ </td>
+ <td>
+ <select class='mselect_test' multiple="multiple">
+ <option value='one'>change me 1</option>
+ <option value='two'>change me 2</option>
+ <option value='three'>change me 3</option>
+ </select>
+ </td>
+ <td>
+ <input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox1"/>
+ <label for="checkbox1">Checkbox 1 label</label><br/>
+ <input type="checkbox" class="checkbox_test" name="mycheckbox" id="checkbox2"/>
+ <label for="checkbox2">Checkbox 2 label</label>
+ </td>
+ <td>
+ <input type="radio" class="radio_test" name="myradio" id="radio1"/>
+ <label for="radio1">Radio 1 label</label><br/>
+ <input type="radio" class="radio_test" name="myradio" id="radio2"/>
+ <label for="radio2">Radio 2 label</label>
+ </td>
+ <td>
+ <input class='test' value='' id='input' size='10' />
+ </td>
+ <td>
+ <textarea rows='2'></textarea>
+ </td>
+ <td>$().bind('change')</td>
+ </tr>
+ <tr>
+ <td>Results:</td>
+ <td id='select' class="red">SELECT</td>
+ <td id='mselect' class="red">MULTI</td>
+ <td id='checkbox' class="red">CHECKBOX</td>
+ <td id='radio' class="red">RADIO</td>
+ <td id='text' class="red">TEXT</td>
+ <td id='textarea' class="red">TEXTAREA</td>
+ <td id='boundChange' class="red">DOCUMENT</td>
+ </tr>
+ </table>
+ <h2>Submit Tests</h2>
+ <table>
+ <tr>
+ <td>
+ Submit each:
+ </td>
+ <td>
+ <form action="" id="text_submit">
+ <input class='test' type='text' value='Key Return To Submit'/>
+ </form>
+ </td>
+ <td>
+ <form action="" id="password_submit">
+ <input class='test' type='password' value=''/>
+ </form>
+ </td>
+ <td>
+ <form action="" id="submit_submit">
+ <input type='submit' value="Click Me To Submit" />
+ </form>
+ </td>
+ <td>$().bind('submit')</td>
+ </tr>
+ <tr>
+ <td>Results:</td>
+ <td id='textSubmit' class="red">TEXT</td>
+ <td id='passwordSubmit' class="red">PASSWORD</td>
+ <td id='submitSubmit' class="red">BUTTON</td>
+ <td id='boundSubmit' class="red">DOCUMENT</td>
+ </tr>
+ </table>
+
+
+ <script type='text/javascript'>
+ makeChangeFunc = function(id, prevent){
+ return function(e){
+ if(prevent)
+ e.preventDefault();
+ $(id).css("backgroundColor","green").css("border","solid 3px green");
+ setTimeout(function(){
+ $(id).css("backgroundColor","");
+ }, 700)
+ }
+ }
+
+ $(".select_test").live("change",makeChangeFunc("#select"))
+ $(".mselect_test").live("change",makeChangeFunc("#mselect"))
+ $(".checkbox_test").live("change",makeChangeFunc("#checkbox"))
+ $(".radio_test").live("change",makeChangeFunc("#radio"))
+ $('textarea').live('change', makeChangeFunc("#textarea"))
+ $('#input').live('change', makeChangeFunc("#text"))
+ $().bind('change', makeChangeFunc("#boundChange"))
+
+ $("#text_submit").live("submit", makeChangeFunc("#textSubmit", true) )
+ $("#password_submit").live("submit", makeChangeFunc("#passwordSubmit", true) )
+ $("#submit_submit").live("submit", makeChangeFunc("#submitSubmit", true) )
+ $().bind('submit', makeChangeFunc("#boundSubmit"))
+
+ </script>
+ </body>
+</html>
diff --git a/test/unit/event.js b/test/unit/event.js index 65b08af8d..1ad7c3d0c 100644 --- a/test/unit/event.js +++ b/test/unit/event.js @@ -820,20 +820,143 @@ test(".live()/.die()", function() { jQuery('span#liveSpan1').die('click'); }); -test("live with submit", function() { - var count = 0; +test("live with change", function(){ + var selectChange = 0, checkboxChange = 0; - jQuery("#testForm").live("submit", function() { - count++; - return false; + var select = jQuery("select[name='S1']") + select.live("change", function() { + selectChange++; + }); + + var checkbox = jQuery("#check2"), + checkboxFunction = function(){ + checkboxChange++; + } + checkbox.live("change", checkboxFunction); + + // test click on select + + // first click sets data + if ( !jQuery.support.changeBubbles ) { + select[0].selectedIndex = 1; + select.trigger("keyup"); + } + + // second click that changed it + selectChange = 0; + select[0].selectedIndex = select[0].selectedIndex ? 0 : 1; + select.trigger(jQuery.support.changeBubbles ? "change" : "click"); + equals( selectChange, 1, "Change on click." ); + + // test keys on select + selectChange = 0; + select[0].selectedIndex = select[0].selectedIndex ? 0 : 1; + select.trigger(jQuery.support.changeBubbles ? "change" : "keyup"); + equals( selectChange, 1, "Change on keyup." ); + + // test click on checkbox + checkbox.trigger(jQuery.support.changeBubbles ? "change" : "click"); + equals( checkboxChange, 1, "Change on checkbox." ); + + // test before activate on radio + + // test blur/focus on textarea + var textarea = jQuery("#area1"), textareaChange = 0, oldVal = textarea.val(); + textarea.live("change", function() { + textareaChange++; + }); + + if ( !jQuery.support.changeBubbles ) { + textarea.trigger("focus"); + } + + textarea.val(oldVal + "foo"); + textarea.trigger(jQuery.support.changeBubbles ? "change" : "blur"); + equals( textareaChange, 1, "Change on textarea." ); + + textarea.val(oldVal); + textarea.die("change"); + + // test blur/focus on text + var text = jQuery("#name"), textChange = 0, oldTextVal = text.val(); + text.live("change", function() { + textChange++; + }); + + if ( !jQuery.support.changeBubbles ) { + text.trigger("focus"); + } + + text.val(oldVal+"foo"); + text.trigger(jQuery.support.changeBubbles ? "change" : "blur"); + equals( textChange, 1, "Change on text input." ); + + text.val(oldTextVal); + text.die("change"); + + // test blur/focus on password + var password = jQuery("#name"), passwordChange = 0, oldPasswordVal = password.val(); + password.live("change", function() { + passwordChange++; }); + + if ( !jQuery.support.changeBubbles ) { + password.trigger("focus"); + } + + password.val(oldPasswordVal + "foo"); + password.trigger(jQuery.support.changeBubbles ? "change" : "blur"); + equals( passwordChange, 1, "Change on password input." ); + + password.val(oldPasswordVal); + password.die("change"); + + // make sure die works - jQuery("#testForm input[name=sub1]")[0].click(); - jQuery("#testForm input[name=T1]").trigger({type: "keypress", keyCode: 13}); + // die all changes + selectChange = 0; + select.die("change"); + select[0].selectedIndex = select[0].selectedIndex ? 0 : 1; + select.trigger(jQuery.support.changeBubbles ? "change" : "click"); + equals( selectChange, 0, "Die on click works." ); + + selectChange = 0; + select[0].selectedIndex = select[0].selectedIndex ? 0 : 1; + select.trigger(jQuery.support.changeBubbles ? "change" : "keyup"); + equals( selectChange, 0, "Die on keyup works." ); + + // die specific checkbox + checkbox.die("change", checkboxFunction); + checkbox.trigger(jQuery.support.changeBubbles ? "change" : "click"); + equals( checkboxChange, 1, "Die on checkbox." ); +}); + +test("live with submit", function() { + var count1 = 0, count2 = 0; - equals(2, count); + jQuery("#testForm").live("submit", function(ev) { + count1++; + ev.preventDefault(); + }); + + jQuery("body").live("submit", function(ev) { + count2++; + ev.preventDefault(); + }); + + if ( jQuery.support.submitBubbles ) { + jQuery("#testForm input[name=sub1]")[0].click(); + equals(count1,1 ); + equals(count2,1); + } else { + jQuery("#testForm input[name=sub1]")[0].click(); + jQuery("#testForm input[name=T1]").trigger({type: "keypress", keyCode: 13}); + equals(count1,2); + equals(count2,2); + } jQuery("#testForm").die("submit"); + jQuery("body").die("submit"); }); test("live with focus/blur", function(){ |