如何模擬AJAX請求？

在端到端測試期間修改scenarios.js以模擬AJAX請求的最簡單方法是什麼？如何模擬AJAX請求？

<!doctype html> 
<html lang="en" ng-app="myApp"> 
<head> 
    <meta charset="utf-8"> 
    <title>My Test AngularJS App</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular-resource.min.js"></script> 

    <script language="javascript" type="text/javascript"> 
     angular.module('myApp', ['ngResource']); 
     function PlayerController($scope,$resource){ 
     $scope.player = $resource('player.json').get(); 
     } 
    </script> 

</head> 
    <body ng-controller="PlayerController"> 
    <p>Hello {{player.name}}</p> 
    </body> 
</html>

玩家從服務器上的一個名爲player.json的文件中獲取正確，並且以下測試通過。如何將不同的json傳入此測試並阻止提取回服務器？

/* 
How do I pass in 
player.json -> {"name":"Chris"} 
*/ 
describe('my app', function() { 

    beforeEach(function() { 
    browser().navigateTo('../../app/index.html'); 
    }); 

    it('should load player from player.json', function() { 
    expect(element('p:first').text()). 
     toMatch("Hello Chris"); 
    pause(); 
    }); 

});

來源

2012-12-16 Chris

您應該使用$httpBackend from ngMockE2E module來模擬http請求。看看文檔。

來源

2012-12-17 13:38:02

我想說的是，我沒有看到文檔的ngMockE2E例子。我正在尋找添加到scenarios.js的幾行代碼。 – Chris

如果我正確理解你的問題，你不應該需要修改scenario.js。 Caio的答案是處理這種情況的標準方法 –

好的。讓我說清楚。我不明白如何去做Caio推薦的。文檔中有一些神奇的東西，例如「之後，用這個新模塊引導你的應用程序」。如何做到這一點？ – Chris

作爲開始，請將angular-mocks.js和文件（例如app.js）添加到包含ng-app聲明的index.html頁面中創建模塊的位置。

<html lang="en" ng-app="myApp"> 
    <head> 
    <script src="js/app.js"></script> 
    <script src="../test/lib/angular/angular-mocks.js"></script> 
    ...

然後在app.js文件中定義模塊並添加模擬響應。

var myAppDev = angular.module('myApp', ['ngResource','ngMockE2E']); 

myAppDev.run(function($httpBackend) { 
    var user = {name: 'Sandra'}; 
    $httpBackend.whenGET('/api/user').respond(user); 
});

來源

2012-12-24 04:32:06 Chris

看來，目前你不能只修改scenarios.js來包含$ httpBackend mocking。您將不得不添加一些其他代碼來支持它。

對我來說，最好的辦法似乎是下列

在包括「ngMockE2E」，所以你不必污染您現有的app.js測試文件夾添加myAppTest.js

'use strict'; 

angular.module('myAppTest', ['myApp', 'ngMockE2E']) 
.run(function($httpBackend) { 
    var user = {name: 'Sandra'}; 
    $httpBackend.whenGET('/api/user').respond(user); 
});

然後添加一個單獨的test-index.html，使用新的myAppTest.js。請注意，您需要包含angular-mocks.js。（這使得您的生產html文件，完整和自由嘲笑的）

<!doctype html> 
<html lang="en" ng-app="myAppTest"> 
<head> 
    <script src="lib/angular/angular.js"></script> 
    <script src="lib/angular/angular-resource.js"></script> 
    <script src="../test/lib/angular/angular-mocks.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <script src="../test/e2e/myAppTest.js"></script> 
</head> 
<body> 
    <div ng-view></div> 
</body> 
</html>

在scenarios.js運行的其他測試之前只是引用您的新測試的index.html

然後。

beforeEach(function() { 
    browser().navigateTo('../../app/test-index.html#/'); 
});

我已經適應從這個例子：

https://github.com/stephennancekivell/angular_e2e_http/tree/ngMockE2E

來源

2013-07-31 11:41:10 EdL

你到底要如何在原始應用程序中測試路線？路線配置有應用程序名稱 – wakandan

如何模擬AJAX請求？

回答

相關問題