La pestaña Bootstrap de Twitter muestra un evento que no se activa al cargar la página

En una pagina donde tengon y el siguiente script (coffeescript, verifiqué el javascript compilado y parece que está bien) ...

$ ->
    init()

init = ->
    $('a[data-toggle="tab"]').on 'shown', (event) ->
        shown = event.target
        console.log("Showing tab: " + shown)

Ahora, el evento 'mostrado' no se activa al cargar la página, por lo que para la primera pestaña que se muestra en la página no hay forma de manejar esto (es decir, cargar contenido a través de xhr)

Intenté agregar esto al script anterior, para ver si activarlo manualmente podría funcionar:

$('a[data-toggle="tab"]:first').tab 'show'

... pero no fue así

Este es el código HTML que uso en mi vista

<div class="tabbable">
<ul class="nav nav-tabs">
    <li class="active">
        <a href="#updates" data-toggle="tab"><%=t :updates, :scope => 'user.profile.sections'%></a>
    </li>
    <li class="">
        <a href="#activity" data-toggle="tab"><%=t :activity, :scope => 'user.profile.sections'%></a>
    </li>
    <li class="">
        <a href="#articles" data-toggle="tab"><%=t :articles, :scope => 'user.profile.sections'%></a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="updates">

    </div>
    <div class="tab-pane" id="activity">

    </div>

    <div class="tab-pane" id="articles">

    </div>

</div>
</div>

¿Cualquier pista?

Respuestas a la pregunta(3)

Su respuesta a la pregunta