Вывод QUnit: визуальное разделение модулей

Question

Мои тесты могут выглядеть так:

module("some module");

test("test A", ...);
test("test B", ...);

module("other module");

test("test C", ...);
test("test D", ...);

Вывод QUnit будет выглядеть так

1. test A (0, 0, 0)
2. test B (0, 0, 0)
3. test C (0, 0, 0)
4. test D (0, 0, 0)

Можно ли заставить QUnit выводить имена модулей? Я хотел бы иметь:

some module
1. test A (0, 0, 0)
2. test B (0, 0, 0)

other module
3. test C (0, 0, 0)
4. test D (0, 0, 0)

Answer 1

Согласно документации QUnit , существует обратный вызов при запуске (и завершении) модуля, после чего вы можете изменить DOM.

QUnit.moduleStart = function(name) {
  var tests = document.getElementById("qunit-tests");

  if ( tests ) {    
    var mod = document.createElement("h2");
    mod.innerHTML = name;
    tests.appendChild( mod );
  }
};

Помещать что-то в середину списка - это довольно непослушно с точки зрения DOM, но, похоже, это работает, по крайней мере, в FireFox.

Answer 2

Решение Джастина Лава у меня не сработало, но вы можете вставить следующий JQuery Javascript после теста, чтобы достичь того же желаемого результата:

QUnit.done(function( details )
{
    $("#qunit-tests > li ") //the test rows
    .each(function(index, Element){
        var moduleName = $(".module-name", this).text();
        if (moduleName !== $(".module-name", this.previousSibling).text())
        {
            $(this).before( //prepend header to it
                function(){
                    return "<h3 class='module-header'>" + moduleName + "</h3>"
                ;})
        }
    });
});