6

come posso direttive di unit test che utilizzano TemplateURL per caricare i modelli?direttive di test che utilizza i modelli

Poiché $ httpBackend è una simulazione, non caricherà neanche i modelli. Vorrei essere in grado di usare qualcosa come

$httpBackend.whenGET(/^\/views\//).passThrough(); 

e lasciare che effettivamente ottenere i modelli, ma non ho capito come farlo correttamente.

Penso di avere qualcosa di confuso riguardo alle direttive dell'unità di prova. Disclaimer: Non ho esperienza di test, né utilizzo di gelsomino né testacular.

Qualsiasi aiuto è apprezzato.

risposta

4

Grazie a pkozlowski.opensource per avermi condotto nella giusta direzione!

Per chiunque chiedendo come ho risolto:

  1. Aggiungi https://npmjs.org/package/grunt-angular-templates al progetto.
  2. Aggiungere un'attività di compilazione per compilare tutti i modelli in un file js.

Questo file JS registrerà ora un modulo (il nome può essere configurato nel file grunt).

In tutti i test dipendenti dai modelli è necessario caricare questo modulo.

prova Esempio:

'use strict'; 

describe('Component: comments', function() { 
    beforeEach(module('studentportalenApp'), module('app.templates')); 

    var element; 

    it('should render an error message if type is not recognized', inject(function($rootScope, $compile) { 
    element = angular.element('<comments></comments>'); 
    element = $compile(element)($rootScope); 
    expect(element.html()).toBe('Comments directive type not recognized.'); 
    })); 
}); 

essere attenzione per ottenere le vostre opinioni utilizzando esattamente lo stesso URL come definito nel modulo app.templates. Cioè/views/and not views /, altrimenti non corrisponderà ai percorsi della cache del modello e al fuoco della richiesta comunque.

+0

Questo ha aiutato! Avevo anche bisogno di un'altra cosa per farlo funzionare, e cioè chiamare '$ rootScope. $ Digest()' dopo il passo '$ compile'. Senza di ciò, il test non vedrebbe alcun contenuto nell'elemento. – Dave

8

IMO il modo più semplice di testare le direttive che dipendono dai modelli (a cui fa riferimento lo templateUrl) consiste nel mettere tali modelli nello $templateCache in primo piano. Di solito questo è fatto dal processo di costruzione.

In ulteriori dettagli: ogni markup del modello viene convertito nel codice JavaScript e inserito nello $templateCache. Inoltre, viene generato un modulo AngularJS (con il nome di un modulo che rappresenta il percorso di un modello).

Applicando questa tecnica abbiamo solo i file JavaScript da gestire e non abbiamo bisogno di prendere in giro le chiamate HTTP. Il rovescio della medaglia è che hai bisogno di un ulteriore passo di costruzione.

credo che in origine questa tecnica è stato reso popolare dall'ottimo repository Vojta Jina: https://github.com/vojtajina/ng-directive-testing dove si possono vedere i modelli di preparazione here e il test vero riferimento a un modulo con un modello di precarico here.

+0

Grazie mille per avermi messo sulla strada giusta! Dopo il tuo input ho trovato questa attività di build grunt che mi ha aiutato a compilare i template in JS. Link: https://npmjs.org/package/grunt-angular-templates –

Problemi correlati