Question

我现在已经学习了AngularJS一段时间，并且在成为一名后端开发人员多年后，我终于开始了解它的工作原理。

但是，我很难理解单元测试如何与Karma + Jasmine一起使用。

我读过的每一篇文章要么停止测试一个控制器$ scope变量的值，要么潜入到深层，我会在第一段中丢失。

我希望有人可以为这个控制器编写一个演示测试，这样我就可以了解如何使用私有变量测试控制器功能等。

financeApp.controller('navController', ['$scope', '$resource', '$cookies', '$location', function ($scope, $resource, $cookies, $location) {
    // Set default values
    $scope.resultList = [];
    $scope.cookieExp = moment().add(3, 'months').toDate();
    $scope.dataLoaded = true;
    $scope.codesList = [];

    // Update watchlist item stock prices
    $scope.updateWatchItem = function (items) {

        sqlstring = items.join("\",\"");

        var financeAPI = $resource('https://query.yahooapis.com/v1/public/yql', {callback: "JSON_CALLBACK" }, {get: {method: "JSONP"}});        
        financeAPI.get({q: decodeURIComponent('select%20*%20from%20yahoo.finance.quote%20where%20symbol%20in%20(%22' + sqlstring + '%22)'),
                format: 'json', env: decodeURIComponent('store%3A%2F%2Fdatatables.org%2Falltableswithkeys')})
        .$promise.then(function (response) {
                var quotes = response.query.results.quote;
                quotes = Array.isArray(quotes) ? quotes : [quotes];
                quotes.forEach(function (quote) {
                    $scope.createWatchItem(quote);
                });

            }, function (error) {
                alert("ERROR: There was an issue accessing the finance API service.");
            });
    };

    // Add a new watchlist item (triggered on button click)
    $scope.newWatchItem = function () {
        var newcode = $scope.asxcodeinput;

        if (newcode == null) {
            alert('Please enter a valid ASX equities code...');
            return;
        }
        else if ($scope.codesList.indexOf(newcode + '.AX') > -1) {
            alert('You are already tracking ' + newcode.toUpperCase() + '!');
            return;
        }

        $scope.dataLoaded = false;

        var financeAPI = $resource('https://query.yahooapis.com/v1/public/yql', {callback: "JSON_CALLBACK" }, {get: {method: "JSONP"}});        
        financeAPI.get({q: decodeURIComponent('select%20*%20from%20yahoo.finance.quote%20where%20symbol%20in%20(%22' + newcode + '.AX%22)'),
                format: 'json', env: decodeURIComponent('store%3A%2F%2Fdatatables.org%2Falltableswithkeys')})
        .$promise.then(function (response) {
                $scope.dataLoaded = true;
                var quote = response.query.results.quote;

                if(quote.StockExchange != null) {
                    $scope.createWatchItem(quote);
                    $cookies.putObject('codesCookie', $scope.codesList, {expires: $scope.cookieExp});
                    $location.path('/' + (quote.Symbol).split('.')[0].toUpperCase());
                }
                else {
                    alert("Woops! Looks like that stock doesn't exist :(");
                }
            }, function (error) {
                alert("ERROR: There was an issue accessing the finance API service.");
            });
        $scope.asxcodeinput = "";
    };

    // Delete a watchlist item (triggered on delete icon click)
    $scope.deleteWatchlistItem = function (asxcode) {
        $scope.resultList.forEach(function (result, key) {
            if(result.Symbol == asxcode) {
                $scope.resultList.splice(key, 1);
            }
        });
        $scope.codesList.forEach(function (code, key) {
            if(code == asxcode) {
                $scope.codesList.splice(key, 1);
            }
        });
        $cookies.putObject('codesCookie', $scope.codesList, {expires: $scope.cookieExp});

        $location.path('/');
    };

    // Add new watchlist item to lists of watched items
    $scope.createWatchItem = function (quote) {
        $scope.resultList.push(quote);
        $scope.codesList.push(quote.Symbol);
    };

    // Get current page for navigation menu CSS
    $scope.isActive = function (location) {
        return location === $location.path();
    };

    // If the cookie is set and not empty, populate the watchlist items with the cookie contents
    if($cookies.getObject('codesCookie') && $cookies.getObject('codesCookie').length > 0) {
        $scope.updateWatchItem($cookies.getObject('codesCookie'));
    }
}]);

另外，如果有人可以在AngularJS中推荐一篇易于阅读的关于单元测试的文章，我会很感激。

Answer 1

开始测试是一个很大的难题。我建议在角度站点上查看教程页面REST和自定义服务，并将资源内容放入服务中。

我建议在https://www.youtube.com/channel/UC4Avh_hoUNIJ0WL2XpcLkog查看关于茉莉花的一些好视频我建议你查看并包括关于间谍的那个。

AngularJS茉莉花测试

1 个答案: