trigger multiple events test

$.trigger('e1 e2'); test and general event logger (also log(), logclear() )

by Laurens Maneschijn

HTML

<input type="text"     class="eventlog" name="i_text"   value="0" id="i_text" />
<input type="radio"    class="eventlog" name="i_radio1" value="1" id="i_radio1_1" />
<input type="radio"    class="eventlog" name="i_radio1" value="2" id="i_radio1_2" />
<input type="checkbox" class="eventlog" name="i_cbox"   value="1" id="i_cbox" />

list of events:
<a href="https://developer.mozilla.org/en-US/docs/Web/Events" target="_blank">https://developer.mozilla.org/en-US/docs/Web/Events</a>

<hr>

<textarea id="logs" style="width:100%;height:360px;" placeholder="logs"></textarea>

<!--
<hr>
example list of events:
<textarea>
DOMContentLoaded
abort
afterprint
afterscriptexecute
autocomplete
autocompleteerror
beforeprint
beforescriptexecute
beforeunload
blur
cancel
canplay
canplaythrough
change
click
close
connect
contextmenu
durationchange
emptied
error
focus
hashchange
input
invalid
languagechange
load
loadeddata
loadedmetadata
loadend
loadstart
message
offline
online
open
pagehide
pageshow
play
playing
popstate
progress
readystatechange
reset
seeked
seeking
select
show
sort
stalled
storage
submit
suspend
timeupdate
toggle
unload
volumechange
waiting

abort
beforeinput
blur
click
compositionend
compositionstart
compositionupdate
dblclick
error
focus
focusin
focusout
input
keydown
keyup
load
mousedown
mouseenter
mouseleave
mousemove
mouseout
mouseover
mouseup
resize
scroll
select
unload
wheel

touchcancel
touchend
touchmove
touchstart

visibilitychange

gotpointercapture
lostpointercapture
pointercancel
pointerdown
pointerenter
pointerleave
pointermove
pointerout
pointerover
pointerup

abort
error
load
loadend
loadstart
progress

</textarea>
-->

JavaScript

seteventlisteners();
logclear();
runtest('#i_text');
runtest('#i_radio1_1');
runtest('#i_cbox');

function runtest(sel){
  $target = $(sel);
  log('--- start', sel);
  log(1);
  // noworky. apparently it never did support triggering multiple events at once?
  $target.trigger('click change');
  log(2);
  $target.trigger('click');
  $target.trigger('change');
  log(3);
//  $target.click();
//  $target.change();
//  log(4);
  log('--- end');
}

function seteventlisteners(){
  $('.eventlog').bind('change keyup keydown keypress click mouseup mousedown mouseover mouseout focus blur', function(e){
    log('event',e.type,this.id);
  });
/*
  $('*').bind('DOMContentLoaded abort afterprint afterscriptexecute autocomplete autocompleteerror beforeinput beforeprint beforescriptexecute beforeunload blur cancel canplay canplaythrough change click close compositionend compositionstart compositionupdate connect contextmenu dblclick durationchange emptied error focus focusin focusout gotpointercapture hashchange input invalid keydown keyup languagechange load loadeddata loadedmetadata loadend loadstart lostpointercapture message mousedown mouseenter mouseleave mousemove mouseout mouseover mouseup offline online open pagehide pageshow play playing pointercancel pointerdown pointerenter pointerleave pointermove pointerout pointerover pointerup popstate progress readystatechange reset resize scroll seeked seeking select show sort stalled storage submit suspend timeupdate toggle touchcancel touchend touchmove touchstart unload visibilitychange volumechange waiting wheel', function(e){
    console.log('event:',e.type,this.id);
  });
*/
}

function log(){
	var args = [].slice.call(arguments);
  if(console && console.log){
  	console.log.apply(console, args);
  }
  $('#logs').val($('#logs').val() + args.join(',') + '\n');
  $('#logs')[0].scrollTop = Number.MAX_SAFE_INTEGER;
}
function logclear(){
  $('#logs').val('');
	console.clear();
}