nhunzaker · August 29, 2015 14:03
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html>
 	<head>
 		<title>Event runner</title>
 		<meta charset="utf-8">
 		<script src="http://modernizr.com/downloads/modernizr-latest.js"></script>
 		<style>
 			body {
 				font-family: sans-serif;
 			}
 			table  {
 				border-collapse: collapse;
 			}
 			table th {
 				padding: 10px;
 			}
 			table td {
 				border-top: 1px solid #d9d9d9;
 				padding: 10px;
 			}
 		</style>
 	</head>
 	<body>
 		<form>
 			<input type="text" id="input" disabled />
 			<select id="select" disabled>
 				<option>Foo</option>
 			</select>
 			<textarea id="textarea" disabled>
 				Textarea
 			</textarea>
 			<button id="button" disabled></button>
 		</form>

 		<table>
 			<thead>
 				<tr>
 					<th>Element</th>
 					<th>Event</th>
 				</tr>
 			</thead>
 			<tbody id="triggered">
 			</tbody>
 		</table>

 		<script>
 			// See https://developer.mozilla.org/en-US/docs/Web/Events
 			// --------------------------------------------------------- //
 			
 			var mouseEvents = [
 				'click', 'contextmenu', 'DOMMouseScroll', 'dblclick',
 				'mousedown',
 				'mouseenter', 'mouseleave', 'mousemove', 'mouseout',
 				'mouseover', 'mouseup', 'mousewheel',
 				'pointerlockchange', 'pointerlockerror', 'wheel'
 			];

 			var focusEvents = ['focus', 'blur', 'focusin', 'focusout'];

 			var keyboardEvents = ['keyup', 'keypress', 'keydown']

 			var touchEvents = [
 				'touchcancel', 'touchend', 'touchenter', 'touchleave',
 				'touchmove', 'touchstart'
 			];

 			var input = document.getElementById('input');
 			var triggered = document.getElementById('triggered');
 			var select = document.getElementById('select');
 			var textarea = document.getElementById('textarea');
 			var button = document.getElementById('button');

 			function addEntry(name, event) {
 				var row = document.createElement('tr');
 				row.innerHTML = "<td>" + name + "</td><td>" + event + "</td>";
 				triggered.appendChild(row);
 			}

 			function addListener(el, type, callback) {
 				if (el.addEventListener) {
 				    el.addEventListener(type, callback, false);
 				} else {
 				    el.attachEvent("on" + type, callback, false);
 				}
 			}

 			function dispatch (type, event, el) {
 				if (document.createEvent) {
 					var message = document.createEvent(type);
 					message.initEvent(event, true, true);
 					el.dispatchEvent(message)
 				} else {
 					var message = document.createEventObject();
 					return el.fireEvent("on" + event, message);
 				}
 			}

 			function test(pool, type, flag) {
 				var event;

 				for (var i = 0, len = pool.length; i < len; i++) {
 					event = pool[i];

 					try {
 						addListener(input, event, function() {
 							addEntry('input', event);
 						}, false);
 						dispatch(type, event, input);

 						addListener(select, event, function() {
 							addEntry('select', event);
 						}, false);
 						dispatch(type, event, select);

 						addListener(textarea, event, function() {
 							addEntry('textarea', event);
 						}, false);
 						dispatch(type, event, textarea);

 						addListener(button, event, function() {
 							addEntry('button', event);
 						}, false);
 						dispatch(type, event, textarea);

 					} catch(x) {
 						console.error(x);
 						addEntry("error", "Unable to add " + type + " for " + event);
 					}
 				}
 			}

 			test(mouseEvents, 'MouseEvent', 'mouse');
 			test(keyboardEvents, 'KeyboardEvent', 'keyboard');
 			test(focusEvents, 'FocusEvent', 'focus');

 			if (Modernizr.touch) {
 				test(touchEvents, 'TouchEvent', 'touch');
 			}
 		</script>
 	</body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Event runner</title>
	<meta charset="utf-8">
	<script src="http://modernizr.com/downloads/modernizr-latest.js"></script>
	<style>
	body {
	font-family: sans-serif;
	}
	table {
	border-collapse: collapse;
	}
	table th {
	padding: 10px;
	}
	table td {
	border-top: 1px solid #d9d9d9;
	padding: 10px;
	}
	</style>
	</head>
	<body>
	<form>
	<input type="text" id="input" disabled />
	<select id="select" disabled>
	<option>Foo</option>
	</select>
	<textarea id="textarea" disabled>
	Textarea
	</textarea>
	<button id="button" disabled></button>
	</form>

	<table>
	<thead>
	<tr>
	<th>Element</th>
	<th>Event</th>
	</tr>
	</thead>
	<tbody id="triggered">
	</tbody>
	</table>

	<script>
	// See https://developer.mozilla.org/en-US/docs/Web/Events
	// --------------------------------------------------------- //

	var mouseEvents = [
	'click', 'contextmenu', 'DOMMouseScroll', 'dblclick',
	'mousedown',
	'mouseenter', 'mouseleave', 'mousemove', 'mouseout',
	'mouseover', 'mouseup', 'mousewheel',
	'pointerlockchange', 'pointerlockerror', 'wheel'
	];

	var focusEvents = ['focus', 'blur', 'focusin', 'focusout'];

	var keyboardEvents = ['keyup', 'keypress', 'keydown']

	var touchEvents = [
	'touchcancel', 'touchend', 'touchenter', 'touchleave',
	'touchmove', 'touchstart'
	];

	var input = document.getElementById('input');
	var triggered = document.getElementById('triggered');
	var select = document.getElementById('select');
	var textarea = document.getElementById('textarea');
	var button = document.getElementById('button');

	function addEntry(name, event) {
	var row = document.createElement('tr');
	row.innerHTML = "<td>" + name + "</td><td>" + event + "</td>";
	triggered.appendChild(row);
	}

	function addListener(el, type, callback) {
	if (el.addEventListener) {
	el.addEventListener(type, callback, false);
	} else {
	el.attachEvent("on" + type, callback, false);
	}
	}

	function dispatch (type, event, el) {
	if (document.createEvent) {
	var message = document.createEvent(type);
	message.initEvent(event, true, true);
	el.dispatchEvent(message)
	} else {
	var message = document.createEventObject();
	return el.fireEvent("on" + event, message);
	}
	}

	function test(pool, type, flag) {
	var event;

	for (var i = 0, len = pool.length; i < len; i++) {
	event = pool[i];

	try {
	addListener(input, event, function() {
	addEntry('input', event);
	}, false);
	dispatch(type, event, input);

	addListener(select, event, function() {
	addEntry('select', event);
	}, false);
	dispatch(type, event, select);

	addListener(textarea, event, function() {
	addEntry('textarea', event);
	}, false);
	dispatch(type, event, textarea);

	addListener(button, event, function() {
	addEntry('button', event);
	}, false);
	dispatch(type, event, textarea);

	} catch(x) {
	console.error(x);
	addEntry("error", "Unable to add " + type + " for " + event);
	}
	}
	}

	test(mouseEvents, 'MouseEvent', 'mouse');
	test(keyboardEvents, 'KeyboardEvent', 'keyboard');
	test(focusEvents, 'FocusEvent', 'focus');

	if (Modernizr.touch) {
	test(touchEvents, 'TouchEvent', 'touch');
	}
	</script>
	</body>
	</html>