closed.bs.alert test

closed.bs.alert fires before element is removed from DOM Expected cont.length for corresponding close/closed events to be one less for closed

by Ross Nye

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<h1>closed.bs.alert test</h1>
<p>closed.bs.alert fires before element is removed from DOM</p>
<p>Expected cont.length for corresponding close/closed events to be one less for closed</p>
<div id="cont">
    <div class='alert alert-success'><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>BLAH1</div>
    <div class='alert alert-info'><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>BLAH2</div>
    <div class='alert alert-warning'><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>BLAH3</div>
</div>
<div id="out">Output (click to recount elems):</div>

JavaScript

var start = new Date().getTime();

$('.alert').append('!').on('close.bs.alert',fout).on('closed.bs.alert', fout);
$('#out').on('click',fout);

function fout(e) {
    $('#out').append('<p>#cont.length: ' + $('#cont').children().length + ', ' + e.type + '.' + e.namespace + ': ' + (e.timeStamp - start)+ 'ms</p>');
};

// if jQuery 1.9.1 > added via jsFiddle framework this won't run in IE11. unsure why.