$window resize mock not working on PhantomJS - null is not an object (evaluating 'scope.$root.$$phase')

I am trying to unit test a function in my directive that is called upon resize of the window.

The test works perfectly fine on all browsers except for PhantomJS. In case the test runs on PhantomJS it throws the error

TypeError: null is not an object (evaluating 'scope.$root.$$phase')
  at ../ui/client/bower_components/angular-media-queries/match-media.js:94

My directive is as follows:

app.directive('sideBanner',['$window', function($window) {
    return {
      templateUrl: 'test.html'
      restrict: 'E',
      scope: {
        alignTo: '@', 
        rightbanner: '='
      },
      replace: true,
      link: function(scope){
        var aligningElement = angular.element(document.getElementById(scope.alignTo));
          var offsetLeft = document.getElementById(scope.alignTo).offsetLeft;
          scope.rightbanner = aligningElement.width() + offsetLeft +5;
          angular.element($window).on("resize", function() {
            scope.rightbanner = aligningElement.width() + offsetLeft +5;
            scope.$apply();
          });
      }
    };
  }]);

And my test looks as follows:

describe('sideBanner directive', function () {
  var scope,$compile,element, $window ;
  var $document = [];
  var html = angular.element('<side-banner rightbanner="rightbanner" align-to="results-container"></side-banner>');

  $document[0] = angular.element(document); 

  beforeEach(function(){
    module('marketing');
    module('test.html');

    inject(function($rootScope, _$compile_, _$window_){
      scope = $rootScope.$new();
      $compile = _$compile_;
      $window = _$window_;
    });
  });

  beforeEach(function(){
    element = $compile(html)(scope);
    scope.$digest();
    scope.$apply();
  });

  it('should test the bannerShown function', function(){
    $document[0].find('body').append('<div id="results-container"></div>');
    var alignToElementWidth = angular.element(document.getElementById('results-container')).width();
    var offset = document.getElementById('results-container').offsetLeft;


    $document[0].find('body').append('<div id="results-container" style="width:970px"></div>');

    alignToElementWidth = angular.element(document.getElementById('results-container')).width();
    $window.innerWidth = 720;
    **angular.element($window).triggerHandler('resize');**
    scope.$digest();
    scope.$apply();
    expect(element.isolateScope().rightbanner).toEqual(alignToElementWidth - offset +5);
  });

});

It seems that PhantomJS is not able to handle the resize mock angular.element($window).triggerHandler('resize');

Tests will always break up. Is there any workaround? What am I doing wrong?