javascript - Testing a directive in angular -

i have directive in angular dynamically creates 5 buttons. writing unit tests , decided write 1 tests if buttons present. cannot seem test pass. here of code.

test.js:

    beforeeach(inject(function($compile,$rootscope,$location,$httpbackend,$route) {      location = $location;     scope = $rootscope.$new();      route = $route;      $httpbackend.whenget('partials/options/options-skeleton.html')                 .respond(200);     elm = angular.element("<options></options>");       httpbackend = $httpbackend;     $compile(elm)(scope);     scope.$digest();  })); describe('initial value test', function(){      it('should have 5 buttons', function(){         var options = elm.find('div');         var innerelm = options.find('div');         expect(innerelm.length).to.equal(5);     }); }); 

directive html:

<div class="row row-100" style=";margin-bottom: 20px">       <div style="" class="small-12 medium-4 large-4 columns">            <ul id="options-button-wrapper">               <li ng-repeat="option in options.optionsarray track $index">                  <md-button aria-label="{{option}}" class="md-raised option-button" md-theme="green" ng-disabled="disablealloptions">{{option}}</md-button>               </li>            </ul>       </div> </div> 

the output keep getting is:

assertionerror: expected 0 equal 5 

i have tried using json.stringify() on var options in test see element set kept getting error:

typeerror: json.stringify cannot serialize cyclic structures.   

any , appreciated. , if anymore code needed please let me know , update question. in advance.

update:

i have tried logging out

console.log(angular.element("<options></options>")); 

and output is:

log: {0: <options></options>, length: 1} 

i assumed using:

$compile(elm)(scope); 

would cause directive initialized , log output templateurl loaded via directive.