모의 된 httpBackend를 사용한 각도 E2E 테스트?

Question

나와 내 상사 사이에 제기 된 뜨거운 토론은 vojitajina pull request에 따라 Angular E2E testing.에 따라 e2e 테스트를 실행하기 위해 서버를 실행해야합니다. 따라서 e2e 테스트를 실행하면 실제 서버가 필요하고 실제 서버는 DB가 필요합니다. 테스트가 느려집니다. 이제는 실제 서버를 사용하지 않고 e2e를 테스트하는 방법에 대해 의문이 생깁니다. HTTPBackend 및 e2e 각도 API를 사용하여 브라우저(), 요소(), select()를 사용할 수있는 방법이 있습니까?

Answer 1

우리는 쉘 스크립트를 사용하여 시드 된 테스트 서버의 컬 요청을 주기적으로 캡처합니다. 이러한 응답은 $ httpBackend.whenGet (...). respond()를 통해 반환되어 해당 데이터를 가로 채서 반환합니다.

그래서, 우리의 index.html을

if (document.location.hash === '#test') { 
    addScript('/test/lib/angular-mocks.js'); 
    addScript('/test/e2e/ourTest.js'); 
    window.fixtures = {}; 
    addScript('/test/fixtures/tasks/tasks_p1.js'); 
    // the tasks_p1.js is generated and has "window.fixtures.tasks_p1 = ...json..." 
    addScript('/test/fixtures/tasks/tasks_p2.js'); 
    // the tasks_p2.js is generated and has "window.fixtures.tasks_p2 = ...json..." 
    addScript('/test/e2e/tasks/taskMocks.js\'><\/script>'); 
} 

ourTest.js

angular.module('ourTestApp', ['ngMockE2E','taskMocks']). 
    run(function ($httpBackend, taskMocks) { 
     $httpBackend.whenGET(/views\/.*/).passThrough(); 
     $httpBackend.whenGET(/\/fixtures.*\//).passThrough(); 

     taskMocks.register(); 

     $httpBackend.whenGET(/.*/).passThrough(); 
    }); 

taskMocks.js 몇 가지 경우에

/*global angular */ 
angular.module('taskMocks', ['ngMockE2E']). 
    factory('taskMocks', ['$httpBackend', function($httpBackend) { 
    'use strict'; 
    return { 
    register: function() { 
     $httpBackend.whenGET(..regex_for_url_for_page1..).respond(window.fixtures.tasks_p1); 
     $httpBackend.whenGET(..regex_for_url_for_page2..).respond(window.fixtures.tasks_p2); 
    } 
    }; 
}]); 

우리의 데이터는 현재 날짜와 관련이 ; 예 : "이번 주 작업"이므로 register() 메서드에서 캡처 한 데이터를 마사지합니다.

편집 우리는 지금 우리의 조롱 개체에 대한 공장을 만들 Rosie를 사용합니다. 따라서 예상되는 json 응답에 대한 CURLing 테스트 서버가 필요하지 않습니다. index.html을 더 이상이 "의 .js"비품을로드하고 모의 객체의 모양 :

/*global angular */ 
angular.module('taskMocks', ['ngMockE2E']). 
    factory('taskMocks', ['$httpBackend', function($httpBackend) { 
    'use strict'; 
    var tasks_p1 = [ Factory.build('task'), Factory.build('task')], 
     tasks_p2 = [ Factory.build('task'), Factory.build('task')] 
    return { 
    register: function() { 
     $httpBackend.whenGET(..regex_for_url_for_page1..).respond(tasks_p1); 
     $httpBackend.whenGET(..regex_for_url_for_page2..).respond(tasks_p2); 
    } 
    }; 
}]); 

Answer 2

가 귀하의 질문에 대답하려면

taskMocks.js, 그래 실제 서버를 포함하지 않고 그것을 할 수있는 방법이 없습니다 e2e 테스트에서 $ httpBackend를 사용하여 응답을 조롱 할 수는 있지만 단위 테스트에서 조롱하는 것만 큼 단순하지는 않습니다. app.js의 'ngMockE2E'뿐만 아니라 index.html에 angular-mocks.js도 포함시켜야합니다.

How to mock an AJAX request?