angularjs - Angular directive unit test issue when passing data into the directive for testing -

angular directive unit test issue when passing data directive testing.

i'm having trouble when pass data object directive.

i following error: "syntax error: token 'object' unexpected, expecting []] @ column 9 of expression [[object object]] starting @ [object]]"

this unit test:

describe("pagination:", function () {      var element,       scope,       mockdata,       rootscope;      beforeeach(angular.mock.module("myapp"));      beforeeach(inject(function ($rootscope, $compile) {         scope = $rootscope.$new();          //seems 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 more data when data called", function () {         sinon.stub(scope, "$emit");         scope.getdata("dummyurl");          expect(scope.$emit.calledwith("pagination:gettabpage", "dummyurl")).toequal(true);     }); }); 

the test seems fine. seems issue setup of test.

this html:

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

this directive i'm looking test:

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);                     }                 };             }         }; }]); 

the value mockdata needs encoded prior being joined string.

element = "<pagination data=\"" + angular.tojson(mockdata) + "\"></pagination>"; 

the other option add mockdata object property on scope , reference in html compiling in test.

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

this 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();     }));