Consiglia come scrivere un semplice test per questo snippet di javascript? [chiuso]

2

Sto provando ad avviare il test delle unità (non usando alcun framework di test) per i miei javascript.

Ecco un esempio di ciò.

var obj = {};

obj.disableBtn = function ($btn, style) {
  $btn.attr('disabled','disabled').addClass('disabled').removeClass(style);
};

Il caso d'uso è così:

obj.disableBtn($('.submit'), 'btn-blue');

Quello che fa è semplicemente aggiungere l'attributo disabled , aggiungere la classe disabled e rimuovere lo stile btn-blue .

Si prega di avvisare come sarebbe un tipico caso di test in questo caso.

Ho un po 'di conoscenza sui test usando assert() , ma non ho idea di come procedere quando si tratta di verificare il risultato su elementi HTML.

    
posta resting 26.08.2013 - 11:30
fonte

2 risposte

1

Apprezzo che tu asserisca (). Sono semplici, potenti e non magici.

Puoi testare tutto ciò che è leggibile dal codice. Pensa "se posso if this, quindi posso assert it".

Se vuoi scrivere un test per qualcosa che aggiorna il markup, allora la domanda è 'come posso ottenere con il codice l'informazione che voglio testare?'.

Se stai usando jQuery (sembra così), allora prova a prendere il pulsante con il selettore $('.myButton') . Come scriveresti e if per controllare la proprietà di questo pulsante? Penso che tu possa farlo. Quindi utilizza lo stesso codice in assert . Sei più vicino di quanto pensi, puoi farlo!

    
risposta data 11.11.2013 - 11:31
fonte
0

Raccomando di utilizzare un framework di test dell'unità JS, come qUnit . Non è necessario reinventare gli strumenti di test delle unità da zero e sarà possibile concentrarsi sulla verifica delle funzionalità specifiche.

Potresti quindi creare un test unitario che crea un pulsante che non è disabilitato e ha le proprietà di stile "attive" ad esso associate. Successivamente, esegui la tua funzione disableBtn e asserisci che il pulsante è disabilitato e non ha più lo stile ad esso associato. Il codice del test unitario sarebbe quindi simile a:

ok(true === yourButton.prop("disabled"));
ok(false === yourButton.hasClass('btn-blue'));

(funzioni jQuery usate qui poiché siamo principalmente preoccupati per il codice di test unitario. Ovviamente puoi controllare gli attributi usando vanilla JS).

    
risposta data 11.09.2013 - 23:34
fonte

Leggi altre domande sui tag