QUnit Ausgabe: visuelle Trennung von Modulen

Question

Meine Tests wie folgt aussehen:

module("some module"); 

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

module("other module"); 

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

Die Ausgabe von QUnit wie dieses

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

aussehen Ist es möglich, QUnit Ausgabe der Modulnamen zu machen? Ich würde gerne haben:

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

Nach dem QUnit documentation gibt es einen Rückruf bei Modulstart (und Ende), an welcher Stelle Sie das DOM ändern könnte.

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

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

Putting Sachen in der Mitte einer Liste ist eine Art frecher DOM weise, aber es scheint, zumindest in FireFox zu arbeiten.

Answer 2

Justin Love Lösung nicht für mich arbeiten, aber Sie können die folgende JQuery Javascript nach dem Test das gleiche gewünschte Ergebnis zu erzielen, einfügen:

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>" 
       ;}) 
     } 
    }); 
});