QUnitjs: come posso testare DOM elements con questa libreria?

[ctdany86]

Ciao a tutti,
volevo proporvi questo piccolo dilemma in cui mi sono trovato.
Io ho la seguente funzione nel mio main.js

function updateProgressBar (val){
    $('.player-scrub').slider({
        value: val
    });
    //console.log(val);
}

ora nel mio file test.js ho questo codice:

test('Test updateProgressbar function', function(){

    testBar(23, 23);//pass
    testBar(80, 80);//pass
    testBar(74, 75);//should fail


    function testBar (then, expect) {
        updateProgressBar(then);
        equal($('.player-scrub').slider('value'), expect, "The progressBar works properly");
    }
});

il problema è che non ricnonsce l'elemento $('.player-scrub') percheè si trova nella pagina index.html che non ho importato nella mia pagina test.html.
Quindi ho provato ad importarla ma ottengo questo errore:
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
Comunque quello che vorrei capire eè quindi come testo il cambiamento degli elementi del DOM?
E' giusto importare l'intera pagina HTML?
QUnit serve per testare funzioni javascript dove ritorniamo sempre un valore di ritorno?
Grazie ragazzi e scusate se sono stato un pò confusionario

[iacoposk8]

tu hai importato index.html in test.html? ma in che modo? usando php o un linguaggio lato server?
io per debuggare uso firebug, da li ti accorgi subito con i breackpoint cosa esegue e cosa non trova

[ctdany86]

tu hai importato index.html in test.html? ma in che modo? usando php o un linguaggio lato server?
io per debuggare uso firebug, da li ti accorgi subito con i breackpoint cosa esegue e cosa non trova

Precedentemente stavo importando la mia pagina con questo codice:
$("#includedContent").load("../bin-debug/index.html");
e avevo anche scoperto come rimediare all'errore che ottenevo, ovvero inserendo da terminale
" open -b com.google.chrome --args --disable-web-security" che mi permetteva di disabilitare le impostazioni di sicurezza di Chrome, ma adesso ho cambiato idea e sto importando la mia main page così:
<iframe id='testframe' src="../bin-debug/index.html" height="240" width="320"></iframe>
quindi dentro un iframe, ora quello che vorrei fare è entrare dentro questo iframe e controllare gli elementi che mi interessano (tipo $('.player-scrub').slider('value') ) ma non ci sto riuscendo!!
Sto usando questo modo:
$('#testframe').contents().find('player-scrub') ma neanche lo trova!!

[ctdany86]

mmm penso di aver capito come fare!! Non devo importare niente...quello che devo fare è creare l'elemento che mi interessa testare nella mia pagina test.html e quindi simulare quel che succede (o almeno spero che eè il modo giusto).

module ('Module for testing updateProgressbar', {


setup: function(){
$('body').after("<div class=\"player-scrub\"></div>");
$('.player-scrub').slider();
}
});


test('Test updateProgressbar function', function(){


testBar(23, 23);//pass
testBar(80, 80);//pass
testBar(74, 75);//fail


function testBar (then, expect) {
updateProgressBar(then);
equal($('.player-scrub').slider('value'), expect, "The progressBar works properly");
}
});

grazie comunque!!
Ritorneró presto con nuovi problemi

[iacoposk8]

ogni metodo ha i suoi pro e contro... dipende un pò dalle esigenze... son contento che tu abbia risolto