Angular directive test @ scope with watch

@-watch-directive.coffee

define [
  'config'
  'directive/radian-directive'
], (cfg, RD) ->
  RD 'yolo', [
    '$rootScope'
  ], ($rootScope) ->
    restrict: 'A'
    replace: true
    scope:
      item: '@'
    link: ($scope, $element, $attrs) ->
      $scope.$watch 'item', () ->
        console.log $scope.item

# and the test...
define [
  'config'
  'angular'
  'directive/yolo-directive'
], (cfg, A) ->
  describe 'Yolo directive', () ->
    $scope = null
    createDirective = null
    el = A.element '<div data-yolo data-item="{{yoloItems}}"></div>'

    beforeEach module cfg.ngApp

    beforeEach inject ($injector) ->
      $compile = $injector.get '$compile'
      $rootScope = $injector.get '$rootScope'

      $compiled = $compile el
      $scope = $rootScope.$new()

      createDirective = () ->
        directive = $compiled $scope
        $scope.$digest()

        directive

    it 'should load', () ->
      yoloItems = 'yolo items'
      directive = createDirective()
      $isolatedScope = directive.isolateScope()

      $scope.yoloItems = yoloItems
      $scope.$digest()

      expect($isolatedScope.item).toBe yoloItems

      yoloItems = 'yoyolo items'
      $scope.yoloItems = yoloItems
      $scope.$digest()

      expect($isolatedScope.item).toBe yoloItems