Come posso testare il codice AngularJS usando Mocha?

Fondamentalmente, sono abbastanza esperto con Mocha (scritto migliaia di test di unità), e sono abbastanza nuovo per AngularJS (scritto solo il mio primo progetto).Come posso testare il codice AngularJS usando Mocha?

Ora mi chiedo come posso testare tutti i componenti di AngularJS usando Mocha.

So che Mocha viene eseguito nel browser e l'ho già fatto. Ma come posso strutturare e impostare le cose?

Credo che ho bisogno di:

AngularJS carico
carico Mocha
Caricare il mio test

All'interno di ciascuna delle prove, ho bisogno di caricare un controller, un servizio , ... testare. Come lo faccio? Non sto usando require.js o qualcosa di simile, i file sono solo file di script con sostanzialmente il seguente contenuto:

angular.controller('fooController', [ '$scope', function ($scope) { 
    // ... 
}]);

Come faccio riferimento e un'istanza di tale controller all'interno di un test? Lo stesso vale per i servizi, le direttive, ...

Devo creare prende in giro per $scope, $http & co. per me stesso, o c'è qualche aiuto?

Si prega di notare che sono a conoscenza del fatto che esiste il test runner Karma (precedentemente noto come Testacular), ma non voglio cambiare completamente il mio runner di test.

fonte

2013-04-30 Golo Roden

Anche se non si sta usando Karma/Testacular, dai uno sguardo ad alcuni esempi in [angular-seed] (https://github.com/angular/angular-seed). Mostrano come usi 'angular-mocks' per configurare i tuoi moduli per il test. – NilsH

Questo è piuttosto un articolo utile per testare usando mocha: http://www.yearofmoo.com/2013/01/full-spectrum-testing-with-angularjs-and-testacular.html – zlog

il progetto angular-seed non è molto utile come sta usando il gelsomino. Perché non ci sono esempi che usano mocha e il suo adattatore? –

Un modo per farlo è quello di utilizzare Angular$injector nei test:

myModule_test.js

suite('myModule', function(){ 
    setup(function(){ 
    var app = angular.module('myModule', []); 
    var injector = angular.injector(['myModule', 'ng']); 
    var service = injector.get('myService'); 
    }); 

    suite('myService', function(){ 
    test('should return correct value', function(){ 
     // perform test with an instance of service here 
    }); 
    }); 
});

tua html dovrebbe essere simile a questo:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>myModule tests</title> 
    <link rel="stylesheet" media="all" href="vendor/mocha.css"> 
</head> 
<body> 
    <div id="mocha"><p><a href=".">Index</a></p></div> 
    <div id="messages"></div> 
    <div id="fixtures"></div> 
    <script src="vendor/mocha.js"></script> 
    <script src="vendor/chai.js"></script> 
    <script src="angular.min.js"></script> 
    <script src="myModule.js"></script> 
    <script>mocha.setup('tdd')</script> 
    <script src="myModule_test.js"></script> 
    <script>mocha.run();</script> 
</body> 
</html>

fonte

2013-11-21 22:07:16

Se stai creando un servizio angolare che non ha dipendenze e non è necessario Per quanto riguarda l'angolare specifico, è possibile scrivere il modulo in modo angolare-agnostico, quindi scrivere un piccolo involucro angolare separato per esso, o verificare la presenza di angolare e creare un servizio per esso condizionatamente.

Ecco un esempio di un approccio che io uso per creare moduli che possono essere utilizzati sia in angolare, il browser, e moduli di nodi, anche per i test moka:

(function(global) { 
    //define your reusable component 
    var Cheeseburger = {}; 

    if (typeof angular != 'undefined') { 
     angular.module('Cheeseburger', []) 
      .value('Cheeseburger', Cheeseburger); 
    } 
    //node module 
    else if (typeof module != 'undefined' && module.exports) { 
     module.exports = Cheeseburger 
    } 
    //perhaps you'd like to use this with a namespace in the browser 
    else if (global.YourAppNamespace) { 
     global.YourAppNamespace.Cheeseburger = Cheeseburger 
    } 
    //or maybe you just want it to be global 
    else { 
     global.Cheeseburger = Cheeseburger 
    } 
})(this);

fonte

2014-09-09 19:28:39 undefined

Come posso testare il codice AngularJS usando Mocha?

risposta

Problemi correlati