Click on checkbox/radio should change state

Ref jquerygh-1
Closes jquerygh-21

Author: Lars Laade

jquery.simulate.js

@@ -201,7 +201,9 @@ $.extend( $.simulate.prototype, {
 	},
 
 	dispatchEvent: function( elem, type, event ) {
-		if ( elem.dispatchEvent ) {
+		if ( elem[ type ] ) {
+			elem[ type ]();
+		} else if ( elem.dispatchEvent ) {
 			elem.dispatchEvent( event );
 		} else if ( elem.fireEvent ) {
 			elem.fireEvent( "on" + type, event );

test/index.html

@@ -19,5 +19,10 @@ <h2 id="qunit-banner"></h2>
 	<h2 id="qunit-userAgent"></h2>
 	<ol id="qunit-tests"></ol>
 	<div id="qunit-fixture"></div>
+	<form id="radiocheckbox" class="hidden">
+		<input id="radiocheckbox-1" type="radio" name="radiocheckbox">
+		<input id="radiocheckbox-2" type="radio" name="radiocheckbox" checked="checked">
+		<input id="radiocheckbox-3" type="checkbox" name="radiocheckbox" checked="checked">
+	</form>
 </body>
 </html>

test/testinit.css

@@ -7,4 +7,9 @@
 	margin: 0;
 	padding: 0;
 	border: none;
+}
+
+.hidden {
+	position: absolute;
+	left: -9999px;
 }

test/unit/simulate.js

@@ -1,5 +1,30 @@
 (function() {
 
+module( "mouse events" );
+
+test( "click on checkbox triggers change", function() {
+	var input = $( "#radiocheckbox-3" ),
+		checked = input.prop( "checked" );
+
+	input.simulate( "click" );
+
+	notEqual( checked, input.prop( "checked" ), "checkbox state changed" );
+});
+
+test( "click on radio triggers change", function() {
+	var firstRadio = $( "#radiocheckbox-1" ),
+		secondRadio = $( "#radiocheckbox-2" ),
+		checked = firstRadio.prop( "checked" );
+
+	if ( checked ) {
+		secondRadio.simulate( "click" );
+	} else {
+		firstRadio.simulate( "click" );
+	}
+
+	notEqual( checked, firstRadio.prop( "checked" ), "radio state changed" );
+});
+
 var key = jQuery.simulate.keyCode,
 	keyEvents = [ "keydown", "keyup", "keypress" ],
 	i = 0;