When working with Angular controllers in TypeScript, you have the option to define your controller in a way that accepts the $scope as an input parameter:
class TestCtrl {
constructor($scope:ng.IScopeService) {
$scope.myData = "Information";
}
}
In order to verify properties on the scope during tests, you can do so easily by following these steps:
beforeEach(function() {
$controller("TestCtrl", { $scope: $scope });
});
it("Should have some data set upon creation", function() {
expect($scope.myData).not.toBeUndefined(); // This allows us to assert the presence of the data.
});
An alternative method is to create your controller without providing the $scope parameter in the constructor:
interface ITestScope {
myData: string;
}
class TestCtrl implements ITestScope {
myData: string; // This property will still be available on the scope.
constructor() {
this.myData = "Information";
}
}
The issue arises when trying to access and verify the scope data in tests without direct access to $scope. How would you handle this situation?