Question

我编写了一个指令，询问当前的URL，并加载相应的自由式。我面临的问题是如何测试链接功能：

HTML：

<html lang="en" ng-app="myApp">
<head>
    <meta charset="UTF-8">
    <title>CSS Test</title>
    <link get-style-directive />
</head>

指令：

app.directive('getStyleDirective', ["$compile", "$location", 

function($compile, $location) {
    return {
        replace: true,
        scope: true,
        link: function(scope, element, attrs) {

            var urlValue = $location.absUrl();
            var getCSSFile;

            if (urlValue.indexOf("red") > -1) {
               getCSSFile= 'red';
            }
            else if (urlValue.indexOf("blue") > -1) {
               getCSSFile= 'blue';
            }
            else if (urlValue.indexOf("orange") > -1) {
               getCSSFile= 'orange';
            }
            else {
              getCSSFile = 'black';
            }

            var jqLiteWrappedElement = angular.element('<link href="../asset/css/' + getCSSFile + '.css" rel="stylesheet" />');
            element.replaceWith(jqLiteWrappedElement);
            $compile(jqLiteWrappedElement)(scope);
        }
    };
}]);

测试：

describe('Unit testing great quotes', function() {
  var $compile,
      $rootScope;

  beforeEach(module('myApp'));

  beforeEach(inject(function(_$compile_, _$rootScope_){
    $compile = _$compile_;
    $rootScope = _$rootScope_;
  }));

  it('Replaces the element with the appropriate content', function() {
    var element = $compile("<link get-style-directive />")($rootScope);
    console.log(element);

    $rootScope.$digest();

    it('should have 1 link tag', function () {
        expect(element[0].querySelectorAll('link').length).toEqual(1);
    });

    //it('if urlValue is blank getCSSFile should be black', function () {
    //
    //});
  });
});

上面的测试失败了，所以我将一个console.log添加到元素中，可以在控制台中看到：

Object[link.ng-scope]

Jasmine - 如何测试样式表指令

0 个答案: