I've been struggling to set up this test for quite a while now... it's really puzzling why it's not functioning properly.
Here is a snippet of my Angular app:
<body ng-app="testApp">
<div class="container" droppable>
<div class="row"><navi></navi></div>
<div class="row">
<div class="col-xs-8">
<preview></preview>
<editor></editor>
</div>
<div class="col-xs-4">
<iframe src="" pull-down></iframe>
</div>
</div>
</div>
This is the relevant controller code:
testApp.controller('previewController', ['$scope', '$http', function($scope, $http) {
$scope.tmp = "test";
console.log("Initializing controller");
$.ajax({
url: "http://localhost/angularjs_testapp/request.php",
type: "POST",
success: function(data){
console.log("Server response:");
console.log(data);
$scope.data = data;},
error: function(data){
console.log("An error occurred");
console.log(data);
}
});
}]);
And here's a sample test case:
describe('previewController', function() {
beforeEach(module('testApp'));
var scope, createController;
beforeEach(inject(function ($rootScope, $controller) {
scope = $rootScope.$new();
createController = $controller('previewController', {
'$scope': scope
});
}));
it('should have value "test":', function(done) {
console.log(scope);
expect(scope.tmp).toBe("test"); //passes
expect(scope.data).toBe("hello"); //fails
});
});
The server returns the expected AJAX response when accessed directly on the website. However, during unit testing, it seems that there is an issue with communication. I attempted using promises and replacing ajax with $http.post(), but the problem persists. What could be causing this issue? Can Karma be affecting the server communication?