Sorry, I made a mistake Replace "The ArticleID used in your test to call the endpoint is *undefined*, so the request made is http://localhost:3000/api/articles/*undefined* <http://localhost:3000/api/articles/undefined> This is not what expect $httpBackend i guess." by :
The ArticleID used in your test to call the endpoint is '*123'*, so $httpBackend expect a request to http://localhost:3000/api/articles/123 The problem is that your controller does not receive proper $routeParams, you should try to put : $controller('ArticleDetailCtrl', { $scope: scope, *$routeParams : { articleId : ArticleId }* }); Regards, Charly. On Monday, 7 July 2014 13:23:37 UTC+2, Gillian wrote: > > I'm trying to write a unit test for a controller which fetches article > details using $http service. > > > Controller: > > .controller('ArticleDetailCtrl',function($scope, Article, >> $routeParams, API_URL, ARTICLE_URL, $http, $sce){ >> >> $scope.url = API_URL + ARTICLE_URL + '/' + $routeParams.articleId; >> >> $http.get($scope.url).then(function(response) { >> //console.log(response.data); >> $scope.heading = response.data.Headline; >> $scope.rawBody = response.data.Body; >> $scope.body = $sce.trustAsHtml($scope.rawBody); >> $scope.image = response.data.Assets[0].URL; >> }); >> }); > > > > > Unit test: > > 'use strict'; >> >> describe('Controller: Article', function () { >> >> var scope, >> $httpBackend, >> articleEndpoint; >> >> >> >> // load the controller's module >> beforeEach(module('myApp')); >> >> >> describe('ArticleDetailCtrl', function () { >> >> var ArticleDetailCtrl, >> jsonObject, >> ArticleId = '123'; >> >> // Initialize the controller and a mock scope >> beforeEach(inject(function ($controller, $rootScope, >> _$httpBackend_, Article, API_URL, ARTICLE_URL) { >> >> scope = $rootScope.$new(); >> ArticleDetailCtrl = $controller('ArticleDetailCtrl', { >> $scope: scope }); >> $httpBackend = _$httpBackend_; >> articleEndpoint = API_URL + ARTICLE_URL + '/' + ArticleId; >> >> jsonObject = { >> 'Headline': 'Headline', >> 'Body': '<p>Body</p>', >> 'Assets': [ >> { >> 'URL': 'path/to/image/article1.jpg' >> } >> ] >> }; >> >> $httpBackend.when('GET', >> articleEndpoint).respond(jsonObject); >> })); >> >> afterEach(function() { >> $httpBackend.verifyNoOutstandingExpectation(); >> $httpBackend.verifyNoOutstandingRequest(); >> }); >> >> it('should fetch article details from the API', function () { >> //expect(scope.articles.length).toEqual(3); >> >> $httpBackend.expectGET(articleEndpoint); >> $httpBackend.flush(); >> }); >> >> }); >> >> }); > > > > But I keep on getting the following error: > > > Error: Unexpected request: GET >> http://localhost:3000/api/articles/undefined >> Expected GET http://localhost:3000/api/articles/123 >> at $httpBackend >> (/Users/gill/Documents/projects/angularjs-test/app/bower_components/angular-mocks/angular-mocks.js:1179) >> at sendReq >> (/Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:8181) >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:7921 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:11319 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:11405 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:12412 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular/angular.js:12224 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular-mocks/angular-mocks.js:1438 >> at >> /Users/gill/Documents/projects/angularjs-test/test/spec/controllers/article.js:77 >> Error: Unsatisfied requests: GET http://localhost:3000/api/articles/123 >> at >> /Users/gill/Documents/projects/angularjs-test/app/bower_components/angular-mocks/angular-mocks.js:1472 >> at >> /Users/gill/Documents/projects/angularjs-test/test/spec/controllers/article.js:65 > > > > This is the first time am writing unit tests which I followed along by > reading some tutorials. I don't know what am I doing wrong? > -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/d/optout.
