テスト用のディレクティブにデータを渡すときの角型ディレクティブユニットのテストの問題

Question

ディレクティブにデータを渡してテストするときのディレクティブユニットのテストの問題。

データオブジェクトをディレクティブに渡すときに問題があります。

は、私は次のエラーを取得する： "構文エラー：トークン 'オブジェクトは' 式の9欄で[]]期待し、予想外のことである[[オブジェクトのオブジェクト]が]で始まる[オブジェクト]]"

これは私のユニットテストです：

describe("Pagination:", function() { 

    var element, 
     scope, 
     mockData, 
     rootScope; 

    beforeEach(angular.mock.module("myApp")); 

    beforeEach(inject(function ($rootScope, $compile) { 
     scope = $rootScope.$new(); 

     //Seems to be an issue here: 
     mockData = { 
      data: [], 
      meta: {}, 
      links: {} 
     }; 

     element = "<pagination data=\"" + mockData + "\"></pagination>"; 
     element = $compile(element)(scope); 

     angular.element(document.body).append(element); 

     scope.$digest(); 
    }));   

    it("should emit for more data when get data is called", function() { 
     sinon.stub(scope, "$emit"); 
     scope.getData("dummyUrl"); 

     expect(scope.$emit.calledWith("pagination:getTabPage", "dummyUrl")).toEqual(true); 
    }); 
}); 

テストは罰金です。 テストの設定に問題があるようです。

これはhtmlです：前にあることに符号化されることをmockDataニーズの値

angular.module("myApp") 
    .directive("pagination", [function() { 
     return { 
      restrict: "E", 
      scope: { 
       data: "=" 
      }, 
      templateUrl: "pagination.html", 
      link: function(scope) { 
       scope.totalPages = scope.data.meta["total-pages"]; 

       scope.getData = function(pageUrl) { 
        if (pageUrl !== null) { 
         scope.$emit("pagination:getTabPage", pageUrl); 
        } 
       }; 
      } 
     }; 
}]); 

Answer 1

：これは私がテストを探していますディレクティブです

<pagination data="data"></pagination> 

文字列に結合されています。

element = "<pagination data=\"" + angular.toJson(mockData) + "\"></pagination>"; 

他のオプションは、単にHTMLにあなたのテストでコンパイルされていることをscopeのプロパティおよび参照としてmockDataオブジェクトを追加することです。

scope.mockData = { … }; 
element = "<pagination data='mockData'></pagination>"; 
element = $compile(element)(scope); 

これは私のbeforeEachです：

beforeEach(inject(function ($rootScope, $compile) { 
     scope = $rootScope.$new(); 

     scope.mockData = { 
      data: [], 
      meta: {}, 
      links: {} 
     }; 

     element = "<pagination data='mockData'></pagination>"; 
     element = $compile(element)(scope); 

     angular.element(document.body).append(element); 

     scope.$digest(); 

     otherScope = element.isolateScope(); 
    }));