$ Iは角ディレクティブのカルマ/ジャスミンのテストを持って説明

Question

でテストするために1つの値以上のものを提供しています。しかし、私はPlaceholderSupportService()の値をfalseにしました。私はtrueとこの値を持っている2番目のテストを実行したい。 itの文の中で$provideにアクセスできないようですが、どうすればいいですか？

Answer 1

あなたはPlaceholderSupportServiceに変数を返すよう指示できます。そして、テストブロックで、変数の値を変更します。これは問題を解決するはずです。ここにその例があります：

describe('placeholder directive', function() { 

    // Bindable members 
    var element; 
    var providerResult = false; //Here is the variable that you will change. 

    // Load module 
    beforeEach(angular.mock.module('app')); 

    // Mock service response 
    beforeEach(module(function($provide) { 
    $provide.value('PlaceholderSupportService', function() { 
     return providerResult; 
    }); 
    })); 

    // Check the correct HTML is rendered 
    it('Renders placeholder as input value when placeholder is not supported', inject(function($timeout) { 
    element = $compile('<input name="test" placeholder="Test" />')($rootScope); 
    $rootScope.$digest(); 
    $timeout.flush(); 
    expect(element[0].value).toBe('Test'); 
    })); 

    // Check the correct HTML is rendered 
    it('Renders placeholder as input value when placeholder is supported', inject(function($timeout) { 
    providerResult = true; //Here I will change the result of my PlaceholderSupportService 
    element = $compile('<input name="test" placeholder="Test" />')($rootScope); 
    $rootScope.$digest(); 
    $timeout.flush(); 
    expect(element[0].value).toBe('Test'); 
    })); 

}); 

Answer 2

itごとにbeforeEachを与えるために、テストを簡単に再構成できます。このコードはおそらくちょっと整理できますが、ここにその考えがあります。

describe('placeholder directive', function() { 
    // Bindable members 
    var element; 

    describe('when placeholder is supported', function() { 
    // Load module 
    beforeEach(angular.mock.module('app')); 

    // Mock service response 
    beforeEach(module(function($provide) { 
     $provide.value('PlaceholderSupportService', function() { 
     return true; 
     }); 
    })); 

    // Bind references to global variables 
    beforeEach(inject(function($compile, $rootScope) { 
     element = $compile('<input name="test" placeholder="Test" />')($rootScope); 
     $rootScope.$digest(); 
    })); 

    // Check the correct HTML is rendered 
    it('Renders placeholder as input value when placeholder is not supported', inject(function($timeout) { 
     $timeout.flush(); 
     expect(element[0].value).toBe('Test'); 
    })); 
    }); 

    describe('when placeholder is not supported', function() { 
    // Load module 
    beforeEach(angular.mock.module('app')); 

    // Mock service response 
    beforeEach(module(function($provide) { 
     $provide.value('PlaceholderSupportService', function() { 
     return false; 
     }); 
    })); 

    // Bind references to global variables 
    beforeEach(inject(function($compile, $rootScope) { 
     element = $compile('<input name="test" placeholder="Test" />')($rootScope); 
     $rootScope.$digest(); 
    })); 

    // Check the correct HTML is rendered 
    it('Renders placeholder as input value when placeholder is not supported', inject(function($timeout) { 
     $timeout.flush(); 
     expect(element[0].value).toBe('Test'); 
    })); 
    }); 
});