Javascript Angularjs Jasmine测试：使用$backend进行api调用

我遇到了一个问题，经过至少8个小时的搜索和修补，空手而归需要社区的帮助。有一些文章试图解决类似的问题，但缺少示例，并提供了一些帮助，但不是全部。在阅读之后，我提出了以下模块和测试，我还没有弄清楚ngWeather工厂的$backend。每当我尝试对$backend.flush（）进行刷新时，都会得到一个错误，即没有挂起的请求。虽然这是一个问题，但我也不确定传递给JSONP请求的url是否正确模拟出来。如有任何指导或指示，将不胜感激

/*模块和控制器JS*/

var app = angular.module('test', []);

app.controller('MainCtrl', function ($scope, ngWeather) {
    ngWeather.getWeather(139,35).then(function(data) {
        $scope.data = data.data;
    });
});


app.factory('ngWeather', function ($http) {
   return {
       getWeather : function (lat, lon, callback) {
           $http.jsonp('http://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + lon + '&callback=JSON_CALLBACK')
             .then(function(data) {
                 callback({
                     data : data.data,
                     city : data.data.name,
                     temp : Math.floor(data.data.main.temp*(9/5)-459.67),
                     minTemp : Math.floor(data.data.main.temp_min*(9/5)-459.67),
                     maxTemp : Math.floor(data.data.main.temp_max*(9/5)-459.67),
                     humidity : data.data.main.humidity,
                     currentCondition : data.data.weather[0].main,
                     currentDescription : data.data.weather[0].description,
                     icon : data.data.weather[0].icon
                 });
             });
       }
   };
});

/*测验*/

describe('Test: ngWeather', function() {

  var ngWeather = jasmine.createSpyObj('ngWeather', ['getWeather']);
  var $httpBackend;
  beforeEach(module('test'));
  beforeEach(inject(function(_$httpBackend_) {
    $httpBackend = _$httpBackend_;
    $httpBackend.when('jsonp', '*/api.openweathermap.org/*')
      .respond({
        data : {"coord":{"lon":0,"lat":0},"sys":{"message":0.0472,"country":"US","sunrise":1383998825,"sunset":1384035744},"weather":[{"id":804,"main":"Clouds","description":"overcast clouds","icon":"04n"}],"base":"gdps stations","main":{"temp":289.68,"humidity":35,"pressure":958,"temp_min":276.48,"temp_max":301.48},"wind":{"speed":4.11,"gust":5.65,"deg":169},"clouds":{"all":92},"dt":1384022616,"id":4291884,"name":"Flatwoods","cod":200},
        city : 'Flatwoods',
        temp : 63,
        minTemp : 55,
        maxTemp : 68,
        humidity : 70,
        currentCondition : 'Clouds',
        currentDescription : 'Overcast clouds',
        icon : '04n'
      });
  }));

  it('should check if getWeather method is defined', function() {
    expect(ngWeather.getWeather).toBeDefined();
  });

  it('should check if a value is returned', function() {
    ngWeather.getWeather(139,35,function(data) {
      expect(data).not.toBe(null);
    });
  });

  it('should check if a Flatwoods is returned as city', function() {
    ngWeather.getWeather(139,35, function(data) {
      expect(data.city).toEqual('Flatwoods');
    });
  });

  it('should make a call to the api', function() {
    $httpBackend.expect('jsonp', '*/api.openweathermap.org/*')
      .respond({
        data : {"coord":{"lon":0,"lat":0},"sys":{"message":0.0472,"country":"US","sunrise":1383998825,"sunset":1384035744},"weather":[{"id":804,"main":"Clouds","description":"overcast clouds","icon":"04n"}],"base":"gdps stations","main":{"temp":289.68,"humidity":35,"pressure":958,"temp_min":276.48,"temp_max":301.48},"wind":{"speed":4.11,"gust":5.65,"deg":169},"clouds":{"all":92},"dt":1384022616,"id":4291884,"name":"Flatwoods","cod":200},
        city : 'Flatwoods',
        temp : 63,
        minTemp : 55,
        maxTemp : 68,
        humidity : 70,
        currentCondition : 'Clouds',
        currentDescription : 'Overcast clouds',
        icon : '04n'
      });

    $httpBackend.flush();

    ngWeather.getWeather(139,35, function(data) {
      expect(data.temp).toEqual('63');
    });


  });
});

---

这是我第一次尝试编写测试，但我想提高代码的质量，我觉得这对我的学习至关重要。再次感谢任何帮助或指导，

您共享的plnkr在测试期间实际上没有调用

getWeather

函数，因此您的测试用例根本没有在回调中执行

expect

。因此，您得到的是“没有悬而未决的刷新请求”。您应该能够通过添加任何日志记录语句来验证这一点。

---

我已经分叉并修改了您的plnkr，以便能够使用您的模拟数据运行测试。模拟的数据的结构与代码预期的不同。您现在应该可以看到它正在工作

啊，我明白了，非常感谢。这是我的第一次测试，我真的需要一个熟悉的视觉理解如何模拟和实现一个。是你提供的。非常感谢你的帮助。