1

私は、少なくとも 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');
    });


  });
});

テストを書くのはこれが初めてですが、高品質のコードを推進したいと考えており、学ぶことが不可欠だと感じています。繰り返しますが、助けや指示をいただければ幸いです。プランカーへのリンクは次のとおりです。

4

1 に答える 1

0

共有した plnkr は実際getWeatherにはテスト中に関数を呼び出していなかったため、テスト ケースはexpectコールバックでまったく実行されませんでした。したがって、「フラッシュする保留中の要求はありません」を取得していました。ログステートメントを追加することで、それを確認できるはずです。模擬データでテストを実行できるように、ここでplnkr をフォークして変更しました。モックしたデータは、コードが予想していたものとは異なる構造を持っていました。ここで動作することが確認できるはずです。

于 2013-11-09T22:52:46.417 に答える