个人中心
gpt4 book ai didi

javascript - 使用 $httpBackend 模拟 $http 调用更改预期的 url Angular

转载 作者：行者123 更新时间：2023-12-03 03:24:58 24 4
gpt4 key购买 nike

我正在尝试测试使用 $http 的服务

 var APIClient = function($http) {
     this.send = function(data) {
         $http({
             method: data.method,
             url: data.url,
             headers: data.headers,
             data: data.data
         }).success(function(response, status) {
             data.success(response, status);
         }).error(function(response, status) {
             data.error(response, status);
         });
     }
 }

 angular.module('api.client', []).factory('APIClient', ['$http'
     function($http) {
         var client = new APIClient($http);

         return {
             send: function(data) {
                 return client.send(data);
             },
         }

     }
 ]);

还有测试

  describe('send', function() {

      var apiClient, $httpBackend;

      beforeEach(module('compare'));

      beforeEach(inject(function($injector) {
          $httpBackend = $injector.get('$httpBackend');
          apiClient = $injector.get('APIClient');
      }));

      it('Should check if send() exists', function() {
          expect(apiClient.send).toBeDefined();
      });

      it('Should send GET request', function(done) {
          var url = '/';

          $httpBackend.expect('GET', url).respond({});

          apiClient.send({
              url: url,
              success: function(data, status) {
                  console.log(status);
                  done();
              },
              error: function(data, status) {
                  console.log(status);
                  done();
              }
          });

          $httpBackend.flush();
      });
  });

但是我总是遇到这个错误

PhantomJS 1.9.8 (Mac OS X) send Should send GET request FAILED
        Error: Unexpected request: GET templates/test.html
        Expected GET /

预期的 url 始终是我的 app.js 中的最后一个状态在这种情况下

// Ionic Starter App

// angular.module is a global place for creating, registering and retrieving Angular modules
// 'starter' is the name of this angular module example (also set in a <body> attribute in index.html)
// the 2nd parameter is an array of 'requires'
// 'starter.services' is found in services.js
// 'starter.controllers' is found in controllers.js

angular.module('compare',
    [
        'ionic',
        'manager.user',
        'api.client',
        'api.user',
        'api.compare',
        'user.controllers',
        'test.controllers'
    ]
)

    .run(function ($ionicPlatform) {
        $ionicPlatform.ready(function () {
            // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
            // for form inputs)
            if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
                cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
            }
            if (window.StatusBar) {
                // org.apache.cordova.statusbar required
                StatusBar.styleLightContent();
            }
        });
    })

    .config(function ($stateProvider, $urlRouterProvider) {

        // Ionic uses AngularUI Router which uses the concept of states
        // Learn more here: https://github.com/angular-ui/ui-router
        // Set up the various states which the app can be in.
        // Each state's controller can be found in controllers.js
        $stateProvider

            // setup an abstract state for the tabs directive
            .state('tab', {
                url: "/tab",
                abstract: true,
                templateUrl: "templates/tabs.html"
            })

            // Each tab has its own nav history stack:

            .state('tab.dash', {
                url: '/dash',
                views: {
                    'tab-dash': {
                        templateUrl: 'templates/tab-dash.html',
                        controller: 'DashCtrl'
                    }
                }
            })

            .state('subscription', {
                url: '/subscription',
                templateUrl: 'templates/subscription.html',
                controller: 'SubscriptionCtrl'
            })

            .state('login', {
                url: '/login',
                templateUrl: 'templates/login.html',
                controller: 'LoginCtrl'
            })

            .state('test-compare', {
                url: '/test/compare',
                templateUrl: 'templates/test.html',
                controller: 'TestCompareCtrl'
            })

        // if none of the above states are matched, use this as the fallback
        $urlRouterProvider.otherwise('/login');

    });

我不明白为什么网址会改变，我给出了 / 并测试 templates/test.html 这始终是最后一个状态模板

最佳答案

您的主要问题是这一行:

beforeEach(module('compare'));

您将在此处加载整个应用程序，而不仅仅是 apiClient。本质上，您正在进行完整的集成测试，而不是单元测试。

您应该只加载 api.client。

beforeEach(module('api.client'));

需要注意一些有用的事情，您还可以执行以下操作:

$httpBackend.whenGET(/templates\/(.*)/).respond(''); 基本上忽略由路由器、 Controller 或指令加载的所有模板。如果您这样做，它仍然不会被视为单元测试，因为您并没有严格测试您的 APIClient。

另一个有用的注释:

您在 .run 或 .config 内执行的任何内容都不应该是匿名函数，这样您就可以模拟它。

这方面的一个例子是:

.config(CompareStateLoader);

CompareStateLoader.$inject = [
    '$stateProvider', 
    '$urlRouterProvider'
];

function CompareStateLoader(
    $stateProvider, 
    $urlRouterProvider
){
    //configure states here 
}

这样做将允许您模拟 CompareStateLoader 并将其加载到测试运行程序中。

有关这方面的更多信息，请参阅 John Papa 的 Angular 样式指南 here .

关于javascript - 使用 $httpBackend 模拟 $http 调用更改预期的 url Angular，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31158092/

24 4 0
文章推荐： webforms - ASP NET 4.5 Web 窗体模型绑定(bind)不适用于 DropDownList
文章推荐： gradle - 使用扩展中的参数配置自定义插件
文章推荐： android - Flutter showSearch 构建建议时的异步操作
文章推荐： asp.net - 如何在 ASP.NET 页面上使用框架？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com