angularjs - Mockjax 在 Angular 应用程序中的使用

Question

我是 AngularJS 的新手。

我可以通过使用 $http 服务方法 get/post 调用模拟端点来在 AngularJS 中使用 mockjax 吗？如果没有，$http 是否提供了一种创建端点并调用它们的方法？

例如MockService 是这样的

$.mockjax({
    url: '/sometest/abc',
    type: 'post',
    responseTime: 2000,
    responseText: {
        LoginSuccessful: true,
        ErrorMessage: "Login Successfuly",
        Token: "P{FsGAgtZT7T"
    }
});

我创建的 DataService 如下所示。

'use strict';

//Data service
angular.module('app').factory('dataService',['$http', function($http){

    var restCall = function (url, type, data, successCallback, errorCallback) {
        $http({
            method: type,
            url: url,
            data: data,
        }).
        success(function (data, status, headers, config) {
            successCallback(data);
        }).
        error(function (data, status, headers, config) {
            errorCallback(data)
        });
    };

    return {
        getTemplate: function (success, error) {
            restCall('/sometest/abc', 'GET', null, success, error);
     }
    };
}]);

Controller 如下

angular.module('App').controller('mainCtrl', ['$scope', 'trackService', 'dataService',
        function ($scope, TrackService, ds) {

            ds.getTemplate(function (data) {
                //do some calculation
            }, function () {
                console.warn('Something is not right');
            });}]);

我想知道这是使用 $http 的正确方法，还是应该做其他事情。这是我试图在实际代码中实现的，但不是在使用 jasmine 的单元测试中实现的。

Answer 1

I had to do this recently我发现使用 Angular 的内置功能 (angular-mocks) 非常简单。

这是基本的想法:您在测试工具中包含一个单独的模块来模拟您的请求，它是一个带有字符串或正则表达式的基本 URL 匹配器...

// in some other file that you include only for tests...
var myTestApp = angular.module('myApp', ['myApp']);

myTestApp
  .config(function ($provide, $httpProvider) {
    // Here we tell Angular that instead of the "real" $httpBackend, we want it
    // to use our mock backend
    $provide.decorator('$httpBackend', angular.mock.e2e.$httpBackendDecorator);
  })
  .run(function ($httpBackend) {

     $httpBackend.whenGET('/some/url')
       .respond(function (method, url, requestData, headers) {
         // Do whatever checks you need to on the data, headers, etc

         // Then return whatever you need to for this test.
         // Perhaps we want to test the failure scenario...
         return [
           200,                       // Status code
           { firstname: 'Jordan' },   // Response body
           {}                         // Response headers
         ];
       });
  });

检查上面的第一个链接以阅读我的博客文章。