2013-04-11 2 views
13

Yasemin/AngularJS ünite test uzmanıyım. İki sayı eklemek için basit bir açısal uygulama oluşturdum, böylece Angular App için birim testleri yazmayı öğrenebilirim. Angular Doc on unit test is incomplete .Bu bloglar ve yığın taşması yanıtlarına dayanarak, ilk testimi yapıyorum ve 'enjektör' tanımlanmamış hatayı çalıştırıyorum. Birim testi için Jasmine framework kullanıyorum.
HTMLJasmine, Angular ile birlikte kullanıldığında neden 'unject' hatası aldım?

<body> 
<div ng-controller="additionCtrl"> 
    First Number: <input ng-model="NumberOne"/><br/> 
    Second Number: <input ng-model="NumberTwo"/> 
    <button ng-click="add(NumberOne, NumberTwo)">Add</button><br/> 
    Result: {{Result}} 
</div> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script> 
<script src="Scripts/additionCtrl.js"></script> 
</body> 

Denetleyici:

function additionCtrl($scope) { 
$scope.NumberOne = 0; 
$scope.NumberTwo = 0; 
$scope.Result = 0; 
$scope.add = function (a, b) { 
}; 
} 

Yasemin özellik dosyası.

describe("Addition", function() { 
var $scope, ctrl; 

beforeEach(inject(function ($rootScope, $controller) { 
    this.scope = $rootScope.$new(); 
    ctrl = $controller('additionCtrl', { 
     $scope: this.scope 
    }); 
})); 

it("should add two integer numbers.", inject(function ($controller) {   
    expect(ctrl.add(2, 3)).toEqual(5); 
})); 
}); 

Specrunner.html

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script> 
    <script type="text/javascript" src="lib/angular-mocks.js"></script> 
    <script type="text/javascript" src="lib/jasmine-1.3.1/jasmine.js"></script> 
    <script type="text/javascript" src="lib/jasmine-1.3.1/jasmine-html.js"></script> 

    <!-- include source files here... --> 
    <script type="text/javascript" src="../App/Scripts/additionCtrl.js"></script> 

    <!-- include spec files here... --> 
    <script type="text/javascript" src="spec/addition.spec.js"></script> 

Bu başarısız testtir ve test beklenen sonuçla başarısız bir kez daha sonra bunu geçmesi için gereken kodunu değiştirmek, ancak ben bir şekilde sorunu karşı karşıya am açısal alay enjektör almıyor.
Enjektör kullanmak yerine bir denetleyiciyi yenileyebileceğim bir örnek gördüm, ancak daha karmaşık testler oluşturmak için enjektör kullanmayı öğrenmeyi denemek istiyorum.
Burada basit bir şey eksik olabilir. Lütfen beni gözden kaçırdığım herhangi bir yazara yönlendirin.
Teşekkürler

cevap

11

burada (ı göndermek üzereyken sorunuzun cevabını) tam birim test kurulumu ile bir Plunker

http://plnkr.co/edit/KZGKM6

Faydalı

test senaryolarını paylaşımı için kullanılabilir bu kurulum olması bu.

+0

Bu, bir süredir aradığım şey :) – Nair

11

Sorun bulundu, angular-alay erişmek için kullandığım url yanlıştı. Ben "http://code.angularjs.org/1.0.6/angular-mocks.js" olarak değiştirdim ve ayrıca olması gerekiyordu gibi yönteme başarısız olup şimdi

<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine.js"></script> 
<script type="text/javascript" src="lib/jasmine-1.3.1/jasmine-html.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script> 
<script type="text/javascript" src="http://code.angularjs.org/1.0.6/angular-mocks.js"></script> 

komut dosyası etiketleri sırasını değiştirdi. İleride

+0

AngularJS 1.2.5 için angular-mocks.js burada barındırılan kitaplık olarak mevcuttur https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-mocks.js, gerek yok code.angularjs.org web sitesini kullanmak için. – danidemi