올바른 인수가 메서드에 전달되었는지 확인하는 jasmine jquery 테스트

Question

자바 스크립트 테스트를 처음 사용합니다. jasmine을 사용하고 있으며 올바른 인수가 메소드에 전달되었는지 테스트해야합니다. 나는 다음과 같은 오류가

function myView(){ 
     if($('.view').is('.list')){ 
      myWindow('list'); 
     }else{ 
      myWindow('random'); 
     } 
     $('.view').toggleClass('my-list'); 
    } 

    function myWindow(list) { 
     var url = /test.json; 
     $.post(url, {"list": list}); 
    } 

Here are my tests: 

    describe('#myView', function() { 
    beforeEach(function() { 
     fixture.load('myview.html'); 
    }); 

    it('sets window to list', function(){ 
     expect(window.myWindow).toHaveBeenCalledWith('list'); 
    }); 
    }); 

:

이

내 방법입니다.

Error: Expected a spy, but got Function. 

나는 내가 다음과 같은 오류 얻을

spyOn(window, myWindow('list')); 

(I 정확한 시험에 의해 확인되어야한다 PARAM 지정하고 있기 때문에 잘못된 보인다) 기대하기 전에이 줄을 추가하는 경우 :

undefined() method does not exist 

을

누군가 위의 테스트를 작성하는 좋은 방법을 보여줄 수 있습니까?

Answer 1

spyOn의 두 번째 매개 변수는 스파이를해야 할 속성의 이름입니다. 당신이 spyOn(window, myWindow('list'));를 호출 할 때, 두 번째 매개 변수입니다myWindow('list')의 반환 값은 undefined => 발생 오류 : 소프트웨어에서

describe('#myView', function() { 
    beforeEach(function() { 
     fixture.load('myview.html'); 
    }); 

    it('sets window to list', function(){ 
     spyOn(window, "myWindow");//spy the function 
     myView();//call your method that in turn should call your spy 
     expect(window.myWindow).toHaveBeenCalledWith('list');//verify 
    }); 
    }); 

: 코드에서 undefined() method does not exist

는, 간단하게이 일을해야하고 단위 테스트에는 stub and mock objects이라는 개념이 있습니다. 이것들은 테스트중인 메소드의 의존성입니다. spyOn은 가짜 개체를 만들어 메서드를 테스트하는 것입니다.

전역 window 객체 직접을 액세스하는

, 그건 정말 단위 테스트의 문제입니다. 이하지만 자바 스크립트가 동적으로 언어를 입력 , 우리는 (이 C#을 같은 일부 정적으로 입력 된 언어 불가능) 여전히 window 개체를 조롱 할 수있어. 좋은 단위 테스트 가능 코드를 만들려면 코드를 외부에서 주입하도록 다시 디자인하는 것이 좋습니다.

function myView(awindow){ //any dependency should be injected, this is an example to inject it via parameter 

     if($('.view').is('.list')){ 
      awindow.myWindow('list'); 
     }else{ 
      awindow.myWindow('random'); 
     } 
     $('.view').toggleClass('my-list'); 
    } 

이 시도 :

describe('#myView', function() { 
    beforeEach(function() { 
     fixture.load('myview.html'); 
    }); 

    it('sets window to list', function(){ 
     var spy = {myWindow:function(list){}}; 
     spyOn(spy, "myWindow"); //create a spy 
     myView(spy); //call your method that in turn should call your spy 
     expect(spy.myWindow).toHaveBeenCalledWith('list'); //verify 
    }); 
    }); 

한가지 더,이 같은 jQuery 코드는 단위 테스트에 대한 아주 좋은 후보가 아니다 그것은 코드에서 DOM 조작을 포함한다. 시간이 있다면 angularjs 프레임 워크 (보기 (DOM)을 모델 (로직)과 분리하고 dependency injection을 사용하여 코드를 테스트 할 수 있도록해야합니다.